From 18acd7e257cef68913dbb128c766054de41eaad0 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Wed, 28 Jun 2023 17:31:10 -0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix(formModal/index.tsx):=20add?=
 =?UTF-8?q?=20missing=20setTabsState=20function=20to=20TabsContext=20to=20?=
 =?UTF-8?q?fix=20error=20=F0=9F=90=9B=20fix(formModal/index.tsx):=20update?=
 =?UTF-8?q?=20formKeysData.input=5Fkeys=20value=20when=20chatValue=20chang?=
 =?UTF-8?q?es=20to=20reflect=20user=20input?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/modals/formModal/index.tsx | 28 +++++++++++++--------
 1 file changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index 837dd7921..4e72851f4 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -45,7 +45,7 @@ export default function FormModal({
   const [chatHistory, setChatHistory] = useState<ChatMessageType[]>([]);
   const { reactFlowInstance } = useContext(typesContext);
   const { setErrorData, setNoticeData } = useContext(alertContext);
-  const { tabsState } = useContext(TabsContext);
+  const { tabsState, setTabsState } = useContext(TabsContext);
   const ws = useRef<WebSocket | null>(null);
   const [lockChat, setLockChat] = useState(false);
   const isOpen = useRef(open);
@@ -327,12 +327,14 @@ export default function FormModal({
       if (nodeValidationErrors.length === 0) {
         setLockChat(true);
         // Message variable makes a object with the keys being the names from tabsState[flow.id].formKeysData.input_keys and the values being the keysValue of the correspondent index
-        let keys = tabsState[flow.id].formKeysData.input_keys; // array of keys
-        let values = keysValue.map((k, i) => (i == chatKey ? chatValue : k)); // array of values
-        let inputs = keys.reduce((object, key, index) => {
-          object[key] = values[index];
-          return object;
-        }, {});
+        let key = Object.keys(tabsState[id.current].formKeysData.input_keys)[chatKey];
+        setTabsState((old) => {
+          let newTabsState = _.cloneDeep(old);
+          newTabsState[id.current].formKeysData.input_keys[key] = chatValue;
+          return newTabsState;
+        })
+        let inputs = tabsState[id.current].formKeysData.input_keys;
+        inputs[key] = chatValue;
         setChatValue("");
         const message = formatMessage(inputs);
         addChatHistory(message, true);
@@ -372,7 +374,9 @@ export default function FormModal({
     }
   }
 
+  console.log(tabsState[id.current])
   return (
+    (tabsState[id.current].formKeysData?.input_keys && tabsState[id.current].formKeysData?.memory_keys) &&
     <Dialog open={open} onOpenChange={setModalOpen}>
       <DialogTrigger className="hidden"></DialogTrigger>
       {tabsState[flow.id].formKeysData && (
@@ -397,7 +401,7 @@ export default function FormModal({
                 </span>
               </div>
               <Accordion type="single" collapsible className="w-full">
-                {tabsState[id.current].formKeysData.input_keys.map((i, k) => (
+                {Object.keys(tabsState[id.current].formKeysData.input_keys).map((i, k) => (
                   <AccordionItem key={k} value={i}>
                     <AccordionTrigger><Badge variant="gray" size="md">{i}</Badge></AccordionTrigger>
                     <AccordionContent>
@@ -414,9 +418,13 @@ export default function FormModal({
                           />
                         </div>
                         <Textarea
-                          value={keysValue[k]}
+                          value={tabsState[id.current].formKeysData.input_keys[i]}
                           onChange={(e) =>
-                            setKeysValue((old) => [...old.slice(0, k), e.target.value, ...old.slice(k + 1)])
+                            setTabsState((old) => {
+                              let newTabsState = _.cloneDeep(old);
+                              newTabsState[id.current].formKeysData.input_keys[i] = e.target.value;
+                              return newTabsState;
+                            })
                           }
                           disabled={chatKey === k}
                           placeholder="Enter text..."