From 71dd9821ea671b8e0e6bedb6b4a42f2133d70463 Mon Sep 17 00:00:00 2001
From: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>
Date: Mon, 18 Sep 2023 20:47:04 -0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix(parameterComponent):=20handl?=
 =?UTF-8?q?eOnNewValue=20now=20accepts=20Object[]=20as=20a=20valid=20param?=
 =?UTF-8?q?eter=20type=20to=20support=20dict=20and=20NestedDict=20types=20?=
 =?UTF-8?q?=F0=9F=90=9B=20fix(parameterComponent):=20remove=20unused=20sta?=
 =?UTF-8?q?te=20variables=20obj=20and=20dictArr=20=E2=9C=A8=20feat(paramet?=
 =?UTF-8?q?erComponent):=20add=20support=20for=20dict=20and=20NestedDict?=
 =?UTF-8?q?=20types=20in=20ParameterComponent=20=F0=9F=90=9B=20fix(dictCom?=
 =?UTF-8?q?ponent):=20call=20onChange=20when=20value=20prop=20changes=20to?=
 =?UTF-8?q?=20ensure=20proper=20synchronization=20=F0=9F=90=9B=20fix(keypa?=
 =?UTF-8?q?irListComponent):=20call=20onChange=20when=20value=20prop=20cha?=
 =?UTF-8?q?nges=20to=20ensure=20proper=20synchronization=20=F0=9F=90=9B=20?=
 =?UTF-8?q?fix(dialog.tsx):=20add=20missing=20classes=20to=20prevent=20pan?=
 =?UTF-8?q?ning,=20dragging,=20undoing,=20and=20copying=20in=20DialogPorta?=
 =?UTF-8?q?l=20and=20DialogOverlay=20components?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/parameterComponent/index.tsx   | 43 ++++++++++---------
 .../src/components/dictComponent/index.tsx    |  4 ++
 .../components/keypairListComponent/index.tsx |  4 ++
 src/frontend/src/components/ui/dialog.tsx     |  4 +-
 4 files changed, 32 insertions(+), 23 deletions(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
index 82a667c5a..c61cadc2b 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
@@ -80,7 +80,9 @@ export default function ParameterComponent({
 
   const { data: myData } = useContext(typesContext);
 
-  const handleOnNewValue = (newValue: string | string[] | boolean): void => {
+  const handleOnNewValue = (
+    newValue: string | string[] | boolean | Object[]
+  ): void => {
     let newData = cloneDeep(data);
     newData.node!.template[name].value = newValue;
     setData(newData);
@@ -99,22 +101,7 @@ export default function ParameterComponent({
     renderTooltips();
   };
 
-  const [obj, setObj] = useState({
-    arr: ["test", 123456, false, null],
-    boolean: false,
-    number: 123456,
-    try: {
-      k1: 123,
-      k2: "123",
-      k3: false,
-    },
-    string: "string",
-  });
-
   const [errorDuplicateKey, setErrorDuplicateKey] = useState(false);
-  const [dictArr, setDictArr] = useState([
-    { yourKey: "yourValue" },
-  ] as Object[]);
 
   useEffect(() => {
     if (name === "openai_api_base") console.log(info);
@@ -237,6 +224,8 @@ export default function ParameterComponent({
           type === "code" ||
           type === "prompt" ||
           type === "file" ||
+          type === "dict" ||
+          type === "NestedDict" ||
           type === "int") &&
         !optionalHandle ? (
           <></>
@@ -378,10 +367,22 @@ export default function ParameterComponent({
             <DictComponent
               disabled={disabled}
               editNode={false}
-              value={data.node!.template[name].value ?? obj}
+              value={
+                data.node!.template[name].value ?? {
+                  arr: ["test", 123456, false, null],
+                  boolean: false,
+                  number: 123456,
+                  try: {
+                    k1: 123,
+                    k2: "123",
+                    k3: false,
+                  },
+                  string: "string",
+                }
+              }
               onChange={(newValue) => {
-                setObj(newValue);
                 data.node!.template[name].value = newValue;
+                handleOnNewValue(newValue);
               }}
             />
           </div>
@@ -393,14 +394,14 @@ export default function ParameterComponent({
               value={
                 data.node!.template[name].value?.length === 0 ||
                 !data.node!.template[name].value
-                  ? dictArr
+                  ? [{ yourKey: "yourValue" }]
                   : convertObjToArray(data.node!.template[name].value)
               }
               duplicateKey={errorDuplicateKey}
               onChange={(newValue) => {
-                setErrorDuplicateKey(hasDuplicateKeys(newValue));
-                setDictArr(newValue);
                 data.node!.template[name].value = newValue;
+                setErrorDuplicateKey(hasDuplicateKeys(newValue));
+                handleOnNewValue(newValue);
               }}
             />
           </div>
diff --git a/src/frontend/src/components/dictComponent/index.tsx b/src/frontend/src/components/dictComponent/index.tsx
index fd55430bb..981372506 100644
--- a/src/frontend/src/components/dictComponent/index.tsx
+++ b/src/frontend/src/components/dictComponent/index.tsx
@@ -17,6 +17,10 @@ export default function DictComponent({
     }
   }, [disabled]);
 
+  useEffect(() => {
+    if (value) onChange(value);
+  }, [value]);
+
   return (
     <div
       className={classNames(
diff --git a/src/frontend/src/components/keypairListComponent/index.tsx b/src/frontend/src/components/keypairListComponent/index.tsx
index 580de2cfd..416e2c7b5 100644
--- a/src/frontend/src/components/keypairListComponent/index.tsx
+++ b/src/frontend/src/components/keypairListComponent/index.tsx
@@ -34,6 +34,10 @@ export default function KeypairListComponent({
     onChange(newInputList);
   };
 
+  useEffect(() => {
+    if (value) onChange(value);
+  }, [value]);
+
   return (
     <div
       className={classNames(
diff --git a/src/frontend/src/components/ui/dialog.tsx b/src/frontend/src/components/ui/dialog.tsx
index a6d3d58e9..551fa281c 100644
--- a/src/frontend/src/components/ui/dialog.tsx
+++ b/src/frontend/src/components/ui/dialog.tsx
@@ -13,7 +13,7 @@ const DialogPortal = ({
   ...props
 }: DialogPrimitive.DialogPortalProps) => (
   <DialogPrimitive.Portal className={cn(className)} {...props}>
-    <div className="fixed inset-0 z-50 flex items-start justify-center sm:items-center">
+    <div className="nopan nodrag noundo nocopy fixed inset-0 z-50 flex items-start justify-center sm:items-center">
       {children}
     </div>
   </DialogPrimitive.Portal>
@@ -27,7 +27,7 @@ const DialogOverlay = React.forwardRef<
   <DialogPrimitive.Overlay
     ref={ref}
     className={cn(
-      "noundo nocopy fixed inset-0 bottom-0 left-0 right-0 top-0 z-50 overflow-auto bg-blur-shared backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "nopan nodrag noundo nocopy fixed inset-0 bottom-0 left-0 right-0 top-0 z-50 overflow-auto bg-blur-shared backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
       className
     )}
     {...props}