Fixes #192 - Removed the disused dialog in 'ProductRemove' and added …

…a title that appears when hovering the mouse over the DeleteIcon
linea-it · Oct 6, 2023 · 4b49abb · 4b49abb
1 parent 7cc707c
commit 4b49abb
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 41 deletions.
diff --git a/frontend/components/ProductGrid.js b/frontend/components/ProductGrid.js
@@ -3,6 +3,7 @@ import DeleteIcon from '@mui/icons-material/Delete'
 import DownloadIcon from '@mui/icons-material/Download'
 import ShareIcon from '@mui/icons-material/Share'
 import Alert from '@mui/material/Alert'
+import Tooltip from '@mui/material/Tooltip'
 import Link from '@mui/material/Link'
 import Snackbar from '@mui/material/Snackbar'
 import { DataGrid, GridActionsCellItem } from '@mui/x-data-grid'
@@ -158,11 +159,21 @@ export default function ProductGrid(props) {
         width: 120,
         sortable: false,
         renderCell: params => (
-          <GridActionsCellItem
-            icon={<DeleteIcon />}
-            onClick={() => handleDelete(params.row)}
-            disabled={!params.row.can_delete}
-          />
+          <Tooltip
+            title={
+              !params.row.can_delete
+                ? 'You cannot delete this data product because it belongs to another user.'
+                : 'Delete this data product.'
+            }
+          >
+            <div>
+              <GridActionsCellItem
+                icon={<DeleteIcon />}
+                onClick={() => handleDelete(params.row)}
+                disabled={!params.row.can_delete}
+              />
+            </div>
+          </Tooltip>
         )
       }
     ]

diff --git a/frontend/components/ProductRemove.js b/frontend/components/ProductRemove.js
@@ -1,22 +1,20 @@
-import LoadingButton from '@mui/lab/LoadingButton'
-import Button from '@mui/material/Button'
+import React from 'react'
+import PropTypes from 'prop-types'
 import Dialog from '@mui/material/Dialog'
 import DialogActions from '@mui/material/DialogActions'
 import DialogContent from '@mui/material/DialogContent'
 import DialogContentText from '@mui/material/DialogContentText'
 import DialogTitle from '@mui/material/DialogTitle'
-import PropTypes from 'prop-types'
-import React from 'react'
+import Button from '@mui/material/Button'
+import LoadingButton from '@mui/lab/LoadingButton'
 import { deleteProduct } from '../services/product'
-
 export default function ProductRemove({
   recordId,
   onRemoveSuccess,
   onClose,
   onError
 }) {
   const [isLoading, setLoading] = React.useState(false)
-  const [isAuthorized, setAuthorized] = React.useState(true)
 
   const handleDelete = async () => {
     setLoading(true)
@@ -25,13 +23,9 @@ export default function ProductRemove({
       onRemoveSuccess()
       onClose()
     } catch (error) {
-      if (error.response && error.response.status === 403) {
-        setAuthorized(false)
-      } else {
-        onError(
-          'Failed to remove the product. Please try again later or contact the helpdesk.'
-        )
-      }
+      onError(
+        'Failed to remove the product. Please try again later or contact the helpdesk.'
+      )
       setLoading(false)
     }
   }
@@ -48,30 +42,14 @@ export default function ProductRemove({
       </DialogContent>
       <DialogActions>
         <Button onClick={onClose}>Cancel</Button>
-        {isAuthorized && (
-          <LoadingButton
-            loading={isLoading}
-            variant="contained"
-            onClick={handleDelete}
-          >
-            Delete
-          </LoadingButton>
-        )}
+        <LoadingButton
+          loading={isLoading}
+          variant="contained"
+          onClick={handleDelete}
+        >
+          Delete
+        </LoadingButton>
       </DialogActions>
-      {!isAuthorized && (
-        <Dialog open={true}>
-          <DialogContent>
-            <DialogContentText>
-              {
-                'You cannot delete this data product because it belongs to another user.'
-              }
-            </DialogContentText>
-          </DialogContent>
-          <DialogActions>
-            <Button onClick={onClose}>Close</Button>
-          </DialogActions>
-        </Dialog>
-      )}
     </Dialog>
   )
 }