Only the owner of the comment will have permission to update/delete it (

#1213) * Only the owner of the comment will have permission to update/delete it * Disabling buttons of update and delete * Fixing boolean logic
linea-it · Jan 27, 2020 · 8a8ce65 · 8a8ce65
1 parent d0d0a6c
commit 8a8ce65
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 37 deletions.
diff --git a/frontend/eyeballing/src/components/comment/Dialog.js b/frontend/eyeballing/src/components/comment/Dialog.js
@@ -59,13 +59,15 @@ function CommentDialog(props) {
 
     return (
       <Card key={idx} className={classes.cardComments}>
-        <MenuUpDelete
-          handleAlert={props.handleAlert}
-          handleDelete={props.handleDelete}
-          handleClose={handleClose}
-          handleUpdate={handleUpdate}
-          comment={comment}
-        />
+        {comment.is_owner ? (
+          <MenuUpDelete
+            handleAlert={props.handleAlert}
+            handleDelete={props.handleDelete}
+            handleClose={handleClose}
+            handleUpdate={handleUpdate}
+            comment={comment}
+          />
+        ) : null}
         <CardHeader
           title={comment.owner}
           titleTypographyProps={{

diff --git a/frontend/eyeballing/src/components/visiomatic/ContextMenu.js b/frontend/eyeballing/src/components/visiomatic/ContextMenu.js
@@ -11,8 +11,8 @@ import TextField from '@material-ui/core/TextField';
 import Button from '@material-ui/core/Button';
 import CloseIcon from '@material-ui/icons/Close';
 import { makeStyles } from '@material-ui/core/styles';
-import DriApi from '../../api/Api';
 import Grid from '@material-ui/core/Grid';
+import DriApi from '../../api/Api';
 import AlertDialog from '../comment/AlertDialog';
 
 const useStyles = makeStyles(theme => ({
@@ -63,26 +63,28 @@ function ContextMenu({
 
   useEffect(() => {
     if (updateOpen === true && open === false) {
-      let feature = features.filter(row => row.ftr_name == event.comment.split(' at')[0])[0];
-      if(!feature) {
-        feature = features.filter(row => row.ftr_name == 'Other')[0];
+      let feature = features.filter(row => row.ftr_name === event.comment.split(' at')[0])[0];
+      if (!feature) {
+        feature = features.filter(row => row.ftr_name === 'Other')[0];
         setOtherReason(event.comment);
       }
       setSelectedFeature(String(feature.id));
+    } else {
+      setSelectedFeature('');
     }
-  }, [features, updateOpen, event]);
+  }, [features, updateOpen, open, event]);
 
 
   const handleContextMenuClose = () => {
     setSelectedFeature('');
     setOtherReason('');
     handleClose();
-  }
+  };
 
   const handleSave = () => {
     const currentFeatureName = features.filter(feature => feature.id === Number(selectedFeature))[0].ftr_name;
 
-    if(updateOpen === false) {
+    if (updateOpen === false) {
       if (currentFeatureName === 'Other') {
         api.createDatasetComment(currentDataset, `${otherReason} at ${latLngToHMSDMS(event.latlng)}`, 2, event.latlng.lng, event.latlng.lat)
           .then(() => {
@@ -98,36 +100,33 @@ function ContextMenu({
           })
           .catch(err => console.error(err));
       }
+    } else if (currentFeatureName === 'Other') {
+      api.updateComment(event.id, otherReason)
+        .then(() => {
+          handleContextMenuClose();
+          getDatasetCommentsByType();
+        })
+        .catch(err => console.error(err));
     } else {
-        if (currentFeatureName === 'Other') {
-          api.updateComment(event.id, otherReason)
-            .then(() => {
-              handleContextMenuClose();
-              getDatasetCommentsByType();
-            })
-            .catch(err => console.error(err));
-        } else {
-          api.updateComment(event.id, `${currentFeatureName} at ${latLngToHMSDMS(event.latlng)}`)
-            .then(() => {
-              handleContextMenuClose();
-              getDatasetCommentsByType();
-            })
-            .catch(err => console.error(err));
-        }
-
+      api.updateComment(event.id, `${currentFeatureName} at ${latLngToHMSDMS(event.latlng)}`)
+        .then(() => {
+          handleContextMenuClose();
+          getDatasetCommentsByType();
+        })
+        .catch(err => console.error(err));
     }
     reloadData();
   };
 
   const handleDelete = () => {
     api.deleteComment(event.id)
       .then(() => {
-        setAlertDeleteOpen(false)
+        setAlertDeleteOpen(false);
         handleContextMenuClose();
         getDatasetCommentsByType();
       })
       .catch(err => console.error(err));
-      reloadData();
+    reloadData();
   };
 
   return (
@@ -168,7 +167,8 @@ function ContextMenu({
                 color="primary"
                 fullWidth
                 className={classes.button}
-                onClick={handleSave}
+                onClick={updateOpen && event && event.is_owner !== true ? null : handleSave}
+                disabled={updateOpen && event && event.is_owner !== true}
               >
                 {updateOpen ? 'Update' : 'Save'}
               </Button>
@@ -181,12 +181,13 @@ function ContextMenu({
                   color="secondary"
                   fullWidth
                   className={classes.button}
-                  onClick={() => setAlertDeleteOpen(true)}
+                  onClick={event && event.is_owner ? () => setAlertDeleteOpen(true) : null}
+                  disabled={event && event.is_owner !== true}
                 >
                   Delete
                 </Button>
               </Grid>
-              ) : null}
+            ) : null}
           </Grid>
         </DialogContent>
       </Dialog>

diff --git a/frontend/eyeballing/src/components/visiomatic/Visiomatic.js b/frontend/eyeballing/src/components/visiomatic/Visiomatic.js
@@ -114,8 +114,9 @@ class VisiomaticPanel extends Component {
   onContextMenuUpdateOpen = (feature, latlng) => {
     const event = {
       ...feature,
-      latlng: latlng,
-    }
+      latlng,
+    };
+
     this.setState({
       contextMenuUpdateOpen: true,
       contextMenuEvt: event,
@@ -164,6 +165,7 @@ class VisiomaticPanel extends Component {
         type: 'Point',
         coordinates: [comment.dts_ra, comment.dts_dec],
       },
+      is_owner: comment.is_owner,
     }));
 
     const collection = {