From 77009482cc7b9d5735fc7cac4512f16b7e705308 Mon Sep 17 00:00:00 2001 From: jasquat Date: Tue, 22 Nov 2022 15:01:10 -0500 Subject: [PATCH] updated recently viewed table to be recently run and added run button w/ burnettk cullerton --- .../src/components/ProcessInstanceRun.tsx | 58 ++++++++++++++++-- spiffworkflow-frontend/src/routes/MyTasks.tsx | 60 ++++++++++++++++--- .../src/routes/ProcessModelShow.tsx | 51 ---------------- 3 files changed, 103 insertions(+), 66 deletions(-) diff --git a/spiffworkflow-frontend/src/components/ProcessInstanceRun.tsx b/spiffworkflow-frontend/src/components/ProcessInstanceRun.tsx index f127cd0ac..3494ea0bb 100644 --- a/spiffworkflow-frontend/src/components/ProcessInstanceRun.tsx +++ b/spiffworkflow-frontend/src/components/ProcessInstanceRun.tsx @@ -4,11 +4,60 @@ import { Button, // @ts-ignore } from '@carbon/react'; -import { ProcessModel } from '../interfaces'; +import { ProcessModel, RecentProcessModel } from '../interfaces'; import HttpService from '../services/HttpService'; import ErrorContext from '../contexts/ErrorContext'; import { modifyProcessIdentifierForPathParam } from '../helpers'; +const storeRecentProcessModelInLocalStorage = ( + processModelForStorage: ProcessModel +) => { + // All values stored in localStorage are strings. + // Grab our recentProcessModels string from localStorage. + const stringFromLocalStorage = window.localStorage.getItem( + 'recentProcessModels' + ); + + // adapted from https://stackoverflow.com/a/59424458/6090676 + // If that value is null (meaning that we've never saved anything to that spot in localStorage before), use an empty array as our array. Otherwise, use the value we parse out. + let array: RecentProcessModel[] = []; + if (stringFromLocalStorage !== null) { + // Then parse that string into an actual value. + array = JSON.parse(stringFromLocalStorage); + } + + // Here's the value we want to add + const value = { + processModelIdentifier: processModelForStorage.id, + processModelDisplayName: processModelForStorage.display_name, + }; + + // anything with a processGroupIdentifier is old and busted. leave it behind. + array = array.filter((item) => item.processGroupIdentifier === undefined); + + // If our parsed/empty array doesn't already have this value in it... + const matchingItem = array.find( + (item) => item.processModelIdentifier === value.processModelIdentifier + ); + if (matchingItem === undefined) { + // add the value to the beginning of the array + array.unshift(value); + + // Keep the array to 3 items + if (array.length > 3) { + array.pop(); + } + } + + // once the old and busted serializations are gone, we can put these two statements inside the above if statement + + // turn the array WITH THE NEW VALUE IN IT into a string to prepare it to be stored in localStorage + const stringRepresentingArray = JSON.stringify(array); + + // and store it in localStorage as "recentProcessModels" + window.localStorage.setItem('recentProcessModels', stringRepresentingArray); +}; + type OwnProps = { processModel: ProcessModel; onSuccessCallback: Function; @@ -38,6 +87,7 @@ export default function ProcessInstanceRun({ const processModelRun = (processInstance: any) => { setErrorMessage(null); + storeRecentProcessModelInLocalStorage(processModel); HttpService.makeCallToBackend({ path: `/process-instances/${modifiedProcessModelId}/${processInstance.id}/run`, successCallback: onProcessInstanceRun, @@ -55,11 +105,7 @@ export default function ProcessInstanceRun({ }; return ( - ); diff --git a/spiffworkflow-frontend/src/routes/MyTasks.tsx b/spiffworkflow-frontend/src/routes/MyTasks.tsx index 7fbd16d25..b33e459b1 100644 --- a/spiffworkflow-frontend/src/routes/MyTasks.tsx +++ b/spiffworkflow-frontend/src/routes/MyTasks.tsx @@ -9,7 +9,13 @@ import { refreshAtInterval, } from '../helpers'; import HttpService from '../services/HttpService'; -import { PaginationObject, RecentProcessModel } from '../interfaces'; +import { + PaginationObject, + ProcessInstance, + ProcessModel, + RecentProcessModel, +} from '../interfaces'; +import ProcessInstanceRun from '../components/ProcessInstanceRun'; const PER_PAGE_FOR_TASKS_ON_HOME_PAGE = 5; const REFRESH_INTERVAL = 10; @@ -19,6 +25,8 @@ export default function MyTasks() { const [searchParams] = useSearchParams(); const [tasks, setTasks] = useState([]); const [pagination, setPagination] = useState(null); + const [processInstance, setProcessInstance] = + useState(null); useEffect(() => { const getTasks = () => { @@ -40,6 +48,28 @@ export default function MyTasks() { refreshAtInterval(REFRESH_INTERVAL, REFRESH_TIMEOUT, getTasks); }, [searchParams]); + const processInstanceRunResultTag = () => { + if (processInstance) { + return ( +
+

+ Process Instance {processInstance.id} kicked off ( + + view + + ). +

+
+ ); + } + return null; + }; + let recentProcessModels: RecentProcessModel[] = []; const recentProcessModelsString = localStorage.getItem('recentProcessModels'); if (recentProcessModelsString !== null) { @@ -107,33 +137,44 @@ export default function MyTasks() { }; const buildRecentProcessModelSection = () => { - const rows = recentProcessModels.map((row) => { - const rowToUse = row as any; + const rows = recentProcessModels.map((row: RecentProcessModel) => { + const processModel: ProcessModel = { + id: row.processModelIdentifier, + description: '', + display_name: '', + primary_file_name: '', + files: [], + }; const modifiedProcessModelId = modifyProcessIdentifierForPathParam( - rowToUse.processModelIdentifier + row.processModelIdentifier ); return ( - + - {rowToUse.processModelDisplayName} + {row.processModelDisplayName} + + + ); }); return ( <> -

Recently viewed process models

+

Recently instantiated process models

+ {rows} @@ -175,6 +216,7 @@ export default function MyTasks() { } return ( <> + {processInstanceRunResultTag()} {tasksWaitingForMe}
{relevantProcessModelSection} diff --git a/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx b/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx index 1424a40aa..e427bdf7f 100644 --- a/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx +++ b/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx @@ -41,7 +41,6 @@ import { ProcessFile, ProcessInstance, ProcessModel, - RecentProcessModel, } from '../interfaces'; import ButtonWithConfirmation from '../components/ButtonWithConfirmation'; import ProcessInstanceListTable from '../components/ProcessInstanceListTable'; @@ -49,55 +48,6 @@ import { usePermissionFetcher } from '../hooks/PermissionService'; import { useUriListForPermissions } from '../hooks/UriListForPermissions'; import ProcessInstanceRun from '../components/ProcessInstanceRun'; -const storeRecentProcessModelInLocalStorage = ( - processModelForStorage: ProcessModel -) => { - // All values stored in localStorage are strings. - // Grab our recentProcessModels string from localStorage. - const stringFromLocalStorage = window.localStorage.getItem( - 'recentProcessModels' - ); - - // adapted from https://stackoverflow.com/a/59424458/6090676 - // If that value is null (meaning that we've never saved anything to that spot in localStorage before), use an empty array as our array. Otherwise, use the value we parse out. - let array: RecentProcessModel[] = []; - if (stringFromLocalStorage !== null) { - // Then parse that string into an actual value. - array = JSON.parse(stringFromLocalStorage); - } - - // Here's the value we want to add - const value = { - processModelIdentifier: processModelForStorage.id, - processModelDisplayName: processModelForStorage.display_name, - }; - - // anything with a processGroupIdentifier is old and busted. leave it behind. - array = array.filter((item) => item.processGroupIdentifier === undefined); - - // If our parsed/empty array doesn't already have this value in it... - const matchingItem = array.find( - (item) => item.processModelIdentifier === value.processModelIdentifier - ); - if (matchingItem === undefined) { - // add the value to the beginning of the array - array.unshift(value); - - // Keep the array to 3 items - if (array.length > 3) { - array.pop(); - } - } - - // once the old and busted serializations are gone, we can put these two statements inside the above if statement - - // turn the array WITH THE NEW VALUE IN IT into a string to prepare it to be stored in localStorage - const stringRepresentingArray = JSON.stringify(array); - - // and store it in localStorage as "recentProcessModels" - window.localStorage.setItem('recentProcessModels', stringRepresentingArray); -}; - export default function ProcessModelShow() { const params = useParams(); const setErrorMessage = (useContext as any)(ErrorContext)[1]; @@ -130,7 +80,6 @@ export default function ProcessModelShow() { const processResult = (result: ProcessModel) => { setProcessModel(result); setReloadModel(false); - storeRecentProcessModelInLocalStorage(result); }; HttpService.makeCallToBackend({ path: `/process-models/${modifiedProcessModelId}`,
Process ModelActions