fix: Add UUIDs after fetching node (#100)

* Add uuid after fetch * Remove .log and add not cond * Switch to Math.random and remove unecessary packages
openfoodfacts · Oct 5, 2022 · 3bafa54 · 3bafa54
1 parent 038a1a6
commit 3bafa54
Show file tree

Hide file tree

Showing 7 changed files with 33 additions and 205 deletions.
diff --git a/taxonomy-editor-frontend/package-lock.json b/taxonomy-editor-frontend/package-lock.json
diff --git a/taxonomy-editor-frontend/package.json b/taxonomy-editor-frontend/package.json
@@ -8,8 +8,6 @@
     "@material-table/core": "^0.2.35",
     "@mui/icons-material": "^5.8.4",
     "@mui/material": "^5.9.2",
-    "@mui/x-data-grid": "^5.15.0",
-    "@mui/x-data-grid-pro": "^5.15.1",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.3.0",
     "@testing-library/user-event": "^13.5.0",

diff --git a/taxonomy-editor-frontend/src/pages/editentry/AccumulateAllComponents.jsx b/taxonomy-editor-frontend/src/pages/editentry/AccumulateAllComponents.jsx
@@ -27,7 +27,23 @@ const AccumulateAllComponents = ({ id }) => {
 
     // Setting state of node after fetch
     useEffect(() => {
-        setNodeObject(node?.[0]);
+        let duplicateNode = null;
+        if (node) {
+            duplicateNode = {...node[0]}
+            // Adding UUIDs for tags and properties
+            Object.keys(node[0]).forEach((key) => {
+                if (key.startsWith('tags') && !key.includes('ids') && !key.includes('str')) {
+                    duplicateNode[key+'_uuid'] = [];
+                    duplicateNode[key].forEach(() => {
+                        duplicateNode[key+'_uuid'].push(Math.random().toString());
+                    })
+                }
+                else if (key.startsWith('prop')) {
+                    duplicateNode[key+'_uuid'] = [Math.random().toString()];
+                }
+            })
+        }
+        setNodeObject(duplicateNode);
     }, [node])
 
     // Displaying error messages if any
@@ -47,15 +63,22 @@ const AccumulateAllComponents = ({ id }) => {
     const handleSubmit = () => {
         if (!nodeObject) return
         const {id, ...data} = nodeObject // ID not allowed in POST
-        let allUrlsAndData = [[url, data]]
+        const dataToBeSent = {};
+        // Remove UUIDs from data
+        Object.keys(data).forEach((key) => {
+            if (!key.endsWith('uuid')) {
+                dataToBeSent[key] = data[key];
+            }
+        })
+        const allUrlsAndData = [[url, dataToBeSent]]
         if (isEntry) {
             allUrlsAndData.push([url+'children/', updateChildren])
         }
-        Promise.all(allUrlsAndData.map(([url, data]) => {
+        Promise.all(allUrlsAndData.map(([url, dataToBeSent]) => {
             return fetch(url, {
                 method : 'POST',
                 headers: {"Content-Type" : "application/json"},
-                body: JSON.stringify(data)
+                body: JSON.stringify(dataToBeSent)
             })
         })).then(() => {
             setOpen(true);

diff --git a/taxonomy-editor-frontend/src/pages/editentry/ListAllEntryProperties.jsx b/taxonomy-editor-frontend/src/pages/editentry/ListAllEntryProperties.jsx
@@ -1,7 +1,6 @@
 import { Box, Grid, Paper, TextField, Typography } from "@mui/material";
 import MaterialTable, { MTableToolbar } from '@material-table/core';
 import { useEffect, useState } from "react";
-import * as uuid from "uuid";
 
 const ListAllEntryProperties = ({ nodeObject, setNodeObject }) => {
     const [data, setData] = useState([]);
@@ -84,7 +83,7 @@ const ListAllEntryProperties = ({ nodeObject, setNodeObject }) => {
                 editable={{
                     onRowAdd: (newRow) => new Promise((resolve, reject) => {
                         // Add new property to rendered rows
-                        const updatedRows = [...data, { id: uuid.v4(), ...newRow }]
+                        const updatedRows = [...data, { id: Math.random().toString(), ...newRow }]
                         setData(updatedRows);
 
                         // Add new key-value pair of a property in nodeObject

diff --git a/taxonomy-editor-frontend/src/pages/editentry/ListAllNonEntryInfo.jsx b/taxonomy-editor-frontend/src/pages/editentry/ListAllNonEntryInfo.jsx
@@ -3,7 +3,6 @@ import { useState, useEffect } from "react";
 import { getIdType } from "./createURL";
 import AddBoxIcon from '@mui/icons-material/AddBox';
 import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline';
-import * as uuid from "uuid";
 import ISO6391 from 'iso-639-1';
 
 /** 
@@ -76,7 +75,7 @@ const ListAllNonEntryInfo = ({ nodeObject, id, setNodeObject }) => {
     }
 
     function handleAdd() {
-        const newRenderedNonEntryInfo = [...renderedNonEntryInfo, {'index': uuid.v4(), 'tag' : ''}];
+        const newRenderedNonEntryInfo = [...renderedNonEntryInfo, {'index': Math.random().toString(), 'tag' : ''}];
         setRenderedNonEntryInfo(newRenderedNonEntryInfo); // Set state
 
         // Updated tags assigned for later use

diff --git a/taxonomy-editor-frontend/src/pages/editentry/ListEntryChildren.jsx b/taxonomy-editor-frontend/src/pages/editentry/ListEntryChildren.jsx
@@ -9,7 +9,6 @@ import DialogContentText from '@mui/material/DialogContentText';
 import DialogTitle from '@mui/material/DialogTitle';
 import AddBoxIcon from '@mui/icons-material/AddBox';
 import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline';
-import * as uuid from "uuid";
 import ISO6391 from 'iso-639-1';
 
 const ListEntryChildren = ({url, setUpdateNodeChildren}) => {
@@ -28,7 +27,7 @@ const ListEntryChildren = ({url, setUpdateNodeChildren}) => {
             const arrayData = [];
             incomingData.map((el) =>
                 arrayData.push(
-                    {"index" : uuid.v4(), "child" : el?.[0]})
+                    {"index" : Math.random().toString(), "child" : el?.[0]})
                 );
             setRelations(arrayData);
         }
@@ -40,7 +39,7 @@ const ListEntryChildren = ({url, setUpdateNodeChildren}) => {
 
     function handleAddChild() {
         const newChildID = newLanguageCode + ':' + newChild; // Reconstructing node ID
-        setRelations([...relations, {"index" : uuid.v4(), "child": newChildID}]);
+        setRelations([...relations, {"index" : Math.random().toString(), "child": newChildID}]);
         setUpdateNodeChildren(prevState => {
             const duplicateData = [...prevState];
             duplicateData.push(newChildID);