mirror of
https://github.com/Kingsrook/qqq-frontend-material-dashboard.git
synced 2025-07-17 21:00:45 +00:00
CE-882 Add button share modal dialog with button to open it;
also (unrelated) disable delete dialog's buttons while delete is running
This commit is contained in:
@ -49,11 +49,13 @@ import Tooltip from "@mui/material/Tooltip/Tooltip";
|
|||||||
import QContext from "QContext";
|
import QContext from "QContext";
|
||||||
import colors from "qqq/assets/theme/base/colors";
|
import colors from "qqq/assets/theme/base/colors";
|
||||||
import AuditBody from "qqq/components/audits/AuditBody";
|
import AuditBody from "qqq/components/audits/AuditBody";
|
||||||
import {QActionsMenuButton, QCancelButton, QDeleteButton, QEditButton} from "qqq/components/buttons/DefaultButtons";
|
import {QActionsMenuButton, QCancelButton, QDeleteButton, QEditButton, standardWidth} from "qqq/components/buttons/DefaultButtons";
|
||||||
import EntityForm from "qqq/components/forms/EntityForm";
|
import EntityForm from "qqq/components/forms/EntityForm";
|
||||||
|
import MDButton from "qqq/components/legacy/MDButton";
|
||||||
import {GotoRecordButton} from "qqq/components/misc/GotoRecordDialog";
|
import {GotoRecordButton} from "qqq/components/misc/GotoRecordDialog";
|
||||||
import HelpContent, {hasHelpContent} from "qqq/components/misc/HelpContent";
|
import HelpContent, {hasHelpContent} from "qqq/components/misc/HelpContent";
|
||||||
import QRecordSidebar from "qqq/components/misc/RecordSidebar";
|
import QRecordSidebar from "qqq/components/misc/RecordSidebar";
|
||||||
|
import ShareModal from "qqq/components/sharing/ShareModal";
|
||||||
import DashboardWidgets from "qqq/components/widgets/DashboardWidgets";
|
import DashboardWidgets from "qqq/components/widgets/DashboardWidgets";
|
||||||
import BaseLayout from "qqq/layouts/BaseLayout";
|
import BaseLayout from "qqq/layouts/BaseLayout";
|
||||||
import ProcessRun from "qqq/pages/processes/ProcessRun";
|
import ProcessRun from "qqq/pages/processes/ProcessRun";
|
||||||
@ -82,6 +84,10 @@ RecordView.defaultProps =
|
|||||||
|
|
||||||
const TABLE_VARIANT_LOCAL_STORAGE_KEY_ROOT = "qqq.tableVariant";
|
const TABLE_VARIANT_LOCAL_STORAGE_KEY_ROOT = "qqq.tableVariant";
|
||||||
|
|
||||||
|
|
||||||
|
/*******************************************************************************
|
||||||
|
** Record View Screen component.
|
||||||
|
*******************************************************************************/
|
||||||
function RecordView({table, launchProcess}: Props): JSX.Element
|
function RecordView({table, launchProcess}: Props): JSX.Element
|
||||||
{
|
{
|
||||||
const {id} = useParams();
|
const {id} = useParams();
|
||||||
@ -117,6 +123,9 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
|||||||
const [launchingProcess, setLaunchingProcess] = useState(launchProcess);
|
const [launchingProcess, setLaunchingProcess] = useState(launchProcess);
|
||||||
const [showEditChildForm, setShowEditChildForm] = useState(null as any);
|
const [showEditChildForm, setShowEditChildForm] = useState(null as any);
|
||||||
const [showAudit, setShowAudit] = useState(false);
|
const [showAudit, setShowAudit] = useState(false);
|
||||||
|
const [showShareModal, setShowShareModal] = useState(false);
|
||||||
|
|
||||||
|
const [isDeleteSubmitting, setIsDeleteSubmitting] = useState(false);
|
||||||
|
|
||||||
const openActionsMenu = (event: any) => setActionsMenu(event.currentTarget);
|
const openActionsMenu = (event: any) => setActionsMenu(event.currentTarget);
|
||||||
const closeActionsMenu = () => setActionsMenu(null);
|
const closeActionsMenu = () => setActionsMenu(null);
|
||||||
@ -622,6 +631,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
|||||||
const handleClickDeleteButton = () =>
|
const handleClickDeleteButton = () =>
|
||||||
{
|
{
|
||||||
setDeleteConfirmationOpen(true);
|
setDeleteConfirmationOpen(true);
|
||||||
|
setIsDeleteSubmitting(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleDeleteConfirmClose = () =>
|
const handleDeleteConfirmClose = () =>
|
||||||
@ -631,6 +641,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
|||||||
|
|
||||||
const handleDelete = (event: { preventDefault: () => void }) =>
|
const handleDelete = (event: { preventDefault: () => void }) =>
|
||||||
{
|
{
|
||||||
|
setIsDeleteSubmitting(true);
|
||||||
event?.preventDefault();
|
event?.preventDefault();
|
||||||
(async () =>
|
(async () =>
|
||||||
{
|
{
|
||||||
@ -639,11 +650,13 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
|||||||
await qController.delete(tableName, id)
|
await qController.delete(tableName, id)
|
||||||
.then(() =>
|
.then(() =>
|
||||||
{
|
{
|
||||||
|
setIsDeleteSubmitting(false);
|
||||||
const path = pathParts.slice(0, -1).join("/");
|
const path = pathParts.slice(0, -1).join("/");
|
||||||
navigate(path, {state: {deleteSuccess: true}});
|
navigate(path, {state: {deleteSuccess: true}});
|
||||||
})
|
})
|
||||||
.catch((error) =>
|
.catch((error) =>
|
||||||
{
|
{
|
||||||
|
setIsDeleteSubmitting(false);
|
||||||
setDeleteConfirmationOpen(false);
|
setDeleteConfirmationOpen(false);
|
||||||
console.log("Caught:");
|
console.log("Caught:");
|
||||||
console.log(error);
|
console.log(error);
|
||||||
@ -759,6 +772,44 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
|||||||
</Menu>
|
</Menu>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
||||||
|
/*******************************************************************************
|
||||||
|
** function to open the sharing modal
|
||||||
|
*******************************************************************************/
|
||||||
|
const openShareModal = () =>
|
||||||
|
{
|
||||||
|
setShowShareModal(true);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
/*******************************************************************************
|
||||||
|
** function to close the sharing modal
|
||||||
|
*******************************************************************************/
|
||||||
|
const closeShareModal = () =>
|
||||||
|
{
|
||||||
|
setShowShareModal(false);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
/*******************************************************************************
|
||||||
|
** render the share button (if allowed for table)
|
||||||
|
*******************************************************************************/
|
||||||
|
const renderShareButton = () =>
|
||||||
|
{
|
||||||
|
if (tableMetaData && (tableMetaData.name == "savedReport" || tableMetaData.name == "savedView")) // todo - not just based on name
|
||||||
|
{
|
||||||
|
const shareDisabled = false; // todo - only share if you're the owner? or do that in the modal?
|
||||||
|
return (<Box width={standardWidth} mr={3}>
|
||||||
|
<MDButton id="shareButton" type="button" color="info" size="small" onClick={() => openShareModal()} fullWidth startIcon={<Icon>share</Icon>} disabled={shareDisabled}>
|
||||||
|
Share
|
||||||
|
</MDButton>
|
||||||
|
</Box>);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (<React.Fragment />);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
const openModalProcess = (process: QProcessMetaData = null) =>
|
const openModalProcess = (process: QProcessMetaData = null) =>
|
||||||
{
|
{
|
||||||
navigate(process.name);
|
navigate(process.name);
|
||||||
@ -914,6 +965,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
|||||||
</Typography>
|
</Typography>
|
||||||
<Box display="flex">
|
<Box display="flex">
|
||||||
<GotoRecordButton metaData={metaData} tableMetaData={tableMetaData} />
|
<GotoRecordButton metaData={metaData} tableMetaData={tableMetaData} />
|
||||||
|
{renderShareButton()}
|
||||||
<QActionsMenuButton isOpen={actionsMenu} onClickHandler={openActionsMenu} />
|
<QActionsMenuButton isOpen={actionsMenu} onClickHandler={openActionsMenu} />
|
||||||
</Box>
|
</Box>
|
||||||
{renderActionsMenu}
|
{renderActionsMenu}
|
||||||
@ -962,7 +1014,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
|||||||
</DialogContent>
|
</DialogContent>
|
||||||
<DialogActions>
|
<DialogActions>
|
||||||
<Button onClick={handleDeleteConfirmClose}>No</Button>
|
<Button onClick={handleDeleteConfirmClose}>No</Button>
|
||||||
<Button onClick={handleDelete} autoFocus>
|
<Button onClick={handleDelete} autoFocus disabled={isDeleteSubmitting}>
|
||||||
Yes
|
Yes
|
||||||
</Button>
|
</Button>
|
||||||
</DialogActions>
|
</DialogActions>
|
||||||
@ -1010,6 +1062,11 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
|||||||
</Modal>
|
</Modal>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
{
|
||||||
|
showShareModal && tableMetaData && record &&
|
||||||
|
<ShareModal open={showShareModal} onClose={closeShareModal} tableMetaData={tableMetaData} record={record}></ShareModal>
|
||||||
|
}
|
||||||
|
|
||||||
</Box>
|
</Box>
|
||||||
}
|
}
|
||||||
</Box>
|
</Box>
|
||||||
|
Reference in New Issue
Block a user