Merge pull request #40 from sophie0730/develop

Develop

client/src/components/dashboard.jsx

@@ -1,6 +1,8 @@
 /* eslint-disable react/prop-types */
 import * as React from 'react';
 import { ToastContainer, toast } from 'react-toastify';
+import { useNavigate } from 'react-router-dom';
+
 import axios from 'axios';
 import Box from '@mui/material/Box';
 import AddIcon from '@mui/icons-material/Add';
@@ -171,6 +173,7 @@ function DashboardTable({ setRows, rows }) {
   const fetchDashboardAPI = `${import.meta.env.VITE_HOST}/api/1.0/read-json`;
   const [deleteWindowOpen, setDeleteWindowOpen] = React.useState(false);
   const [deleteId, setDeleteId] = React.useState(null);
+  const navigate = useNavigate();
 
   const handleDeleteOpen = (id) => {
     setDeleteWindowOpen(true);
@@ -196,7 +199,7 @@ function DashboardTable({ setRows, rows }) {
 
   const handleLaunchClick = (id) => {
     const targetUrl = `/dashboard/detail/${id}`;
-    window.location.href = targetUrl;
+    navigate(targetUrl);
   };
 
   const handleDeleteClick = async(id) => {

client/src/components/detail.jsx

@@ -1,6 +1,6 @@
 /* eslint-disable react/prop-types */
 import * as React from 'react';
-import { useParams } from 'react-router-dom';
+import { useParams, useNavigate } from 'react-router-dom';
 import { ToastContainer, toast } from 'react-toastify';
 import axios from 'axios';
 import AddIcon from '@mui/icons-material/Add';
@@ -36,6 +36,7 @@ function DetailTop({ setGraphCount }) {
   const [selectedItem, setSelectedItem] = React.useState('');
   const [items, setItems] = React.useState([]);
   const [selectedType, setSelectedType] = React.useState('');
+  const navigate = useNavigate();
 
   const fetchItemsAPI = `${import.meta.env.VITE_HOST}/api/1.0/fetchItems`;
   const { id } = useParams();
@@ -44,8 +45,7 @@ function DetailTop({ setGraphCount }) {
   const handleClose = () => setOpen(false);
 
   const backToPrevPage = () => {
-    const targetUrl = '/dashboard';
-    window.location.href = targetUrl;
+    navigate('/dashboard');
   };
 
   React.useEffect(() => {

server/controllers/dashboard.js

@@ -60,7 +60,7 @@ function deleteGraph(id, graph) {
   if (graph === 'all') {
     newData = dataJson.filter((object) => (object.id !== Number(id)));
   } else {
-    newData = dataJson.filter((object) => (object.id === Number(id) && object.item !== graph));
+    newData = dataJson.filter((object) => !(object.id === Number(id) && object.item === graph));
   }
 
   fs.writeFile(graphFilePath, JSON.stringify(newData, null, 1), (error) => {
@@ -241,8 +241,9 @@ export function deleteDashboardGraph(req, res) {
     }
 
     const newData = deleteGraph(id, graphName);
+    const newDataPerId = newData.filter((element) => element.id === Number(id));
 
-    return res.status(200).json(newData);
+    return res.status(200).json(newDataPerId);
   } catch (error) {
     return res.status(500).json(`Error from graph deletion: ${error}`);
   }