+
{truncateString(row.description || '', 25)}
-+
Total Sub Items: {processGroupDirectChildrenCount(row)}
diff --git a/spiffworkflow-frontend/src/components/ProcessInstanceRun.tsx b/spiffworkflow-frontend/src/components/ProcessInstanceRun.tsx new file mode 100644 index 00000000..c4f288c0 --- /dev/null +++ b/spiffworkflow-frontend/src/components/ProcessInstanceRun.tsx @@ -0,0 +1,64 @@ +import { useContext } from 'react'; +import { useNavigate } from 'react-router-dom'; +import { + Button, + // @ts-ignore +} from '@carbon/react'; +import { ProcessModel } from '../interfaces'; +import HttpService from '../services/HttpService'; +import ErrorContext from '../contexts/ErrorContext'; +import { modifyProcessModelPath } from '../helpers'; + +type OwnProps = { + processModel: ProcessModel; + onSuccessCallback: Function; + className?: string; +}; + +export default function ProcessInstanceRun({ + processModel, + onSuccessCallback, + className, +}: OwnProps) { + const navigate = useNavigate(); + const setErrorMessage = (useContext as any)(ErrorContext)[1]; + const modifiedProcessModelId = modifyProcessModelPath(processModel.id); + + const onProcessInstanceRun = (processInstance: any) => { + // FIXME: ensure that the task is actually for the current user as well + const processInstanceId = (processInstance as any).id; + const nextTask = (processInstance as any).next_task; + if (nextTask && nextTask.state === 'READY') { + navigate(`/tasks/${processInstanceId}/${nextTask.id}`); + } + onSuccessCallback(processInstance); + }; + + const processModelRun = (processInstance: any) => { + setErrorMessage(null); + HttpService.makeCallToBackend({ + path: `/process-instances/${processInstance.id}/run`, + successCallback: onProcessInstanceRun, + failureCallback: setErrorMessage, + httpMethod: 'POST', + }); + }; + + const processInstanceCreateAndRun = () => { + HttpService.makeCallToBackend({ + path: `/process-models/${modifiedProcessModelId}/process-instances`, + successCallback: processModelRun, + httpMethod: 'POST', + }); + }; + + return ( + + ); +} diff --git a/spiffworkflow-frontend/src/components/ProcessModelForm.tsx b/spiffworkflow-frontend/src/components/ProcessModelForm.tsx index 10f4ffd3..532e3927 100644 --- a/spiffworkflow-frontend/src/components/ProcessModelForm.tsx +++ b/spiffworkflow-frontend/src/components/ProcessModelForm.tsx @@ -42,7 +42,7 @@ export default function ProcessModelForm({ const handleFormSubmission = (event: any) => { event.preventDefault(); let hasErrors = false; - if (!hasValidIdentifier(processModel.id)) { + if (mode === 'new' && !hasValidIdentifier(processModel.id)) { setIdentifierInvalid(true); hasErrors = true; } diff --git a/spiffworkflow-frontend/src/components/ProcessModelListTiles.tsx b/spiffworkflow-frontend/src/components/ProcessModelListTiles.tsx new file mode 100644 index 00000000..a10fd754 --- /dev/null +++ b/spiffworkflow-frontend/src/components/ProcessModelListTiles.tsx @@ -0,0 +1,105 @@ +import { ReactElement, useEffect, useState } from 'react'; +import { Link, useSearchParams } from 'react-router-dom'; +import { + Tile, + // @ts-ignore +} from '@carbon/react'; +import HttpService from '../services/HttpService'; +import { ProcessModel, ProcessInstance } from '../interfaces'; +import { modifyProcessModelPath, truncateString } from '../helpers'; +import ProcessInstanceRun from './ProcessInstanceRun'; + +type OwnProps = { + headerElement?: ReactElement; +}; + +export default function ProcessModelListTiles({ headerElement }: OwnProps) { + const [searchParams] = useSearchParams(); + const [processModels, setProcessModels] = useState+ Process Instance {processInstance.id} kicked off ( + + view + + ). +
++ {truncateString(row.description || '', 25)} +
+No Models To Display
; + } + return displayText; + }; + + const processModelArea = () => { + if (processModels && processModels.length > 0) { + return ( + <> + {headerElement} + {processInstanceRunResultTag()} + {processModelsDisplayArea()} + + ); + } + return null; + }; + + if (processModels) { + return <>{processModelArea()}; + } + return null; +} diff --git a/spiffworkflow-frontend/src/index.css b/spiffworkflow-frontend/src/index.css index 3b803517..0d267086 100644 --- a/spiffworkflow-frontend/src/index.css +++ b/spiffworkflow-frontend/src/index.css @@ -215,7 +215,15 @@ in on this with the react-jsonschema-form repo. This is just a patch fix to allo order: 0; } -.tile-process-group-description { +.tile-title-top { + margin-bottom: 2em; + font-size: 20px; + line-height: 28px; + color: #161616; + order: 0; +} + +.tile-description { font-size: 14px; line-height: 20px; letter-spacing: 0.16px; @@ -229,6 +237,9 @@ in on this with the react-jsonschema-form repo. This is just a patch fix to allo letter-spacing: 0.16px; color: #161616; order: 1; +} + +.tile-pin-bottom { position: absolute; bottom: 1em; } diff --git a/spiffworkflow-frontend/src/interfaces.ts b/spiffworkflow-frontend/src/interfaces.ts index a9ac1ec0..aceca049 100644 --- a/spiffworkflow-frontend/src/interfaces.ts +++ b/spiffworkflow-frontend/src/interfaces.ts @@ -36,6 +36,11 @@ export interface ProcessFile { file_contents?: string; } +export interface ProcessInstance { + id: number; + process_model_identifier: string; +} + export interface ProcessModel { id: string; description: string; diff --git a/spiffworkflow-frontend/src/routes/CreateNewInstance.tsx b/spiffworkflow-frontend/src/routes/CreateNewInstance.tsx new file mode 100644 index 00000000..fbb3f844 --- /dev/null +++ b/spiffworkflow-frontend/src/routes/CreateNewInstance.tsx @@ -0,0 +1,9 @@ +import ProcessModelListTiles from '../components/ProcessModelListTiles'; + +export default function CreateNewInstance() { + return ( +
- Process Instance {processInstanceId} kicked off (
+ Process Instance {processInstance.id} kicked off (
view
@@ -572,9 +551,10 @@ export default function ProcessModelShow() {
a={targetUris.processInstanceActionPath}
ability={ability}
>
-
+