status-im
/
spiff-arena
mirror of https://github.com/status-im/spiff-arena.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

* Clicking anywhere in the row should take you to the process instance page.

This commit is contained in:
Dan 2023-04-23 11:43:25 -04:00
parent bfc02ecd12
commit d9feaa1d5d
1 changed files with 19 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
spiffworkflow-frontend/src/components/ProcessInstanceListTable.tsx
View File

@ -1365,68 +1365,30 @@ export default function ProcessInstanceListTable({
const formatter = const formatter =
reportColumnFormatters[column.accessor] ?? defaultFormatter; reportColumnFormatters[column.accessor] ?? defaultFormatter;
const value = row[column.accessor]; const value = row[column.accessor];
const modifiedModelId = modifyProcessIdentifierForPathParam(
row.process_model_identifier
);
const navigateToProcessInstance = () => {
navigate(`${processInstanceShowPathPrefix}/${modifiedModelId}/${row.id}`);
};
const navigateToProcessModel = () => {
navigate(`/admin/process-models/${modifiedModelId}`);
};
if (column.accessor === 'status') { if (column.accessor === 'status') {
return ( return (
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions <td data-qa={`process-instance-status-${value}`}>
<td
onClick={navigateToProcessInstance}
onKeyDown={navigateToProcessInstance}
data-qa={`process-instance-status-${value}`}
>
{formatter(row, value)} {formatter(row, value)}
</td> </td>
); );
} }
if (column.accessor === 'process_model_display_name') { if (column.accessor === 'process_model_display_name') {
const pmStyle = { background: 'rgba(0, 0, 0, .02)' }; return <td> {formatter(row, value)} </td>;
return (
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
<td
style={pmStyle}
onClick={navigateToProcessModel}
onKeyDown={navigateToProcessModel}
>
{formatter(row, value)}
</td>
);
} }
if (column.accessor === 'waiting_for') { if (column.accessor === 'waiting_for') {
return ( return <td> {getWaitingForTableCellComponent(row)} </td>;
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
<td
onClick={navigateToProcessInstance}
onKeyDown={navigateToProcessInstance}
>
{getWaitingForTableCellComponent(row)}
</td>
);
} }
if (column.accessor === 'updated_at_in_seconds') { if (column.accessor === 'updated_at_in_seconds') {
return ( return (
<TableCellWithTimeAgoInWords <TableCellWithTimeAgoInWords
timeInSeconds={row.updated_at_in_seconds} timeInSeconds={row.updated_at_in_seconds}
onClick={navigateToProcessInstance}
onKeyDown={navigateToProcessInstance}
/> />
); );
} }
return ( return (
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
<td <td data-qa={`process-instance-show-link-${column.accessor}`}>
data-qa={`process-instance-show-link-${column.accessor}`}
onKeyDown={navigateToProcessInstance}
onClick={navigateToProcessInstance}
>
{formatter(row, value)} {formatter(row, value)}
</td> </td>
); );
@ -1484,9 +1446,22 @@ export default function ProcessInstanceListTable({
} }
const rowStyle = { cursor: 'pointer' }; const rowStyle = { cursor: 'pointer' };
const modifiedModelId = modifyProcessIdentifierForPathParam(
row.process_model_identifier
);
const navigateToProcessInstance = () => {
navigate(
`${processInstanceShowPathPrefix}/${modifiedModelId}/${row.id}`
);
};
return ( return (
<tr style={rowStyle} key={row.id}> // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
<tr
style={rowStyle}
key={row.id}
onClick={navigateToProcessInstance}
onKeyDown={navigateToProcessInstance}
>
{currentRow} {currentRow}
</tr> </tr>
); );