refactor: Update parameterComponent to disable editing when disabled prop is true

src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx

@@ -1,7 +1,7 @@
 import { cloneDeep } from "lodash";
 import { ReactNode, useEffect, useRef, useState } from "react";
 import { useHotkeys } from "react-hotkeys-hook";
-import { Handle, Position, useUpdateNodeInternals } from "reactflow";
+import { useUpdateNodeInternals } from "reactflow";
 import CodeAreaComponent from "../../../../components/codeAreaComponent";
 import DictComponent from "../../../../components/dictComponent";
 import Dropdown from "../../../../components/dropdownComponent";
@@ -24,9 +24,8 @@ import useFlowStore from "../../../../stores/flowStore";
 import useFlowsManagerStore from "../../../../stores/flowsManagerStore";
 import { useShortcutsStore } from "../../../../stores/shortcuts";
 import { useTypesStore } from "../../../../stores/typesStore";
-import { APIClassType, VertexDataTypeAPI } from "../../../../types/api";
+import { APIClassType } from "../../../../types/api";
 import { ParameterComponentType } from "../../../../types/components";
-import { isErrorLog } from "../../../../types/utils/typeCheckingUtils";
 import {
   debouncedHandleUpdateValues,
   handleUpdateValues,
@@ -625,7 +624,9 @@ export default function ParameterComponent({
         </Case>
 
         <Case condition={left === true && type === "NestedDict"}>
-          <div className="mt-2 w-full">
+          <div
+            className={"mt-2 w-full" + (disabled ? " cursor-not-allowed" : "")}
+          >
             <DictComponent
               disabled={disabled}
               editNode={false}

src/frontend/src/components/dictComponent/index.tsx

@@ -25,6 +25,7 @@ export default function DictComponent({
       className={classNames(
         value.length > 1 && editNode ? "my-1" : "",
         "flex w-full flex-col gap-3",
+        disabled ? "pointer-events-none" : "",
       )}
     >
       {
@@ -34,6 +35,7 @@ export default function DictComponent({
             onChange={(obj) => {
               onChange(obj);
             }}
+            disabled={disabled}
           >
             <Input
               type="text"
@@ -42,7 +44,7 @@ export default function DictComponent({
                   ? "input-edit-node input-disable pointer-events-none cursor-pointer"
                   : "input-disable pointer-events-none cursor-pointer"
               }
-              placeholder="Click to edit your dictionary..."
+              placeholder={disabled ? "" : "Click to edit your dictionary..."}
               data-testid="dict-input"
             />
           </DictAreaModal>

src/frontend/src/modals/dictAreaModal/index.tsx

@@ -18,10 +18,12 @@ export default function DictAreaModal({
   children,
   onChange,
   value,
+  disabled = false,
 }: {
   children: JSX.Element;
   onChange?: (value: Object) => void;
   value: Object;
+  disabled?: boolean;
 }): JSX.Element {
   const [open, setOpen] = useState(false);
   const isDark = useDarkStore((state) => state.dark);
@@ -35,6 +37,7 @@ export default function DictAreaModal({
     <BaseModal
       size="medium-h-full"
       open={open}
+      disable={disabled}
       setOpen={setOpen}
       onSubmit={
         onChange