sartography/spiff-arena
1
0
Fork 0
mirror of https://github.com/sartography/spiff-arena.git synced 2025-02-22 22:28:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

nest accordions

Browse Source
This commit is contained in:
burnettk 2025-02-13 19:12:49 -05:00
parent 02af7aaaba
commit 7d9a1905b3
No known key found for this signature in database
1 changed files with 232 additions and 206 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
spiffworkflow-frontend/src/a-spiffui-v3/views/StartProcess/ProcessModelTreePage.tsx
View File

@ -9,6 +9,8 @@ import {
Typography,
Breadcrumbs,
Link,
Card,
CardContent,
} from '@mui/material';
import { useEffect, useRef, useState } from 'react';
import { Can } from '@casl/react';
@ -423,13 +425,7 @@ export default function ProcessModelTreePage({
: '';
};
return (
<Box sx={{ margin: '0 auto', p: 3 }}>
<Typography variant="h4" sx={{ mb: 4 }}>
{processModelAction === ProcessModelAction.StartProcess
? 'Start new process'
: 'Process Groups'}
</Typography>
const breadcrumbLinks = (
<Breadcrumbs sx={{ mb: 3 }}>
<Link
underline="hover"
@ -459,6 +455,16 @@ export default function ProcessModelTreePage({
</Link>
))}
</Breadcrumbs>
);
return (
<Box sx={{ margin: '0 auto', p: 3 }}>
<Typography variant="h4" sx={{ mb: 4 }}>
{processModelAction === ProcessModelAction.StartProcess
? 'Start new process'
: 'Process Groups'}
</Typography>
{breadcrumbLinks}
<Container
maxWidth={false}
sx={{
@ -530,16 +536,21 @@ export default function ProcessModelTreePage({
)}
{/* <SpiffBreadCrumbs crumbs={crumbs} callback={handleCrumbClick} /> */}
</Stack>
{currentProcessGroup ? (
<Stack
direction="row"
<Card>
<CardContent>
<Box
sx={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
mb: 3,
width: '100%',
paddingBottom: 2,
}}
>
<Typography variant="h5" className="with-icons">
Process Group: {currentProcessGroup.display_name}
{currentProcessGroup ? (
<>
{breadcrumbLinks}
<Box>
<Can
I="PUT"
a={targetUris.processGroupShowPath}
@ -567,10 +578,17 @@ export default function ProcessModelTreePage({
confirmButtonLabel="Delete"
/>
</Can>
</Box>
</>
) : (
<Typography variant="h5">
{processModelAction === ProcessModelAction.StartProcess
? 'Start new process'
: 'Process Groups'}
</Typography>
</Stack>
) : null}
{currentProcessGroup ? (
)}
</Box>
{currentProcessGroup && (
<Stack
direction="row"
sx={{
@ -580,7 +598,7 @@ export default function ProcessModelTreePage({
>
{currentProcessGroup.description}
</Stack>
) : null}
)}
<Accordion
expanded={modelsExpanded}
onChange={() => setModelsExpanded((prev) => !prev)}
@ -598,7 +616,9 @@ export default function ProcessModelTreePage({
pr: 2,
}}
>
<Typography>Process Models ({models.length})</Typography>
<Typography>
Process Models ({models.length})
</Typography>
<IconButton
size="small"
onClick={(e) => e.stopPropagation()}
@ -651,7 +671,9 @@ export default function ProcessModelTreePage({
pr: 2,
}}
>
<Typography>Process Groups ({groups?.length})</Typography>
<Typography>
Process Groups ({groups?.length})
</Typography>
<IconButton
size="small"
onClick={(e) => e.stopPropagation()}
@ -708,13 +730,17 @@ export default function ProcessModelTreePage({
</AccordionSummary>
<AccordionDetails>
<Box sx={gridProps}>
{dataStoresForProcessGroup?.map((dataStore: DataStore) => (
{dataStoresForProcessGroup?.map(
(dataStore: DataStore) => (
<DataStoreCard dataStore={dataStore} />
))}
),
)}
</Box>
</AccordionDetails>
</Accordion>
) : null}
</CardContent>
</Card>
</Stack>
</Stack>
</Container>