sartography/spiffworkflow-frontend
1
0
Fork 0
mirror of https://github.com/sartography/spiffworkflow-frontend.git synced 2025-02-24 12:18:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

updated several FIXME lines for typescript errors

Browse Source
This commit is contained in:
jasquat 2022-07-29 16:23:55 -04:00
parent 23cb59b287
commit 06d40ac85f
18 changed files with 106 additions and 192 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/PaginationForTable.tsx
View File

@ -12,7 +12,7 @@ type OwnProps = {
pagination: {
[key: string]: number;
};
tableToDisplay: string;
tableToDisplay: any;
queryParamString?: string;
path: string;
};
@ -66,9 +66,8 @@ export default function PaginationForTable({
};
const buildPaginationNav = () => {
let previousPageTag = '';
let previousPageTag = null;
if (page === 1) {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
previousPageTag = (
<li
data-qa="pagination-previous-button-inactive"
@ -81,7 +80,6 @@ export default function PaginationForTable({
</li>
);
} else {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
previousPageTag = (
<li className="page-item" key="previous">
<Link
@ -98,9 +96,8 @@ export default function PaginationForTable({
);
}
let nextPageTag = '';
let nextPageTag = null;
if (page >= pagination.pages) {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
nextPageTag = (
<li
data-qa="pagination-next-button-inactive"
@ -113,7 +110,6 @@ export default function PaginationForTable({
</li>
);
} else {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
nextPageTag = (
<li className="page-item" key="next">
<Link

8
src/components/ProcessBreadcrumb.tsx
View File

@ -12,12 +12,11 @@ export default function ProcessBreadcrumb({
processGroupId,
linkProcessModel = false,
}: OwnProps) {
let processGroupBreadcrumb = '';
let processModelBreadcrumb = '';
let processGroupBreadcrumb = null;
let processModelBreadcrumb = null;
if (processModelId) {
if (linkProcessModel) {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
processModelBreadcrumb = (
<Breadcrumb.Item
linkAs={Link}
@ -29,14 +28,12 @@ export default function ProcessBreadcrumb({
</Breadcrumb.Item>
);
} else {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
processModelBreadcrumb = (
<Breadcrumb.Item active>
Process Model: {processModelId}
</Breadcrumb.Item>
);
}
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
processGroupBreadcrumb = (
<Breadcrumb.Item
linkAs={Link}
@ -47,7 +44,6 @@ export default function ProcessBreadcrumb({
</Breadcrumb.Item>
);
} else if (processGroupId) {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
processGroupBreadcrumb = (
<Breadcrumb.Item active>Process Group: {processGroupId}</Breadcrumb.Item>
);

32
src/components/ReactDiagramEditor.tsx
View File

@ -60,7 +60,7 @@ type OwnProps = {
activeTaskBpmnIds?: string[] | null;
completedTasksBpmnIds?: string[] | null;
saveDiagram?: (..._args: any[]) => any;
diagramXML?: string;
diagramXML?: string | null;
fileName?: string;
onLaunchScriptEditor?: (..._args: any[]) => any;
url?: string;
@ -90,15 +90,12 @@ export default function ReactDiagramEditor({
return;
}
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
document.getElementById('diagram-container').innerHTML = '';
const temp = document.createElement('template');
let canvasClass = 'diagram-editor-canvas';
if (diagramType === 'readonly') {
canvasClass = 'diagram-viewer-canvas';
}
const temp = document.createElement('template');
temp.innerHTML = `
<div class="content with-diagram" id="js-drop-zone">
<div class="canvas ${canvasClass}" id="canvas"
@ -106,10 +103,14 @@ export default function ReactDiagramEditor({
<div class="properties-panel-parent" id="js-properties-panel"></div>
</div>
`;
const frag = temp.content;
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
document.getElementById('diagram-container').appendChild(frag);
const diagramContainerElement =
document.getElementById('diagram-container');
if (diagramContainerElement) {
diagramContainerElement.innerHTML = '';
diagramContainerElement.appendChild(frag);
}
let diagramModeler: any = null;
@ -209,8 +210,7 @@ export default function ReactDiagramEditor({
let modeler = diagramModelerState;
if (diagramType === 'dmn') {
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
modeler = diagramModelerState.getActiveViewer();
modeler = (diagramModelerState as any).getActiveViewer();
}
const canvas = (modeler as any).get('canvas');
@ -218,8 +218,7 @@ export default function ReactDiagramEditor({
// only get the canvas if the dmn active viewer is actually
// a Modeler and not an Editor which is what it will when we are
// actively editing a decision table
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
if (modeler.constructor.name === 'Modeler') {
if ((modeler as any).constructor.name === 'Modeler') {
canvas.zoom('fit-viewport');
}
@ -320,10 +319,11 @@ export default function ReactDiagramEditor({
function handleSave() {
if (saveDiagram) {
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
diagramModelerState.saveXML({ format: true }).then((xmlObject: any) => {
saveDiagram(xmlObject.xml);
});
(diagramModelerState as any)
.saveXML({ format: true })
.then((xmlObject: any) => {
saveDiagram(xmlObject.xml);
});
}
}

18
src/helpers.tsx
View File

@ -1,5 +1,9 @@
import { format } from 'date-fns';
import { DATE_FORMAT } from './config';
import {
DEFAULT_PER_PAGE,
DEFAULT_PAGE,
} from './components/PaginationForTable';
// https://www.30secondsofcode.org/js/s/slugify
export const slugifyString = (str: any) => {
@ -46,3 +50,17 @@ export const convertSecondsToFormattedDate = (seconds: number) => {
export const objectIsEmpty = (obj: object) => {
return Object.keys(obj).length === 0;
};
export const getPageInfoFromSearchParams = (
searchParams: any,
defaultPerPage: string | number = DEFAULT_PER_PAGE,
defaultPage: string | number = DEFAULT_PAGE
) => {
const page = parseInt(searchParams.get('page') || defaultPage.toString(), 10);
const perPage = parseInt(
searchParams.get('per_page') || defaultPerPage.toString(),
10
);
return { page, perPage };
};

1
src/index.tsx
View File

@ -7,7 +7,6 @@ import './index.css';
import reportWebVitals from './reportWebVitals';
import UserService from './services/UserService';
// import HttpService from './services/HttpService';
// @ts-expect-error TS(2345) FIXME: Argument of type 'HTMLElement | null' is not assig... Remove this comment to see the full error message
const root = ReactDOMClient.createRoot(document.getElementById('root'));

9
src/routes/AdminRoutes.tsx
View File

@ -25,13 +25,11 @@ export default function AdminRoutes() {
<Route path="process-groups" element={<ProcessGroups />} />
<Route
path="process-groups/:process_group_id"
// @ts-expect-error TS(2786) FIXME: 'ProcessGroupShow' cannot be used as a JSX compone... Remove this comment to see the full error message
element={<ProcessGroupShow />}
/>
<Route path="process-groups/new" element={<ProcessGroupNew />} />
<Route
path="process-groups/:process_group_id/edit"
// @ts-expect-error TS(2786) FIXME: 'ProcessGroupEdit' cannot be used as a JSX compone... Remove this comment to see the full error message
element={<ProcessGroupEdit />}
/>
@ -41,32 +39,26 @@ export default function AdminRoutes() {
/>
<Route
path="process-models/:process_group_id/:process_model_id"
// @ts-expect-error TS(2786) FIXME: 'ProcessModelShow' cannot be used as a JSX compone... Remove this comment to see the full error message
element={<ProcessModelShow />}
/>
<Route
path="process-models/:process_group_id/:process_model_id/file"
// @ts-expect-error TS(2786) FIXME: 'ProcessModelEditDiagram' cannot be used as a JSX ... Remove this comment to see the full error message
element={<ProcessModelEditDiagram />}
/>
<Route
path="process-models/:process_group_id/:process_model_id/file/:file_name"
// @ts-expect-error TS(2786) FIXME: 'ProcessModelEditDiagram' cannot be used as a JSX ... Remove this comment to see the full error message
element={<ProcessModelEditDiagram />}
/>
<Route
path="process-models/:process_group_id/:process_model_id/process-instances"
// @ts-expect-error TS(2786) FIXME: 'ProcessInstanceList' cannot be used as a JSX comp... Remove this comment to see the full error message
element={<ProcessInstanceList />}
/>
<Route
path="process-models/:process_group_id/:process_model_id/edit"
// @ts-expect-error TS(2786) FIXME: 'ProcessModelEdit' cannot be used as a JSX compone... Remove this comment to see the full error message
element={<ProcessModelEdit />}
/>
<Route
path="process-models/:process_group_id/:process_model_id/process-instances/:process_instance_id"
// @ts-expect-error TS(2786) FIXME: 'ProcessInstanceShow' cannot be used as a JSX comp... Remove this comment to see the full error message
element={<ProcessInstanceShow />}
/>
<Route
@ -75,7 +67,6 @@ export default function AdminRoutes() {
/>
<Route
path="process-models/:process_group_id/:process_model_id/process-instances/reports/:report_identifier"
// @ts-expect-error TS(2786) FIXME: 'ProcessInstanceReport' cannot be used as a JSX co... Remove this comment to see the full error message
element={<ProcessInstanceReportShow />}
/>
<Route

13
src/routes/ProcessGroupEdit.tsx
View File

@ -23,8 +23,7 @@ export default function ProcessGroupEdit() {
}, [params]);
const navigateToProcessGroup = (_result: any) => {
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
navigate(`/admin/process-groups/${processGroup.id}`);
navigate(`/admin/process-groups/${(processGroup as any).id}`);
};
const navigateToProcessGroups = (_result: any) => {
@ -34,22 +33,19 @@ export default function ProcessGroupEdit() {
const updateProcessGroup = (event: any) => {
event.preventDefault();
HttpService.makeCallToBackend({
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
path: `/process-groups/${processGroup.id}`,
path: `/process-groups/${(processGroup as any).id}`,
successCallback: navigateToProcessGroup,
httpMethod: 'PUT',
postBody: {
display_name: displayName,
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
id: processGroup.id,
id: (processGroup as any).id,
},
});
};
const deleteProcessGroup = () => {
HttpService.makeCallToBackend({
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
path: `/process-groups/${processGroup.id}`,
path: `/process-groups/${(processGroup as any).id}`,
successCallback: navigateToProcessGroups,
httpMethod: 'DELETE',
});
@ -90,4 +86,5 @@ export default function ProcessGroupEdit() {
</main>
);
}
return null;
}

29
src/routes/ProcessGroupShow.tsx
View File

@ -2,11 +2,9 @@ import { useEffect, useState } from 'react';
import { Link, useSearchParams, useParams } from 'react-router-dom';
import { Button, Table, Stack } from 'react-bootstrap';
import ProcessBreadcrumb from '../components/ProcessBreadcrumb';
import PaginationForTable, {
DEFAULT_PER_PAGE,
DEFAULT_PAGE,
} from '../components/PaginationForTable';
import PaginationForTable from '../components/PaginationForTable';
import HttpService from '../services/HttpService';
import { getPageInfoFromSearchParams } from '../helpers';
export default function ProcessGroupShow() {
const params = useParams();
@ -17,13 +15,7 @@ export default function ProcessGroupShow() {
const [pagination, setPagination] = useState(null);
useEffect(() => {
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 1' is not assignable to... Remove this comment to see the full error message
const page = parseInt(searchParams.get('page') || DEFAULT_PAGE, 10);
const perPage = parseInt(
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 50' is not assignable t... Remove this comment to see the full error message
searchParams.get('per_page') || DEFAULT_PER_PAGE,
10
);
const { page, perPage } = getPageInfoFromSearchParams(searchParams);
const setProcessModelFromResult = (result: any) => {
setProcessModels(result.results);
@ -48,8 +40,9 @@ export default function ProcessGroupShow() {
<tr key={(row as any).id}>
<td>
<Link
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
to={`/admin/process-models/${processGroup.id}/${(row as any).id}`}
to={`/admin/process-models/${(processGroup as any).id}/${
(row as any).id
}`}
data-qa="process-model-show-link"
>
{(row as any).id}
@ -76,13 +69,7 @@ export default function ProcessGroupShow() {
};
if (processGroup && pagination) {
const perPage = parseInt(
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 50' is not assignable t... Remove this comment to see the full error message
searchParams.get('per_page') || DEFAULT_PER_PAGE,
10
);
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 1' is not assignable to... Remove this comment to see the full error message
const page = parseInt(searchParams.get('page') || DEFAULT_PAGE, 10);
const { page, perPage } = getPageInfoFromSearchParams(searchParams);
return (
<main style={{ padding: '1rem 0' }}>
<ProcessBreadcrumb processGroupId={(processGroup as any).id} />
@ -107,7 +94,6 @@ export default function ProcessGroupShow() {
page={page}
perPage={perPage}
pagination={pagination}
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
tableToDisplay={buildTable()}
path={`/admin/process-groups/${(processGroup as any).id}`}
/>
@ -115,4 +101,5 @@ export default function ProcessGroupShow() {
</main>
);
}
return null;
}

33
src/routes/ProcessGroups.tsx
View File

@ -2,11 +2,9 @@ import { useEffect, useState } from 'react';
import { Link, useSearchParams } from 'react-router-dom';
import { Button, Table } from 'react-bootstrap';
import ProcessBreadcrumb from '../components/ProcessBreadcrumb';
import PaginationForTable, {
DEFAULT_PER_PAGE,
DEFAULT_PAGE,
} from '../components/PaginationForTable';
import PaginationForTable from '../components/PaginationForTable';
import HttpService from '../services/HttpService';
import { getPageInfoFromSearchParams } from '../helpers';
// Example process group json
// {'admin': False, 'display_name': 'Test Workflows', 'display_order': 0, 'id': 'test_process_group'}
@ -21,15 +19,7 @@ export default function ProcessGroups() {
setProcessGroups(result.results);
setPagination(result.pagination);
};
const page = parseInt(
searchParams.get('page') || DEFAULT_PAGE.toString(),
10
);
const perPage = parseInt(
searchParams.get('per_page') || DEFAULT_PER_PAGE.toString(),
10
);
const { page, perPage } = getPageInfoFromSearchParams(searchParams);
HttpService.makeCallToBackend({
path: `/process-groups?per_page=${perPage}&page=${page}`,
successCallback: setProcessGroupsFromResult,
@ -63,30 +53,19 @@ export default function ProcessGroups() {
};
const processGroupsDisplayArea = () => {
const perPage = parseInt(
searchParams.get('per_page') || DEFAULT_PER_PAGE.toString(),
10
);
const page = parseInt(
searchParams.get('page') || DEFAULT_PAGE.toString(),
10
);
let displayText = '';
const { page, perPage } = getPageInfoFromSearchParams(searchParams);
let displayText = null;
if (processGroups?.length > 0) {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
displayText = (
<PaginationForTable
page={page}
perPage={perPage}
// @ts-expect-error TS(2322) FIXME: Type 'null' is not assignable to type '{ [key: str... Remove this comment to see the full error message
pagination={pagination}
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
pagination={pagination as any}
tableToDisplay={buildTable()}
path="/admin/process-groups"
/>
);
} else {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
displayText = <p>No Groups To Display</p>;
}
return displayText;

39
src/routes/ProcessInstanceList.tsx
View File

@ -14,12 +14,10 @@ import ProcessBreadcrumb from '../components/ProcessBreadcrumb';
import {
convertDateToSeconds,
convertSecondsToFormattedDate,
getPageInfoFromSearchParams,
} from '../helpers';
import PaginationForTable, {
DEFAULT_PER_PAGE,
DEFAULT_PAGE,
} from '../components/PaginationForTable';
import PaginationForTable from '../components/PaginationForTable';
import 'react-datepicker/dist/react-datepicker.css';
import ErrorContext from '../contexts/ErrorContext';
@ -59,15 +57,10 @@ export default function ProcessInstanceList() {
setPagination(result.pagination);
}
function getProcessInstances() {
const page = searchParams.get('page') || DEFAULT_PAGE;
const perPage = parseInt(
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 50' is not assignable t... Remove this comment to see the full error message
searchParams.get('per_page') || DEFAULT_PER_PAGE,
10
);
const { page, perPage } = getPageInfoFromSearchParams(searchParams);
let queryParamString = `per_page=${perPage}&page=${page}`;
Object.keys(parametersToAlwaysFilterBy).forEach((paramName) => {
Object.keys(parametersToAlwaysFilterBy).forEach((paramName: string) => {
// @ts-expect-error TS(7053) FIXME: Element implicitly has an 'any' type because expre... Remove this comment to see the full error message
const functionToCall = parametersToAlwaysFilterBy[paramName];
const searchParamValue = searchParams.get(paramName);
@ -81,8 +74,7 @@ export default function ProcessInstanceList() {
queryParamString += `&process_status=${searchParams.get(
'process_status'
)}`;
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | null' is not assignable... Remove this comment to see the full error message
setProcessStatus(searchParams.get('process_status'));
setProcessStatus(searchParams.get('process_status') || '');
}
HttpService.makeCallToBackend({
@ -119,12 +111,7 @@ export default function ProcessInstanceList() {
const handleFilter = (event: any) => {
event.preventDefault();
const page = searchParams.get('page') || DEFAULT_PAGE;
const perPage = parseInt(
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 50' is not assignable t... Remove this comment to see the full error message
searchParams.get('per_page') || DEFAULT_PER_PAGE,
10
);
const { page, perPage } = getPageInfoFromSearchParams(searchParams);
let queryParamString = `per_page=${perPage}&page=${page}`;
if (isTrueComparison(startFrom, '>', startTill)) {
@ -312,20 +299,13 @@ export default function ProcessInstanceList() {
};
if (pagination) {
const perPage = parseInt(
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 50' is not assignable t... Remove this comment to see the full error message
searchParams.get('per_page') || DEFAULT_PER_PAGE,
10
);
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 1' is not assignable to... Remove this comment to see the full error message
const page = parseInt(searchParams.get('page') || DEFAULT_PAGE, 10);
const { page, perPage } = getPageInfoFromSearchParams(searchParams);
return (
<main>
<ProcessBreadcrumb
processModelId={params.process_model_id}
processGroupId={params.process_group_id}
// @ts-expect-error TS(2322) FIXME: Type 'string' is not assignable to type 'boolean |... Remove this comment to see the full error message
linkProcessModel="true"
linkProcessModel
/>
<h2>Process Instances for {params.process_model_id}</h2>
{filterOptions()}
@ -333,7 +313,6 @@ export default function ProcessInstanceList() {
page={page}
perPage={perPage}
pagination={pagination}
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
tableToDisplay={buildTable()}
queryParamString={getSearchParamsAsQueryString()}
path={`/admin/process-models/${params.process_group_id}/${params.process_model_id}/process-instances`}
@ -341,4 +320,6 @@ export default function ProcessInstanceList() {
</main>
);
}
return null;
}

3
src/routes/ProcessInstanceReportList.tsx
View File

@ -47,8 +47,7 @@ export default function ProcessInstanceReportList() {
<ProcessBreadcrumb
processGroupId={params.process_group_id}
processModelId={params.process_model_id}
// @ts-expect-error TS(2322) FIXME: Type 'string' is not assignable to type 'boolean |... Remove this comment to see the full error message
linkProcessModel="true"
linkProcessModel
/>
<h2>Reports for Process Model: {params.process_model_id}</h2>
<Button

27
src/routes/ProcessInstanceReportShow.tsx
View File

@ -4,10 +4,9 @@ import { useParams, useSearchParams } from 'react-router-dom';
import { Button, Table } from 'react-bootstrap';
import ProcessBreadcrumb from '../components/ProcessBreadcrumb';
import PaginationForTable, {
DEFAULT_PAGE,
} from '../components/PaginationForTable';
import PaginationForTable from '../components/PaginationForTable';
import HttpService from '../services/HttpService';
import { getPageInfoFromSearchParams } from '../helpers';
const PER_PAGE_FOR_PROCESS_INSTANCE_REPORT = 500;
@ -28,11 +27,9 @@ export default function ProcessInstanceReport() {
};
function getProcessInstances() {
const page = searchParams.get('page') || DEFAULT_PAGE;
const perPage = parseInt(
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 50' is not assignable t... Remove this comment to see the full error message
searchParams.get('per_page') || PER_PAGE_FOR_PROCESS_INSTANCE_REPORT,
10
const { page, perPage } = getPageInfoFromSearchParams(
searchParams,
PER_PAGE_FOR_PROCESS_INSTANCE_REPORT
);
let query = `?page=${page}&per_page=${perPage}`;
searchParams.forEach((value, key) => {
@ -71,20 +68,16 @@ export default function ProcessInstanceReport() {
};
if (pagination) {
const perPage = parseInt(
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 50' is not assignable t... Remove this comment to see the full error message
searchParams.get('per_page') || PER_PAGE_FOR_PROCESS_INSTANCE_REPORT,
10
const { page, perPage } = getPageInfoFromSearchParams(
searchParams,
PER_PAGE_FOR_PROCESS_INSTANCE_REPORT
);
// @ts-expect-error TS(2345) FIXME: Argument of type 'string | 1' is not assignable to... Remove this comment to see the full error message
const page = parseInt(searchParams.get('page') || DEFAULT_PAGE, 10);
return (
<main>
<ProcessBreadcrumb
processModelId={params.process_model_id}
processGroupId={params.process_group_id}
// @ts-expect-error TS(2322) FIXME: Type 'string' is not assignable to type 'boolean |... Remove this comment to see the full error message
linkProcessModel="true"
linkProcessModel
/>
<h2>Process Instance Report: {params.report_identifier}</h2>
<Button
@ -96,11 +89,11 @@ export default function ProcessInstanceReport() {
page={page}
perPage={perPage}
pagination={pagination}
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
tableToDisplay={buildTable()}
path={`/admin/process-models/${params.process_group_id}/${params.process_model_id}/process-instances/report`}
/>
</main>
);
}
return null;
}

4
src/routes/ProcessInstanceShow.tsx
View File

@ -108,8 +108,7 @@ export default function ProcessInstanceShow() {
<ProcessBreadcrumb
processModelId={params.process_model_id}
processGroupId={params.process_group_id}
// @ts-expect-error TS(2322) FIXME: Type 'string' is not assignable to type 'boolean |... Remove this comment to see the full error message
linkProcessModel="true"
linkProcessModel
/>
<Stack direction="horizontal" gap={3}>
<h2>Process Instance Id: {processInstanceToUse.id}</h2>
@ -136,4 +135,5 @@ export default function ProcessInstanceShow() {
</main>
);
}
return null;
}

24
src/routes/ProcessModelEdit.tsx
View File

@ -32,32 +32,27 @@ export default function ProcessModelEdit() {
};
const updateProcessModel = (event: any) => {
const processModelToUse = processModel as any;
event.preventDefault();
HttpService.makeCallToBackend({
path: `/${processModelPath}`,
successCallback: navigateToProcessModel,
httpMethod: 'PUT',
postBody: {
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
id: processModel.id,
id: processModelToUse.id,
display_name: displayName,
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
description: processModel.description,
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
process_group_id: processModel.process_group_id,
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
is_master_spec: processModel.is_master_spec,
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
standalone: processModel.standalone,
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
library: processModel.library,
description: processModelToUse.description,
process_group_id: processModelToUse.process_group_id,
is_master_spec: processModelToUse.is_master_spec,
standalone: processModelToUse.standalone,
library: processModelToUse.library,
},
});
};
const deleteProcessModel = () => {
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
const processModelShowPath = `/process-models/${processModel.process_group_id}/${processModel.id}`;
const processModelToUse = processModel as any;
const processModelShowPath = `/process-models/${processModelToUse.process_group_id}/${processModelToUse.id}`;
HttpService.makeCallToBackend({
path: `${processModelShowPath}`,
successCallback: navigateToProcessModels,
@ -97,4 +92,5 @@ export default function ProcessModelEdit() {
</main>
);
}
return null;
}

9
src/routes/ProcessModelEditDiagram.tsx
View File

@ -136,8 +136,7 @@ export default function ProcessModelEditDiagram() {
};
const handleEditorChange = (value: any) => {
setScriptText(value);
// @ts-expect-error TS(2531) FIXME: Object is possibly 'null'.
scriptModeling.updateProperties(scriptElement, {
(scriptModeling as any).updateProperties(scriptElement, {
scriptFormat: 'python',
script: value,
});
@ -180,7 +179,6 @@ export default function ProcessModelEditDiagram() {
processModelId={params.process_model_id || ''}
processGroupId={params.process_group_id || ''}
saveDiagram={saveDiagram}
// @ts-expect-error TS(2322) FIXME: Type 'null' is not assignable to type 'string | un... Remove this comment to see the full error message
diagramXML={bpmnXmlForDiagramRendering}
fileName={processModelFile ? (processModelFile as any).name : null}
diagramType="dmn"
@ -192,7 +190,6 @@ export default function ProcessModelEditDiagram() {
processModelId={params.process_model_id || ''}
processGroupId={params.process_group_id || ''}
saveDiagram={saveDiagram}
// @ts-expect-error TS(2322) FIXME: Type 'null' is not assignable to type 'string | un... Remove this comment to see the full error message
diagramXML={bpmnXmlForDiagramRendering}
fileName={processModelFile ? (processModelFile as any).name : null}
diagramType="bpmn"
@ -208,8 +205,7 @@ export default function ProcessModelEditDiagram() {
<ProcessBreadcrumb
processGroupId={params.process_group_id}
processModelId={params.process_model_id}
// @ts-expect-error TS(2322) FIXME: Type 'string' is not assignable to type 'boolean |... Remove this comment to see the full error message
linkProcessModel="true"
linkProcessModel
/>
<h2>
Process Model File
@ -223,4 +219,5 @@ export default function ProcessModelEditDiagram() {
</main>
);
}
return null;
}

4
src/routes/ProcessModelShow.tsx
View File

@ -39,9 +39,8 @@ export default function ProcessModelShow() {
});
};
let processInstanceResultTag = '';
let processInstanceResultTag = null;
if (processInstanceResult) {
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
processInstanceResultTag = (
<pre>
{(processInstanceResult as any).status}:{' '}
@ -193,4 +192,5 @@ export default function ProcessModelShow() {
</main>
);
}
return null;
}

25
src/routes/TaskList.tsx
View File

@ -1,10 +1,8 @@
import { useEffect, useState } from 'react';
import { Button, Table } from 'react-bootstrap';
import { Link, useSearchParams } from 'react-router-dom';
import PaginationForTable, {
DEFAULT_PER_PAGE,
DEFAULT_PAGE,
} from '../components/PaginationForTable';
import PaginationForTable from '../components/PaginationForTable';
import { getPageInfoFromSearchParams } from '../helpers';
import HttpService from '../services/HttpService';
export default function TaskList() {
@ -13,14 +11,7 @@ export default function TaskList() {
const [pagination, setPagination] = useState(null);
useEffect(() => {
const page = parseInt(
searchParams.get('page') || DEFAULT_PAGE.toString(),
10
);
const perPage = parseInt(
searchParams.get('per_page') || DEFAULT_PER_PAGE.toString(),
10
);
const { page, perPage } = getPageInfoFromSearchParams(searchParams);
const setTasksFromResult = (result: any) => {
setTasks(result.results);
setPagination(result.pagination);
@ -66,14 +57,7 @@ export default function TaskList() {
};
if (pagination) {
const perPage = parseInt(
searchParams.get('per_page') || DEFAULT_PER_PAGE.toString(),
10
);
const page = parseInt(
searchParams.get('page') || DEFAULT_PAGE.toString(),
10
);
const { page, perPage } = getPageInfoFromSearchParams(searchParams);
return (
<main>
<h2>Tasks</h2>
@ -81,7 +65,6 @@ export default function TaskList() {
page={page}
perPage={perPage}
pagination={pagination}
// @ts-expect-error TS(2322) FIXME: Type 'Element' is not assignable to type 'string'.
tableToDisplay={buildTable()}
path="/tasks"
/>

10
src/services/UserService.ts
View File

@ -9,11 +9,13 @@ import { BACKEND_BASE_URL } from '../config';
// Some explanation:
// https://dev.to/nilanth/how-to-secure-jwt-in-a-single-page-application-cko
// to trim off any query params
const currentLocation = `${window.location.origin}${window.location.pathname}`;
const getCurrentLocation = () => {
// to trim off any query params
return `${window.location.origin}${window.location.pathname}`;
};
const doLogin = () => {
const url = `${BACKEND_BASE_URL}/login?redirect_url=${currentLocation}`;
const url = `${BACKEND_BASE_URL}/login?redirect_url=${getCurrentLocation()}`;
window.location.href = url;
};
const getIdToken = () => {
@ -51,7 +53,7 @@ const getAuthTokenFromParams = () => {
localStorage.setItem('jwtIdToken', idToken);
}
// to remove token query param
window.location.href = currentLocation;
window.location.href = getCurrentLocation();
} else if (!isLoggedIn()) {
doLogin();
}