From 244fe5c123e33fe07eb632c5c37e87f8877fcddb Mon Sep 17 00:00:00 2001
From: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>
Date: Fri, 9 Jun 2023 16:41:34 -0300
Subject: [PATCH] Adjusted state of toggle buttons and inputComp

---
 .../components/parameterComponent/index.tsx      |  3 +++
 .../components/ShadTooltipComponent/index.tsx    | 16 +++++++++-------
 .../src/components/inputComponent/index.tsx      |  7 +++++++
 src/frontend/src/modals/EditNodeModal/index.tsx  |  6 ++----
 src/frontend/src/types/components/index.ts       |  3 +++
 5 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
index d6ca1fe90..55256951b 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
@@ -40,6 +40,7 @@ export default function ParameterComponent({
   const refHtml = useRef(null);
   const updateNodeInternals = useUpdateNodeInternals();
   const [position, setPosition] = useState(0);
+
   useEffect(() => {
     if (ref.current && ref.current.offsetTop && ref.current.clientHeight) {
       setPosition(ref.current.offsetTop + ref.current.clientHeight / 2);
@@ -54,6 +55,7 @@ export default function ParameterComponent({
   const [enabled, setEnabled] = useState(
     data.node.template[name]?.value ?? false
   );
+
   const { reactFlowInstance } = useContext(typesContext);
   let disabled =
     reactFlowInstance?.getEdges().some((e) => e.targetHandle === id) ?? false;
@@ -125,6 +127,7 @@ export default function ParameterComponent({
             delayDuration={0}
             content={refHtml.current}
             side={left ? "left" : "right"}
+            open={refHtml?.current?.length > 0}
           >
             <Handle
               type={left ? "target" : "source"}
diff --git a/src/frontend/src/components/ShadTooltipComponent/index.tsx b/src/frontend/src/components/ShadTooltipComponent/index.tsx
index a360f3ff0..6dfde8f8f 100644
--- a/src/frontend/src/components/ShadTooltipComponent/index.tsx
+++ b/src/frontend/src/components/ShadTooltipComponent/index.tsx
@@ -10,13 +10,15 @@ const ShadTooltip = (props) => {
     <TooltipProvider>
       <Tooltip delayDuration={props.delayDuration}>
         <TooltipTrigger asChild>{props.children}</TooltipTrigger>
-        <TooltipContent
-          side={props.side}
-          avoidCollisions={false}
-          sticky="always"
-        >
-          {props.content}
-        </TooltipContent>
+        {props.open && (
+          <TooltipContent
+            side={props.side}
+            avoidCollisions={false}
+            sticky="always"
+          >
+            {props.content}
+          </TooltipContent>
+        )}
       </Tooltip>
     </TooltipProvider>
   );
diff --git a/src/frontend/src/components/inputComponent/index.tsx b/src/frontend/src/components/inputComponent/index.tsx
index a4072e9c1..b7b245c75 100644
--- a/src/frontend/src/components/inputComponent/index.tsx
+++ b/src/frontend/src/components/inputComponent/index.tsx
@@ -2,6 +2,7 @@ import { useContext, useEffect, useState } from "react";
 import { InputComponentType } from "../../types/components";
 import { classNames } from "../../utils";
 import { TabsContext } from "../../contexts/tabsContext";
+import { PopUpContext } from "../../contexts/popUpContext";
 
 export default function InputComponent({
   value,
@@ -14,6 +15,8 @@ export default function InputComponent({
   const [myValue, setMyValue] = useState(value ?? "");
   const [pwdVisible, setPwdVisible] = useState(false);
   const { setDisableCopyPaste } = useContext(TabsContext);
+  const { closePopUp } = useContext(PopUpContext);
+
   useEffect(() => {
     if (disabled) {
       setMyValue("");
@@ -21,6 +24,10 @@ export default function InputComponent({
     }
   }, [disabled, onChange]);
 
+  useEffect(() => {
+    setMyValue(value ?? "");
+  }, [closePopUp]);
+
   return (
     <div
       className={
diff --git a/src/frontend/src/modals/EditNodeModal/index.tsx b/src/frontend/src/modals/EditNodeModal/index.tsx
index f6f4d9111..eb906b64a 100644
--- a/src/frontend/src/modals/EditNodeModal/index.tsx
+++ b/src/frontend/src/modals/EditNodeModal/index.tsx
@@ -60,12 +60,12 @@ export default function EditNodeModal({ data }: { data: NodeDataType }) {
           data.node.template[t].type === "int")
     ).length
   );
-  const [nodeValue, setNodeValue] = useState(true);
+  const [nodeValue, setNodeValue] = useState(null);
   const { closePopUp } = useContext(PopUpContext);
   const { types } = useContext(typesContext);
   const ref = useRef();
   const { save } = useContext(TabsContext);
-  const [enabled, setEnabled] = useState(false);
+  const [enabled, setEnabled] = useState(null);
   if (nodeLength == 0) {
     closePopUp();
   }
@@ -87,8 +87,6 @@ export default function EditNodeModal({ data }: { data: NodeDataType }) {
     setNodeValue(!nodeValue);
   }
 
-  console.log(data.node.template);
-
   return (
     <Dialog open={true} onOpenChange={setModalOpen}>
       <DialogTrigger></DialogTrigger>
diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts
index 419710cfe..8eb66d32b 100644
--- a/src/frontend/src/types/components/index.ts
+++ b/src/frontend/src/types/components/index.ts
@@ -13,11 +13,14 @@ export type InputComponentType = {
   password: boolean;
   disableCopyPaste?: boolean;
   editNode?: boolean;
+  onChangePass?: (value: boolean | boolean) => void;
+  showPass?: boolean;
 };
 export type ToggleComponentType = {
   enabled: boolean;
   setEnabled: (state: boolean) => void;
   disabled: boolean;
+  name?: string;
 };
 export type DropDownComponentType = {
   value: string;