Skip to content

Commit c42e2df

Browse files
PE39806PE39806
authored
Merge pull request #2135 from gchq/feature/BAI-updates-to-file-management
updated the delete file confirmation dialog to also show associated r…
2 parents 6be1bd1 + 385f3ef commit c42e2df

File tree

5 files changed

+96
-70
lines changed

5 files changed

+96
-70
lines changed

‎frontend/pages/model/[modelId].tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ export default function Model() {
6767
view: <ModelImages model={model} readOnly={!!model.settings.mirror?.sourceModelId} />,
6868
},
6969
{
70-
title: 'Files',
70+
title: 'File Management',
7171
path: 'files',
7272
view: <Files model={model} />,
7373
},

‎frontend/src/entry/model/Files.tsx

+7-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { LoadingButton } from '@mui/lab'
2-
import { Box, Button, Card, Container, LinearProgress, Stack } from '@mui/material'
2+
import { Box, Button, Card, Container, LinearProgress, Stack, Typography } from '@mui/material'
33
import { styled } from '@mui/material/styles'
44
import { postFileForModelId } from 'actions/file'
55
import { useGetModelFiles } from 'actions/model'
@@ -118,7 +118,12 @@ export default function Files({ model }: FilesProps) {
118118
return (
119119
<>
120120
<Container sx={{ my: 2 }}>
121-
<Stack direction={{ xs: 'column' }} spacing={4}>
121+
<Stack direction={{ xs: 'column' }} spacing={2} justifyContent='center' alignItems='center'>
122+
<Typography>
123+
Files uploaded to a model can be managed here. For each file you can view associated releases, delete files
124+
that are no longer needed, and also manually retrigger anti-virus scanning (if anti-virus scanning is
125+
enabled).
126+
</Typography>
122127
<Box display='flex'>
123128
<Box ml='auto'>
124129
<Restricted action='createRelease' fallback={<Button disabled>Add new files</Button>}>

‎frontend/src/entry/model/releases/AssociatedReleasesDialog.tsx

+11-64
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,7 @@
1-
import {
2-
Button,
3-
Dialog,
4-
DialogActions,
5-
DialogContent,
6-
DialogTitle,
7-
List,
8-
ListItem,
9-
ListItemButton,
10-
ListItemText,
11-
Typography,
12-
} from '@mui/material'
13-
import { useGetModel } from 'actions/model'
14-
import { useMemo } from 'react'
15-
import EmptyBlob from 'src/common/EmptyBlob'
16-
import Loading from 'src/common/Loading'
1+
import { Button, Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material'
172
import { Transition } from 'src/common/Transition'
18-
import Link from 'src/Link'
19-
import MessageAlert from 'src/MessageAlert'
20-
import { FileInterface, isFileInterface, ReleaseInterface } from 'types/types'
21-
import { formatDateString } from 'utils/dateUtils'
3+
import AssociatedReleasesList from 'src/entry/model/releases/AssociatedReleasesList'
4+
import { FileInterface, ReleaseInterface } from 'types/types'
225

236
type AssociatedReleasesDialogProps = {
247
modelId: string
@@ -37,53 +20,17 @@ export default function AssociatedReleasesDialog({
3720
open,
3821
onClose,
3922
}: AssociatedReleasesDialogProps) {
40-
const { model, isModelLoading, isModelError } = useGetModel(modelId, 'model')
41-
42-
const associatedReleasesDisplay = useMemo(
43-
() =>
44-
model && isFileInterface(file) && sortedAssociatedReleases.length > 0 ? (
45-
<List disablePadding>
46-
{sortedAssociatedReleases.map((associatedRelease) => (
47-
<ListItem disablePadding key={associatedRelease._id}>
48-
<Link
49-
href={`/model/${model.id}/release/${associatedRelease.semver}`}
50-
sx={{ textDecoration: 'none', width: '100%' }}
51-
>
52-
<ListItemButton dense>
53-
<ListItemText
54-
primary={
55-
<>
56-
<Typography color='primary' component='span'>
57-
{associatedRelease.semver}
58-
</Typography>
59-
{latestRelease === associatedRelease.semver && (
60-
<Typography color='secondary' component='span' pl={1}>
61-
(Latest)
62-
</Typography>
63-
)}
64-
</>
65-
}
66-
secondary={formatDateString(file.createdAt.toString())}
67-
/>
68-
</ListItemButton>
69-
</Link>
70-
</ListItem>
71-
))}
72-
</List>
73-
) : (
74-
<EmptyBlob text='No Associated Releases' />
75-
),
76-
[file, latestRelease, model, sortedAssociatedReleases],
77-
)
78-
79-
if (isModelError) {
80-
return <MessageAlert message={isModelError.info.message} severity='error' />
81-
}
82-
8323
return (
8424
<Dialog fullWidth open={open} onClose={onClose} maxWidth='sm' slots={{ transition: Transition }}>
8525
<DialogTitle>Associated Releases</DialogTitle>
86-
<DialogContent>{isModelLoading ? <Loading /> : associatedReleasesDisplay}</DialogContent>
26+
<DialogContent>
27+
<AssociatedReleasesList
28+
modelId={modelId}
29+
file={file}
30+
latestRelease={latestRelease}
31+
releases={sortedAssociatedReleases}
32+
/>
33+
</DialogContent>
8734
<DialogActions>
8835
<Button variant='contained' onClick={onClose}>
8936
Close

‎frontend/src/entry/model/releases/AssociatedReleasesList.tsx

+59
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
import { List, ListItem, ListItemButton, ListItemText, Typography } from '@mui/material'
2+
import { useMemo } from 'react'
3+
import EmptyBlob from 'src/common/EmptyBlob'
4+
import Link from 'src/Link'
5+
import { FileInterface, isFileInterface, ReleaseInterface } from 'types/types'
6+
import { formatDateString } from 'utils/dateUtils'
7+
8+
interface AssociatedReleasesListProps {
9+
releases: ReleaseInterface[]
10+
modelId: string
11+
latestRelease: string
12+
file: FileInterface | File
13+
}
14+
15+
export default function AssociatedReleasesList({
16+
releases,
17+
modelId,
18+
latestRelease,
19+
file,
20+
}: AssociatedReleasesListProps) {
21+
const releaseList = useMemo(
22+
() =>
23+
isFileInterface(file) && releases.length > 0 ? (
24+
<List disablePadding>
25+
{releases.map((associatedRelease) => (
26+
<ListItem disablePadding key={associatedRelease._id}>
27+
<Link
28+
href={`/model/${modelId}/release/${associatedRelease.semver}`}
29+
sx={{ textDecoration: 'none', width: '100%' }}
30+
>
31+
<ListItemButton dense>
32+
<ListItemText
33+
primary={
34+
<>
35+
<Typography color='primary' component='span'>
36+
{associatedRelease.semver}
37+
</Typography>
38+
{latestRelease === associatedRelease.semver && (
39+
<Typography color='secondary' component='span' pl={1}>
40+
(Latest)
41+
</Typography>
42+
)}
43+
</>
44+
}
45+
secondary={formatDateString(file.createdAt.toString())}
46+
/>
47+
</ListItemButton>
48+
</Link>
49+
</ListItem>
50+
))}
51+
</List>
52+
) : (
53+
<EmptyBlob text='No Associated Releases' />
54+
),
55+
[file, latestRelease, modelId, releases],
56+
)
57+
58+
return <>{releaseList}</>
59+
}

‎frontend/src/entry/model/releases/FileDownload.tsx

+18-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { Delete, Done, Error, Info, MoreVert, Refresh, Warning } from '@mui/icons-material'
22
import {
3+
Box,
34
Chip,
45
Divider,
56
IconButton,
@@ -22,6 +23,7 @@ import { Fragment, MouseEvent, ReactElement, useCallback, useEffect, useMemo, us
2223
import ConfirmationDialogue from 'src/common/ConfirmationDialogue'
2324
import Loading from 'src/common/Loading'
2425
import AssociatedReleasesDialog from 'src/entry/model/releases/AssociatedReleasesDialog'
26+
import AssociatedReleasesList from 'src/entry/model/releases/AssociatedReleasesList'
2527
import useNotification from 'src/hooks/useNotification'
2628
import MessageAlert from 'src/MessageAlert'
2729
import { KeyedMutator } from 'swr'
@@ -359,12 +361,25 @@ export default function FileDownload({
359361
/>
360362
<ConfirmationDialogue
361363
open={deleteFileOpen}
362-
title='Delete Release'
364+
title='Delete File'
363365
onConfirm={handleDeleteConfirm}
364366
onCancel={() => setDeleteFileOpen(false)}
365367
errorMessage={deleteErrorMessage}
366-
dialogMessage={'Are you sure you want to delete this file?'}
367-
/>
368+
dialogMessage={
369+
sortedAssociatedReleases.length > 0
370+
? 'Deleting this file will affect the following releases:'
371+
: 'Deleting this file will not affect any existing releases'
372+
}
373+
>
374+
<Box sx={{ pt: 2 }}>
375+
<AssociatedReleasesList
376+
modelId={modelId}
377+
file={file}
378+
latestRelease={latestRelease}
379+
releases={sortedAssociatedReleases}
380+
/>
381+
</Box>
382+
</ConfirmationDialogue>
368383
</>
369384
)
370385
}

0 commit comments

Comments
 (0)