From 2344c575cfb059ae5eee3b6b3ac4ce78d159bc4c Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Mon, 3 Jul 2023 23:11:37 -0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20fix(promptComponent):=20fix=20li?=
 =?UTF-8?q?nting=20issues=20and=20add=20missing=20field=5Fname=20prop=20?=
 =?UTF-8?q?=F0=9F=9A=80=20feat(promptComponent):=20improve=20prompt=20func?=
 =?UTF-8?q?tionality=20by=20adding=20missing=20field=5Fname=20prop=20Fixed?=
 =?UTF-8?q?=20some=20linting=20issues=20in=20the=20PromptAreaComponent=20a?=
 =?UTF-8?q?nd=20added=20the=20missing=20field=5Fname=20prop=20to=20improve?=
 =?UTF-8?q?=20code=20quality=20and=20maintainability.=20The=20field=5Fname?=
 =?UTF-8?q?=20prop=20was=20missing,=20which=20caused=20an=20error=20in=20t?=
 =?UTF-8?q?he=20postValidatePrompt=20function.=20This=20commit=20also=20im?=
 =?UTF-8?q?proves=20the=20prompt=20functionality=20by=20ensuring=20that=20?=
 =?UTF-8?q?the=20reactFlowInstance=20is=20updated=20and=20the=20nodes=20ar?=
 =?UTF-8?q?e=20re-rendered=20when=20the=20value=20changes.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/promptComponent/index.tsx  | 27 +++++++++++++------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/src/frontend/src/components/promptComponent/index.tsx b/src/frontend/src/components/promptComponent/index.tsx
index bc30c8a99..18bf9cc01 100644
--- a/src/frontend/src/components/promptComponent/index.tsx
+++ b/src/frontend/src/components/promptComponent/index.tsx
@@ -10,6 +10,7 @@ import { typesContext } from "../../contexts/typesContext";
 import * as _ from "lodash";
 
 export default function PromptAreaComponent({
+  field_name,
   setNodeClass,
   nodeClass,
   value,
@@ -20,7 +21,6 @@ export default function PromptAreaComponent({
   const [myValue, setMyValue] = useState("");
   const { openPopUp } = useContext(PopUpContext);
   const { reactFlowInstance } = useContext(typesContext);
-
   useEffect(() => {
     if (disabled) {
       setMyValue("");
@@ -29,19 +29,22 @@ export default function PromptAreaComponent({
   }, [disabled, onChange]);
 
   useEffect(() => {
-    if (value !== "" && myValue !== value && reactFlowInstance) { // only executed once
+    if (value !== "" && myValue !== value && reactFlowInstance) {
+      // only executed once
       setMyValue(value);
-      postValidatePrompt(value, nodeClass)
+      postValidatePrompt(field_name, value, nodeClass)
         .then((apiReturn) => {
           if (apiReturn.data) {
             setNodeClass(apiReturn.data.frontend_node);
             // need to update reactFlowInstance to re-render the nodes.
-            reactFlowInstance.setEdges(_.cloneDeep(reactFlowInstance.getEdges()));
+            reactFlowInstance.setEdges(
+              _.cloneDeep(reactFlowInstance.getEdges())
+            );
           }
         })
         .catch((error) => {});
     }
-  }, [reactFlowInstance]);
+  }, [reactFlowInstance, field_name]);
 
   return (
     <div
@@ -49,7 +52,7 @@ export default function PromptAreaComponent({
         disabled ? "pointer-events-none w-full cursor-not-allowed" : " w-full"
       }
     >
-      <div className="w-full flex items-center">
+      <div className="flex w-full items-center">
         <span
           onClick={() => {
             openPopUp(
@@ -70,7 +73,9 @@ export default function PromptAreaComponent({
           className={
             editNode
               ? " input-edit-node " + " input-dialog "
-              : (disabled ? " input-disable " : "") + " input-primary " + " input-dialog "
+              : (disabled ? " input-disable " : "") +
+                " input-primary " +
+                " input-dialog "
           }
         >
           {myValue !== "" ? myValue : "Type your prompt here"}
@@ -79,6 +84,7 @@ export default function PromptAreaComponent({
           onClick={() => {
             openPopUp(
               <GenericModal
+                field_name={field_name}
                 type={TypeModal.PROMPT}
                 value={myValue}
                 buttonText="Check & Save"
@@ -93,7 +99,12 @@ export default function PromptAreaComponent({
             );
           }}
         >
-          {!editNode && <ExternalLink strokeWidth={1.5} className="w-6 h-6 hover:text-accent-foreground ml-3" />}
+          {!editNode && (
+            <ExternalLink
+              strokeWidth={1.5}
+              className="ml-3 h-6 w-6 hover:text-accent-foreground"
+            />
+          )}
         </button>
       </div>
     </div>