QRunIO/qqq-frontend-material-dashboard
2
0
Fork 0
mirror of https://github.com/Kingsrook/qqq-frontend-material-dashboard.git synced 2025-07-17 12:50:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

CE-882 Add button share modal dialog with button to open it;

Browse Source 
also (unrelated) disable delete dialog's buttons while delete is running
This commit is contained in:
darin.kelkhoff
2024-04-24 08:32:05 -05:00
parent 387aad8087
commit ef8eecd6cb
1 changed files with 59 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/qqq/pages/records/view/RecordView.tsx
View File

@ -49,11 +49,13 @@ import Tooltip from "@mui/material/Tooltip/Tooltip";
import QContext from "QContext";
import colors from "qqq/assets/theme/base/colors";
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 MDButton from "qqq/components/legacy/MDButton";
import {GotoRecordButton} from "qqq/components/misc/GotoRecordDialog";
import HelpContent, {hasHelpContent} from "qqq/components/misc/HelpContent";
import QRecordSidebar from "qqq/components/misc/RecordSidebar";
import ShareModal from "qqq/components/sharing/ShareModal";
import DashboardWidgets from "qqq/components/widgets/DashboardWidgets";
import BaseLayout from "qqq/layouts/BaseLayout";
import ProcessRun from "qqq/pages/processes/ProcessRun";
@ -82,6 +84,10 @@ RecordView.defaultProps =
const TABLE_VARIANT_LOCAL_STORAGE_KEY_ROOT = "qqq.tableVariant";
/*******************************************************************************
** Record View Screen component.
*******************************************************************************/
function RecordView({table, launchProcess}: Props): JSX.Element
{
const {id} = useParams();
@ -117,6 +123,9 @@ function RecordView({table, launchProcess}: Props): JSX.Element
const [launchingProcess, setLaunchingProcess] = useState(launchProcess);
const [showEditChildForm, setShowEditChildForm] = useState(null as any);
const [showAudit, setShowAudit] = useState(false);
const [showShareModal, setShowShareModal] = useState(false);
const [isDeleteSubmitting, setIsDeleteSubmitting] = useState(false);
const openActionsMenu = (event: any) => setActionsMenu(event.currentTarget);
const closeActionsMenu = () => setActionsMenu(null);
@ -622,6 +631,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
const handleClickDeleteButton = () =>
{
setDeleteConfirmationOpen(true);
setIsDeleteSubmitting(false);
};
const handleDeleteConfirmClose = () =>
@ -631,6 +641,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
const handleDelete = (event: { preventDefault: () => void }) =>
{
setIsDeleteSubmitting(true);
event?.preventDefault();
(async () =>
{
@ -639,11 +650,13 @@ function RecordView({table, launchProcess}: Props): JSX.Element
await qController.delete(tableName, id)
.then(() =>
{
setIsDeleteSubmitting(false);
const path = pathParts.slice(0, -1).join("/");
navigate(path, {state: {deleteSuccess: true}});
})
.catch((error) =>
{
setIsDeleteSubmitting(false);
setDeleteConfirmationOpen(false);
console.log("Caught:");
console.log(error);
@ -759,6 +772,44 @@ function RecordView({table, launchProcess}: Props): JSX.Element
</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) =>
{
navigate(process.name);
@ -914,6 +965,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
</Typography>
<Box display="flex">
<GotoRecordButton metaData={metaData} tableMetaData={tableMetaData} />
{renderShareButton()}
<QActionsMenuButton isOpen={actionsMenu} onClickHandler={openActionsMenu} />
</Box>
{renderActionsMenu}
@ -962,7 +1014,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
</DialogContent>
<DialogActions>
<Button onClick={handleDeleteConfirmClose}>No</Button>
<Button onClick={handleDelete} autoFocus>
<Button onClick={handleDelete} autoFocus disabled={isDeleteSubmitting}>
Yes
</Button>
</DialogActions>
@ -1010,6 +1062,11 @@ function RecordView({table, launchProcess}: Props): JSX.Element
</Modal>
}
{
showShareModal && tableMetaData && record &&
<ShareModal open={showShareModal} onClose={closeShareModal} tableMetaData={tableMetaData} record={record}></ShareModal>
}
</Box>
}
</Box>