refactor addContained and removeContained functions

KaplanOpenSource · Dec 17, 2024 · 939f6e9 · 939f6e9
1 parent ae2d36f
commit 939f6e9
Showing 1 changed file with 68 additions and 21 deletions.
diff --git a/client/src/Experiment/Contained/AddContainedButton.jsx b/client/src/Experiment/Contained/AddContainedButton.jsx
@@ -2,6 +2,7 @@ import { MergeType } from "@mui/icons-material"
 import { ButtonTooltip } from "../../Utils/ButtonTooltip"
 import { useContext } from "react";
 import { experimentContext } from "../../Context/ExperimentProvider";
+import { ContextMenu } from "../../Utils/ContextMenu";
 
 export const AddContainedButton = ({ deviceItem, deviceType }) => {
     const { selection, currTrial, setTrialData } = useContext(experimentContext);
@@ -20,36 +21,82 @@ export const AddContainedButton = ({ deviceItem, deviceType }) => {
         disabled = deviceItemName === deviceItem.name && deviceTypeName === deviceType.name;
     }
 
+    const addContained = (devicesOnTrialCopy, deviceItemParentName, deviceTypeParentName, deviceItemChildName, deviceTypeChildName) => {
+        const containedIn = { deviceItemName: deviceItemParentName, deviceTypeName: deviceTypeParentName }
+        const i = devicesOnTrialCopy.findIndex(t => t.deviceItemName === deviceItemChildName && t.deviceTypeName === deviceTypeChildName);
+        if (i !== -1) {
+            devicesOnTrialCopy[i].containedIn = containedIn;
+        } else {
+            devicesOnTrialCopy.push({
+                deviceTypeName: deviceTypeChildName,
+                deviceItemName: deviceItemChildName,
+                containedIn
+            });
+        }
+    }
+
+    const removeContained = (devicesOnTrialCopy, deviceItemChildName, deviceTypeChildName) => {
+        const i = devicesOnTrialCopy.findIndex(t => t.deviceItemName === deviceItemChildName && t.deviceTypeName === deviceTypeChildName);
+        if (i !== -1) {
+            delete devicesOnTrialCopy[i].containedIn;
+            if (!devicesOnTrialCopy[i].location) {
+                devicesOnTrialCopy.splice(i, 1);
+            }
+        }
+    }
+
     const handleClick = () => {
         if (!disabled) {
-            const dev = { ...(topSelected || {}) };
+            const devicesOnTrialCopy = [...devicesOnTrial];
             if (topSelectedIsContained) {
-                delete dev.containedIn;
+                removeContained(devicesOnTrialCopy, deviceItemName, deviceTypeName);
             } else {
-                dev.containedIn = { deviceItemName: deviceItem.name, deviceTypeName: deviceType.name }
+                addContained(devicesOnTrialCopy, deviceItem.name, deviceType.name, deviceItemName, deviceTypeName);
             }
-            const devs = [...devicesOnTrial];
-            if (topSelectedIndex !== -1) {
-                devs[topSelectedIndex] = dev;
-            } else {
-                devs.push(dev);
-            }
-            setTrialData({ ...currTrial.trial, devicesOnTrial: devs });
+            setTrialData({ ...currTrial.trial, devicesOnTrial: devicesOnTrialCopy });
         }
     }
 
+    const tooltip = disabled
+        ? 'To add a contained device, select a device that is not this one'
+        : (topSelectedIsContained
+            ? 'Remove the top selected device from being contained in this'
+            : 'Add the top selected device to be contained in this');
+
+    const menuItems = [
+        { label: tooltip, callback: handleClick },
+        {
+            label: 'Add all selected devices to be contained in this', callback: () => {
+
+            }
+        },
+        { label: 'Remove all selected devices to be contained in this', callback: () => { } },
+        {
+            label: 'Remove all contained devices',
+            callback: () => {
+                // const devs = [...devicesOnTrial];
+                // if (topSelectedIndex !== -1) {
+                //     devs[topSelectedIndex] = dev;
+                // } else {
+                //     devs.push(dev);
+                // }
+                // setTrialData({ ...currTrial.trial, devicesOnTrial: devs });
+            }
+        },
+    ];
+
     return (
-        <ButtonTooltip
-            disabled={disabled}
-            tooltip={disabled
-                ? 'To add a contained device, the top selected device should be a different one'
-                : (topSelectedIsContained
-                    ? 'Remove the top selected device from being contained in this'
-                    : 'Add the top selected device to be contained in this')}
-            onClick={handleClick}
-            color={topSelectedIsContained ? "primary" : ""}
+        <ContextMenu
+            menuItems={menuItems}
         >
-            <MergeType />
-        </ButtonTooltip>
+            <ButtonTooltip
+                disabled={disabled}
+                tooltip={tooltip}
+                onClick={handleClick}
+                color={topSelectedIsContained ? "primary" : ""}
+            >
+                <MergeType />
+            </ButtonTooltip>
+        </ContextMenu>
     )
 }