diff --git a/spiffworkflow-frontend/src/App.tsx b/spiffworkflow-frontend/src/App.tsx index 97d14fcc..65a90176 100644 --- a/spiffworkflow-frontend/src/App.tsx +++ b/spiffworkflow-frontend/src/App.tsx @@ -16,6 +16,7 @@ import UserService from './services/UserService'; import ErrorDisplay from './components/ErrorDisplay'; import APIErrorProvider from './contexts/APIErrorContext'; import ScrollToTop from './components/ScrollToTop'; +import EditorRoutes from './routes/EditorRoutes'; export default function App() { if (!UserService.isLoggedIn()) { @@ -41,6 +42,7 @@ export default function App() { } /> } /> } /> + } /> diff --git a/spiffworkflow-frontend/src/components/MessageInstanceList.tsx b/spiffworkflow-frontend/src/components/MessageInstanceList.tsx index a9cc186a..90da5ed9 100644 --- a/spiffworkflow-frontend/src/components/MessageInstanceList.tsx +++ b/spiffworkflow-frontend/src/components/MessageInstanceList.tsx @@ -179,7 +179,6 @@ export default function MessageInstanceList({ processInstanceId }: OwnProps) { return ( <> {breadcrumbElement} -

Messages

{correlationsDisplayModal()} +
{reportColumnForm()} {advancedOptionsModal()} {processInstanceReportSaveTag()} {tableTitleLine()} - + - + {resultsTable} - +
); } diff --git a/spiffworkflow-frontend/src/components/ReactDiagramEditor.tsx b/spiffworkflow-frontend/src/components/ReactDiagramEditor.tsx index 264bb1dc..8d4eb8af 100644 --- a/spiffworkflow-frontend/src/components/ReactDiagramEditor.tsx +++ b/spiffworkflow-frontend/src/components/ReactDiagramEditor.tsx @@ -430,11 +430,11 @@ export default function ReactDiagramEditor({ // a Modeler and not an Editor which is what it will be when we are // actively editing a decision table if ((modeler as any).constructor.name === 'Modeler') { - canvas.zoom(FitViewport); + canvas.zoom(FitViewport, 'auto'); } if ((modeler as any).constructor.name === 'Viewer') { - canvas.zoom(FitViewport); + canvas.zoom(FitViewport, 'auto'); } // highlighting a field @@ -497,7 +497,7 @@ export default function ReactDiagramEditor({ ref.element.set(ref.property, elem); }); diagramModelerToUse.importDefinitions(result.rootElement); - diagramModelerToUse.get('canvas').zoom(FitViewport); + diagramModelerToUse.get('canvas').zoom(FitViewport, 'auto'); }); } else { diagramModelerToUse.importXML(diagramXMLToDisplay); diff --git a/spiffworkflow-frontend/src/index.css b/spiffworkflow-frontend/src/index.css index 20074fc7..f6a0b3eb 100644 --- a/spiffworkflow-frontend/src/index.css +++ b/spiffworkflow-frontend/src/index.css @@ -199,7 +199,7 @@ dt { .diagram-editor-canvas { border:1px solid #000000; - height:70vh; + height:78vh; width:90vw; margin: 0 auto; } @@ -298,7 +298,6 @@ dt { .markdown table { color: #333; background: white; - border: 1px solid grey; font-size: 12pt; border-collapse: collapse; } @@ -396,6 +395,13 @@ td.actions-cell { width: 1em; } +.process-instance-list-table { + margin: 0; + padding: 0; + width: fit-content; +} + + .process-instance-table-header { margin-bottom: 1em; } diff --git a/spiffworkflow-frontend/src/index.scss b/spiffworkflow-frontend/src/index.scss index 8d340745..d7b05535 100644 --- a/spiffworkflow-frontend/src/index.scss +++ b/spiffworkflow-frontend/src/index.scss @@ -20,8 +20,25 @@ // tweaks the markdown styles. main { - max-width: 1440px; - margin: auto; +} + +.fixed-width-container { + padding-left: 0px; + overflow: visible; +} + +@media (min-width: 1400px) { + .fixed-width-container { + max-width: 1280px; + padding-right: 0; + } +} + +@media (min-width: 1056px) { + .fixed-width-container { + padding-left: 180px; + padding-right: 2rem; + } } p, li, h1, h2, h3, h4, h5, h6, blockquote { @@ -35,6 +52,17 @@ div.show-page, div.markdown, div.markdown-collapsed, div.markdown-collapsable { margin: 0 auto; max-width: 1000px; padding: 15px 0 15px 0; + overflow: visible; +} + +.cds--data-table-content { + width: fit-content; + min-width: 100%; + overflow-x: visible; +} + +.wmde-markdown table { + width: fit-content; } .wmde-markdown ol { diff --git a/spiffworkflow-frontend/src/routes/AdminRoutes.tsx b/spiffworkflow-frontend/src/routes/AdminRoutes.tsx index f067ef59..f42a7de6 100644 --- a/spiffworkflow-frontend/src/routes/AdminRoutes.tsx +++ b/spiffworkflow-frontend/src/routes/AdminRoutes.tsx @@ -6,7 +6,6 @@ import ProcessGroupShow from './ProcessGroupShow'; import ProcessGroupNew from './ProcessGroupNew'; import ProcessGroupEdit from './ProcessGroupEdit'; import ProcessModelShow from './ProcessModelShow'; -import ProcessModelEditDiagram from './ProcessModelEditDiagram'; import ProcessInstanceList from './ProcessInstanceList'; import ProcessModelNew from './ProcessModelNew'; import ProcessModelEdit from './ProcessModelEdit'; @@ -30,110 +29,104 @@ export default function AdminRoutes() { if (UserService.hasRole(['admin'])) { return ( - - } /> - } /> - } - /> - } /> - } - /> +
+ + } /> + } /> + } + /> + } /> + } + /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } - /> - } /> - } - /> - } - /> - } /> - + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } + /> + } /> + } + /> + } + /> + } /> + +
); } return ( diff --git a/spiffworkflow-frontend/src/routes/EditorRoutes.tsx b/spiffworkflow-frontend/src/routes/EditorRoutes.tsx new file mode 100644 index 00000000..8fc2cac6 --- /dev/null +++ b/spiffworkflow-frontend/src/routes/EditorRoutes.tsx @@ -0,0 +1,33 @@ +import { Routes, Route, useLocation } from 'react-router-dom'; + +import React, { useEffect } from 'react'; +import ProcessModelEditDiagram from './ProcessModelEditDiagram'; +import UserService from '../services/UserService'; + +export default function EditorRoutes() { + const location = useLocation(); + + useEffect(() => {}, [location]); + + if (UserService.hasRole(['admin'])) { + return ( +
+ + } + /> + } + /> + +
+ ); + } + return ( +
+

404

+
+ ); +} diff --git a/spiffworkflow-frontend/src/routes/HomePageRoutes.tsx b/spiffworkflow-frontend/src/routes/HomePageRoutes.tsx index bba58de8..71438647 100644 --- a/spiffworkflow-frontend/src/routes/HomePageRoutes.tsx +++ b/spiffworkflow-frontend/src/routes/HomePageRoutes.tsx @@ -47,7 +47,7 @@ export default function HomePageRoutes() { }; return ( - <> +
{renderTabs()} } /> @@ -57,6 +57,6 @@ export default function HomePageRoutes() { } /> } /> - +
); } diff --git a/spiffworkflow-frontend/src/routes/MessageListPage.tsx b/spiffworkflow-frontend/src/routes/MessageListPage.tsx index 043ff4f8..fca96950 100644 --- a/spiffworkflow-frontend/src/routes/MessageListPage.tsx +++ b/spiffworkflow-frontend/src/routes/MessageListPage.tsx @@ -1,5 +1,10 @@ import MessageInstanceList from '../components/MessageInstanceList'; export default function MessageListPage() { - return ; + return ( + <> +

Messages

+ + + ); } diff --git a/spiffworkflow-frontend/src/routes/ProcessModelEditDiagram.tsx b/spiffworkflow-frontend/src/routes/ProcessModelEditDiagram.tsx index e13741f9..51e33f73 100644 --- a/spiffworkflow-frontend/src/routes/ProcessModelEditDiagram.tsx +++ b/spiffworkflow-frontend/src/routes/ProcessModelEditDiagram.tsx @@ -196,7 +196,7 @@ export default function ProcessModelEditDiagram() { 'file_type' )}`; navigate( - `/admin/process-models/${modifiedProcessModelId}/files/${fileNameWithExtension}` + `/editor/process-models/${modifiedProcessModelId}/files/${fileNameWithExtension}` ); } }; @@ -909,7 +909,7 @@ export default function ProcessModelEditDiagram() { processReference: ProcessReference ) => { const path = generatePath( - '/admin/process-models/:process_model_path/files/:file_name', + '/editor/process-models/:process_model_path/files/:file_name', { process_model_path: modifyProcessIdentifierForPathParam( processReference.process_model_id @@ -962,7 +962,7 @@ export default function ProcessModelEditDiagram() { const file = findFileNameForReferenceId(processId, 'dmn'); if (file) { const path = generatePath( - '/admin/process-models/:process_model_id/files/:file_name', + '/editor/process-models/:process_model_id/files/:file_name', { process_model_id: params.process_model_id, file_name: file.name, diff --git a/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx b/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx index 605d58d4..80129b36 100644 --- a/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx +++ b/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx @@ -193,7 +193,7 @@ export default function ProcessModelShow() { const profileModelFileEditUrl = (processModelFile: ProcessFile) => { if (processModel) { if (processModelFile.name.match(/\.(dmn|bpmn)$/)) { - return `/admin/process-models/${modifiedProcessModelId}/files/${processModelFile.name}`; + return `/editor/process-models/${modifiedProcessModelId}/files/${processModelFile.name}`; } if (processModelFile.name.match(/\.(json|md)$/)) { return `/admin/process-models/${modifiedProcessModelId}/form/${processModelFile.name}`; @@ -530,13 +530,13 @@ export default function ProcessModelShow() { onChange={(a: any) => { if (a.selectedItem.text === 'New BPMN File') { navigate( - `/admin/process-models/${modifiedProcessModelId}/files?file_type=bpmn` + `/editor/process-models/${modifiedProcessModelId}/files?file_type=bpmn` ); } else if (a.selectedItem.text === 'Upload File') { setShowFileUploadModal(true); } else if (a.selectedItem.text === 'New DMN File') { navigate( - `/admin/process-models/${modifiedProcessModelId}/files?file_type=dmn` + `/editor/process-models/${modifiedProcessModelId}/files?file_type=dmn` ); } else if (a.selectedItem.text === 'New JSON File') { navigate(