Austenem/CAT-386 add confirmation window #3479
Conversation
...tic/js/components/workspaces/ConfirmDeleteWorkspacesDialog/ConfirmDeleteWorkspacesDialog.tsx
Outdated
Show resolved
Hide resolved
| @@ -176,3 +176,11 @@ export function filterObjectByKeys<O extends object, K extends keyof O>(obj: O, | |||
| export function getOriginSamplesOrgan(entity: { origin_samples_unique_mapped_organs: string[] }) { | |||
| return entity.origin_samples_unique_mapped_organs.join(', '); | |||
| } | |||
|
|
|||
| export function generateCommaList(list: string[]): string { | |||
There was a problem hiding this comment.
Since this is meant for re-use, it would be nice to add a spec or two.
There was a problem hiding this comment.
I used JSDoc - if there's another preferred documentation format though, let me know!
There was a problem hiding this comment.
I was only asking for a test or two, but this is extra helpful!
| console.error(e); | ||
| }); | ||
|
|
||
| selectedWorkspaceIds.clear(); |
There was a problem hiding this comment.
Do we want to only clear the selected ids if the delete was successful? Should we also add a toastSuccess?
There was a problem hiding this comment.
That's a good point! Adding a success indicator is also a good idea.
...tic/js/components/workspaces/ConfirmDeleteWorkspacesDialog/ConfirmDeleteWorkspacesDialog.tsx
Outdated
Show resolved
Hide resolved
| import { | ||
| Box, | ||
| Button, | ||
| Dialog, | ||
| DialogActions, | ||
| DialogContent, | ||
| DialogTitle, | ||
| Divider, | ||
| IconButton, | ||
| Stack, | ||
| } from '@mui/material'; |
There was a problem hiding this comment.
Unfortunately, since the site builds as a CommonJS module, it's best to import these separately, e.g.:
import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
...etc...
Basically - importing directly from @mui/material indirectly pulls in the entire @mui/material package/everything in it since webpack with CommonJS modules can't treeshake unused code.
Further reading:
- https://webpack.js.org/guides/tree-shaking/
- https://mui.com/material-ui/guides/minimizing-bundle-size/#when-and-how-to-use-tree-shaking
- We have a task to migrate to ESM so that treeshaking works as expected: https://hms-dbmi.atlassian.net/browse/CAT-124
There was a problem hiding this comment.
Ahh gotcha! That's good to know.
| @@ -176,3 +176,11 @@ export function filterObjectByKeys<O extends object, K extends keyof O>(obj: O, | |||
| export function getOriginSamplesOrgan(entity: { origin_samples_unique_mapped_organs: string[] }) { | |||
| return entity.origin_samples_unique_mapped_organs.join(', '); | |||
| } | |||
|
|
|||
| export function generateCommaList(list: string[]): string { | |||
There was a problem hiding this comment.
I was only asking for a test or two, but this is extra helpful!
...tic/js/components/workspaces/ConfirmDeleteWorkspacesDialog/ConfirmDeleteWorkspacesDialog.tsx
Outdated
Show resolved
Hide resolved
Summary
This update adds a confirmation modal to the 'Delete Workspace' button to avoid accidental deletions.
Design Documentation/Original Tickets
CAT-386 JIRA ticket (dev)
CAT-780 JIRA ticket (design)
Figma mockup
Testing
Functionalities of this feature that have been tested manually:
Screenshots/Video
Screen.Recording.2024-07-24.at.11.00.05.AM.mov
Checklist
CHANGELOG-your-feature-name-here.mdis present in the root directory, describing the change(s) in full sentences.