From 6afca21e5ab050d31498059bfe6bf2779d65da19 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Wed, 28 Jun 2023 17:13:06 -0300
Subject: [PATCH 01/51] =?UTF-8?q?=F0=9F=90=9B=20fix(utils.py):=20fix=20bui?=
 =?UTF-8?q?ld=5Finput=5Fkeys=5Fresponse=20function=20to=20correctly=20filt?=
 =?UTF-8?q?er=20out=20memory=20variables=20from=20input=20keys=20The=20bui?=
 =?UTF-8?q?ld=5Finput=5Fkeys=5Fresponse=20function=20now=20correctly=20fil?=
 =?UTF-8?q?ters=20out=20memory=20variables=20from=20the=20input=20keys=20r?=
 =?UTF-8?q?esponse.=20Previously,=20it=20was=20using=20a=20list=20comprehe?=
 =?UTF-8?q?nsion=20to=20filter=20the=20keys,=20but=20it=20should=20have=20?=
 =?UTF-8?q?been=20using=20a=20dictionary=20comprehension=20to=20preserve?=
 =?UTF-8?q?=20the=20key-value=20pairs.=20This=20fix=20ensures=20that=20onl?=
 =?UTF-8?q?y=20the=20keys=20that=20are=20not=20present=20in=20the=20langch?=
 =?UTF-8?q?ain=5Fobject's=20memory=20variables=20are=20included=20in=20the?=
 =?UTF-8?q?=20input=20keys=20response.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/api/utils.py | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/backend/langflow/api/utils.py b/src/backend/langflow/api/utils.py
index bd566896d..bd25d74f4 100644
--- a/src/backend/langflow/api/utils.py
+++ b/src/backend/langflow/api/utils.py
@@ -37,11 +37,11 @@ def build_input_keys_response(langchain_object):
         langchain_object.memory, "memory_variables"
     ):
         # Remove memory variables from input keys
-        input_keys_response["input_keys"] = [
-            key
-            for key in input_keys_response["input_keys"]
+        input_keys_response["input_keys"] = {
+            key: value
+            for key, value in input_keys_response["input_keys"].items()
             if key not in langchain_object.memory.memory_variables
-        ]
+        }
         # Add memory variables to memory_keys
         input_keys_response["memory_keys"] = langchain_object.memory.memory_variables
 

From 9d556bc94cd19267853807f00b3088e00404acc4 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Wed, 28 Jun 2023 17:13:32 -0300
Subject: [PATCH 02/51] =?UTF-8?q?=F0=9F=90=9B=20fix(chatComponent):=20remo?=
 =?UTF-8?q?ve=20unused=20openForm=20state=20variable=20=F0=9F=90=9B=20fix(?=
 =?UTF-8?q?formModal):=20remove=20console.log=20statement=20=F0=9F=90=9B?=
 =?UTF-8?q?=20fix(formModal):=20fix=20formatMessage=20function=20to=20hand?=
 =?UTF-8?q?le=20string=20inputs=20correctly?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/components/chatComponent/index.tsx | 1 -
 src/frontend/src/modals/formModal/index.tsx         | 6 +++---
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/frontend/src/components/chatComponent/index.tsx b/src/frontend/src/components/chatComponent/index.tsx
index cd3c9c789..60682f9ea 100644
--- a/src/frontend/src/components/chatComponent/index.tsx
+++ b/src/frontend/src/components/chatComponent/index.tsx
@@ -10,7 +10,6 @@ import FormModal from "../../modals/formModal";
 
 export default function Chat({ flow }: ChatType) {
   const [open, setOpen] = useState(false);
-  const [openForm, setOpenForm] = useState(false);
   const [isBuilt, setIsBuilt] = useState(false);
 
   useEffect(() => {
diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index db512ac29..837dd7921 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -166,13 +166,13 @@ export default function FormModal({
                 chatItem.files
                   ? {
                       isSend: !chatItem.is_bot,
-                      message: chatItem.is_bot ? chatItem.message : formatMessage(chatItem.message),
+                      message: formatMessage(chatItem.message),
                       thought: chatItem.intermediate_steps,
                       files: chatItem.files,
                     }
                   : {
                       isSend: !chatItem.is_bot,
-                      message: chatItem.is_bot ? chatItem.message : formatMessage(chatItem.message),
+                      message: formatMessage(chatItem.message),
                       thought: chatItem.intermediate_steps,
                     }
               );
@@ -305,6 +305,7 @@ export default function FormModal({
   }, [open]);
   function formatMessage(inputs: any): string {
     if (inputs) {
+      if(typeof inputs == "string") return inputs;
       // inputs is a object with the keys and values being input_keys and keysValue
       // so the formated message is a string with the keys and values separated by ": "
       let message = "";
@@ -371,7 +372,6 @@ export default function FormModal({
     }
   }
 
-  console.log(chatHistory)
   return (
     <Dialog open={open} onOpenChange={setModalOpen}>
       <DialogTrigger className="hidden"></DialogTrigger>

From 03349bf999bf259ad72d5d08942a3dbb11424ffc Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Wed, 28 Jun 2023 17:26:57 -0300
Subject: [PATCH 03/51] =?UTF-8?q?=F0=9F=90=9B=20fix(vertex/base.py):=20add?=
 =?UTF-8?q?=20artifacts=20attribute=20to=20Vertex=20class=20to=20store=20a?=
 =?UTF-8?q?dditional=20data=20=F0=9F=90=9B=20fix(vertex/base.py):=20update?=
 =?UTF-8?q?=20instantiation=20logic=20to=20handle=20tuple=20result=20from?=
 =?UTF-8?q?=20loading.instantiate=5Fclass()=20=F0=9F=90=9B=20fix(loading.p?=
 =?UTF-8?q?y):=20update=20return=20value=20of=20instantiate=5Fprompt()=20t?=
 =?UTF-8?q?o=20return=20a=20tuple=20of=20prompt=20and=20format=5Fkwargs=20?=
 =?UTF-8?q?The=20Vertex=20class=20now=20has=20a=20new=20attribute=20called?=
 =?UTF-8?q?=20artifacts,=20which=20is=20a=20dictionary=20used=20to=20store?=
 =?UTF-8?q?=20additional=20data=20related=20to=20the=20vertex.=20The=20ins?=
 =?UTF-8?q?tantiation=20logic=20in=20the=20Vertex=20class=20has=20been=20u?=
 =?UTF-8?q?pdated=20to=20handle=20the=20case=20where=20loading.instantiate?=
 =?UTF-8?q?=5Fclass()=20returns=20a=20tuple=20containing=20the=20built=20o?=
 =?UTF-8?q?bject=20and=20additional=20artifacts.=20The=20loading.instantia?=
 =?UTF-8?q?te=5Fprompt()=20function=20now=20returns=20a=20tuple=20containi?=
 =?UTF-8?q?ng=20the=20prompt=20and=20format=5Fkwargs.=20These=20changes=20?=
 =?UTF-8?q?fix=20issues=20related=20to=20storing=20and=20handling=20additi?=
 =?UTF-8?q?onal=20data=20in=20the=20vertex=20and=20loading=20modules.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/graph/vertex/base.py            | 9 ++++++++-
 src/backend/langflow/interface/initialize/loading.py | 2 +-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/backend/langflow/graph/vertex/base.py b/src/backend/langflow/graph/vertex/base.py
index 61c50eda5..5e723b989 100644
--- a/src/backend/langflow/graph/vertex/base.py
+++ b/src/backend/langflow/graph/vertex/base.py
@@ -25,6 +25,7 @@ class Vertex:
         self._parse_data()
         self._built_object = None
         self._built = False
+        self.artifacts: Dict[str, Any] = {}
 
     def _parse_data(self) -> None:
         self.data = self._data["data"]
@@ -195,11 +196,17 @@ class Vertex:
         # and return the instance
 
         try:
-            self._built_object = loading.instantiate_class(
+            result = loading.instantiate_class(
                 node_type=self.vertex_type,
                 base_type=self.base_type,
                 params=self.params,
             )
+            # Result could be the _built_object or
+            # (_built_object, dict) tuple
+            if isinstance(result, tuple):
+                self._built_object, self.artifacts = result
+            else:
+                self._built_object = result
         except Exception as exc:
             raise ValueError(
                 f"Error building node {self.vertex_type}: {str(exc)}"
diff --git a/src/backend/langflow/interface/initialize/loading.py b/src/backend/langflow/interface/initialize/loading.py
index bbaa1f131..1a075184e 100644
--- a/src/backend/langflow/interface/initialize/loading.py
+++ b/src/backend/langflow/interface/initialize/loading.py
@@ -124,7 +124,7 @@ def instantiate_prompt(node_type, class_object, params):
     if format_kwargs:
         prompt = prompt.partial(**format_kwargs)
 
-    return prompt
+    return prompt, format_kwargs
 
 
 def instantiate_tool(node_type, class_object, params):

From d0da0bb1ca5d07609346b74e06a77dcaa5f2c739 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Wed, 28 Jun 2023 17:27:18 -0300
Subject: [PATCH 04/51] =?UTF-8?q?=F0=9F=90=9B=20fix(chat.py):=20add=20supp?=
 =?UTF-8?q?ort=20for=20artifacts=20in=20stream=5Fbuild=20function=20to=20p?=
 =?UTF-8?q?ass=20prompt=20variables=20to=20build=5Finput=5Fkeys=5Fresponse?=
 =?UTF-8?q?=20=E2=9C=A8=20feat(chat.py):=20update=20build=5Finput=5Fkeys?=
 =?UTF-8?q?=5Fresponse=20function=20to=20accept=20artifacts=20parameter=20?=
 =?UTF-8?q?to=20set=20input=5Fkeys=20values=20The=20stream=5Fbuild=20funct?=
 =?UTF-8?q?ion=20now=20supports=20the=20artifacts=20parameter,=20which=20a?=
 =?UTF-8?q?llows=20passing=20prompt=20variables=20to=20the=20build=5Finput?=
 =?UTF-8?q?=5Fkeys=5Fresponse=20function.=20This=20ensures=20that=20the=20?=
 =?UTF-8?q?input=5Fkeys=20values=20are=20correctly=20set=20based=20on=20th?=
 =?UTF-8?q?e=20provided=20artifacts.=20The=20build=5Finput=5Fkeys=5Frespon?=
 =?UTF-8?q?se=20function=20has=20been=20updated=20to=20accept=20the=20arti?=
 =?UTF-8?q?facts=20parameter=20and=20use=20it=20to=20set=20the=20input=5Fk?=
 =?UTF-8?q?eys=20values.=20This=20improves=20the=20functionality=20of=20th?=
 =?UTF-8?q?e=20chat=20module=20by=20allowing=20more=20flexibility=20in=20h?=
 =?UTF-8?q?andling=20prompt=20variables.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/api/v1/chat.py | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/backend/langflow/api/v1/chat.py b/src/backend/langflow/api/v1/chat.py
index de3c33e01..cdffcdf4f 100644
--- a/src/backend/langflow/api/v1/chat.py
+++ b/src/backend/langflow/api/v1/chat.py
@@ -72,6 +72,7 @@ async def stream_build(flow_id: str):
 
     async def event_stream(flow_id):
         final_response = {"end_of_stream": True}
+        artifacts = {}
         try:
             if flow_id not in flow_data_store:
                 error_message = "Invalid session ID"
@@ -108,6 +109,11 @@ async def stream_build(flow_id: str):
                     logger.debug(
                         f"Building node {params[:50]}{'...' if len(params) > 50 else ''}"
                     )
+                    if vertex.artifacts:
+                        # The artifacts will be prompt variables
+                        # passed to build_input_keys_response
+                        # to set the input_keys values
+                        artifacts.update(vertex.artifacts)
                 except Exception as exc:
                     params = str(exc)
                     valid = False
@@ -124,7 +130,9 @@ async def stream_build(flow_id: str):
             langchain_object = graph.build()
             # Now we  need to check the input_keys to send them to the client
             if hasattr(langchain_object, "input_keys"):
-                input_keys_response = build_input_keys_response(langchain_object)
+                input_keys_response = build_input_keys_response(
+                    langchain_object, artifacts
+                )
                 yield str(StreamData(event="message", data=input_keys_response))
 
             chat_manager.set_cache(flow_id, langchain_object)

From bb377d4935153f2df98f6d73a76b698f120442b2 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Wed, 28 Jun 2023 17:27:28 -0300
Subject: [PATCH 05/51] =?UTF-8?q?=F0=9F=90=9B=20fix(utils.py):=20set=20inp?=
 =?UTF-8?q?ut=20keys=20values=20from=20artifacts=20in=20build=5Finput=5Fke?=
 =?UTF-8?q?ys=5Fresponse=20function=20=E2=9C=A8=20feat(utils.py):=20add=20?=
 =?UTF-8?q?support=20for=20setting=20input=20keys=20values=20from=20artifa?=
 =?UTF-8?q?cts=20in=20build=5Finput=5Fkeys=5Fresponse=20function=20The=20b?=
 =?UTF-8?q?uild=5Finput=5Fkeys=5Fresponse=20function=20now=20takes=20an=20?=
 =?UTF-8?q?additional=20parameter,=20artifacts,=20which=20is=20a=20diction?=
 =?UTF-8?q?ary=20containing=20key-value=20pairs.=20The=20function=20sets?=
 =?UTF-8?q?=20the=20values=20of=20the=20input=20keys=20in=20the=20input=5F?=
 =?UTF-8?q?keys=5Fresponse=20dictionary=20based=20on=20the=20corresponding?=
 =?UTF-8?q?=20keys=20in=20the=20artifacts=20dictionary.=20This=20allows=20?=
 =?UTF-8?q?for=20more=20flexibility=20in=20setting=20the=20input=20keys=20?=
 =?UTF-8?q?values=20dynamically=20based=20on=20the=20provided=20artifacts.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/api/utils.py | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/backend/langflow/api/utils.py b/src/backend/langflow/api/utils.py
index bd25d74f4..2df86eb7f 100644
--- a/src/backend/langflow/api/utils.py
+++ b/src/backend/langflow/api/utils.py
@@ -24,13 +24,18 @@ def remove_api_keys(flow: dict):
     return flow
 
 
-def build_input_keys_response(langchain_object):
+def build_input_keys_response(langchain_object, artifacts):
     """Build the input keys response."""
 
     input_keys_response = {
         "input_keys": {key: "" for key in langchain_object.input_keys},
         "memory_keys": [],
     }
+
+    # Set the input keys values from artifacts
+    for key, value in artifacts.items():
+        if key in input_keys_response["input_keys"]:
+            input_keys_response["input_keys"][key] = value
     # If the object has memory, that memory will have a memory_variables attribute
     # memory variables should be removed from the input keys
     if hasattr(langchain_object, "memory") and hasattr(

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 06/51] =?UTF-8?q?=F0=9F=90=9B=20fix(formModal/index.tsx):?=
 =?UTF-8?q?=20add=20missing=20setTabsState=20function=20to=20TabsContext?=
 =?UTF-8?q?=20to=20fix=20error=20=F0=9F=90=9B=20fix(formModal/index.tsx):?=
 =?UTF-8?q?=20update=20formKeysData.input=5Fkeys=20value=20when=20chatValu?=
 =?UTF-8?q?e=20changes=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..."

From 3bd103dbc5413e924f2c85a5dadfee710170be51 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Wed, 28 Jun 2023 17:42:58 -0300
Subject: [PATCH 07/51] =?UTF-8?q?=F0=9F=94=A8=20refactor(promptComponent):?=
 =?UTF-8?q?=20move=20postValidatePrompt=20import=20statement=20to=20the=20?=
 =?UTF-8?q?top=20of=20the=20file=20for=20better=20organization?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

🔥 chore(promptModal): remove unused promptModal component

🔨 refactor(promptComponent): use useEffect to make a POST request to validate the prompt value and update the nodeClass state if the API returns data
---
 .../src/components/promptComponent/index.tsx  |  13 ++
 src/frontend/src/modals/promptModal/index.tsx | 153 ------------------
 2 files changed, 13 insertions(+), 153 deletions(-)
 delete mode 100644 src/frontend/src/modals/promptModal/index.tsx

diff --git a/src/frontend/src/components/promptComponent/index.tsx b/src/frontend/src/components/promptComponent/index.tsx
index 59c4227ef..3f0742407 100644
--- a/src/frontend/src/components/promptComponent/index.tsx
+++ b/src/frontend/src/components/promptComponent/index.tsx
@@ -5,6 +5,7 @@ import GenericModal from "../../modals/genericModal";
 import { TypeModal } from "../../utils";
 import { INPUT_STYLE } from "../../constants";
 import { ExternalLink } from "lucide-react";
+import { postValidatePrompt } from "../../controllers/API";
 
 export default function PromptAreaComponent({
   setNodeClass,
@@ -23,6 +24,18 @@ export default function PromptAreaComponent({
     }
   }, [disabled, onChange]);
 
+  useEffect(() => {
+    if (value) {
+      postValidatePrompt(myValue, nodeClass)
+        .then((apiReturn) => {
+          if (apiReturn.data) {
+            setNodeClass(apiReturn.data.frontend_node);
+          }
+        })
+        .catch((error) => {});
+    }
+  }, [value]);
+
   useEffect(() => {
     setMyValue(value);
   }, [value]);
diff --git a/src/frontend/src/modals/promptModal/index.tsx b/src/frontend/src/modals/promptModal/index.tsx
deleted file mode 100644
index 2ab1c140a..000000000
--- a/src/frontend/src/modals/promptModal/index.tsx
+++ /dev/null
@@ -1,153 +0,0 @@
-import { Dialog, Transition } from "@headlessui/react";
-import { XMarkIcon, DocumentTextIcon } from "@heroicons/react/24/outline";
-import { Fragment, useContext, useRef, useState } from "react";
-import { PopUpContext } from "../../contexts/popUpContext";
-import { darkContext } from "../../contexts/darkContext";
-import { postValidatePrompt } from "../../controllers/API";
-import { alertContext } from "../../contexts/alertContext";
-export default function PromptAreaModal({
-  value,
-  setValue,
-}: {
-  setValue: (value: string) => void;
-  value: string;
-}) {
-  const [open, setOpen] = useState(true);
-  const [myValue, setMyValue] = useState(value);
-  const { dark } = useContext(darkContext);
-  const { setErrorData, setSuccessData } = useContext(alertContext);
-  const { closePopUp } = useContext(PopUpContext);
-  const ref = useRef();
-  function setModalOpen(x: boolean) {
-    setOpen(x);
-    if (x === false) {
-      setTimeout(() => {
-        closePopUp();
-      }, 300);
-    }
-  }
-  return (
-    <Transition.Root show={open} appear={true} as={Fragment}>
-      <Dialog
-        as="div"
-        className="relative z-10"
-        onClose={setModalOpen}
-        initialFocus={ref}
-      >
-        <Transition.Child
-          as={Fragment}
-          enter="ease-out duration-300"
-          enterFrom="opacity-0"
-          enterTo="opacity-100"
-          leave="ease-in duration-200"
-          leaveFrom="opacity-100"
-          leaveTo="opacity-0"
-        >
-          <div className="fixed inset-0 bg-ring dark:bg-gray-600 dark:bg-opacity-75 bg-opacity-75 transition-opacity" />
-        </Transition.Child>
-
-        <div className="fixed inset-0 z-10 overflow-y-auto">
-          <div className="flex h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
-            <Transition.Child
-              as={Fragment}
-              enter="ease-out duration-300"
-              enterFrom="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
-              enterTo="opacity-100 translate-y-0 sm:scale-100"
-              leave="ease-in duration-200"
-              leaveFrom="opacity-100 translate-y-0 sm:scale-100"
-              leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
-            >
-              <Dialog.Panel className="relative flex flex-col justify-between transform h-[600px] overflow-hidden rounded-lg bg-white dark:bg-gray-800 text-left shadow-xl transition-all sm:my-8 w-[700px]">
-                <div className=" z-50 absolute top-0 right-0 hidden pt-4 pr-4 sm:block">
-                  <button
-                    type="button"
-                    className="rounded-md text-gray-400 hover:text-gray-500"
-                    onClick={() => {
-                      setModalOpen(false);
-                    }}
-                  >
-                    <span className="sr-only">Close</span>
-                    <XMarkIcon className="h-6 w-6" aria-hidden="true" />
-                  </button>
-                </div>
-                <div className="h-full w-full flex flex-col justify-center items-center">
-                  <div className="flex w-full pb-4 z-10 justify-center shadow-sm">
-                    <div className="mx-auto mt-4 flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-full bg-blue-100 dark:bg-gray-900 sm:mx-0 sm:h-10 sm:w-10">
-                      <DocumentTextIcon
-                        className="h-6 w-6 text-blue-600"
-                        aria-hidden="true"
-                      />
-                    </div>
-                    <div className="mt-4 text-center sm:ml-4 sm:text-left">
-                      <Dialog.Title
-                        as="h3"
-                        className="text-lg font-medium dark:text-white leading-10 text-gray-900"
-                      >
-                        Edit Prompt
-                      </Dialog.Title>
-                    </div>
-                  </div>
-                  <div className="h-full w-full bg-accent overflow-auto dark:bg-gray-900 p-4 gap-4 flex flex-row justify-center items-center">
-                    <div className="flex h-full w-full">
-                      <div className="overflow-hidden px-4 py-5 sm:p-6 w-full h-full rounded-lg bg-white dark:bg-gray-800 shadow">
-                        <textarea
-                          ref={ref}
-                          className="form-input h-full w-full rounded-lg border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-white"
-                          value={myValue}
-                          onChange={(e) => {
-                            setMyValue(e.target.value);
-                            setValue(e.target.value);
-                          }}
-                        />
-                      </div>
-                    </div>
-                  </div>
-                  <div className="bg-gray-200 dark:bg-gray-900 w-full pb-3 flex flex-row-reverse px-4">
-                    <button
-                      type="button"
-                      className="inline-flex w-full justify-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-ring focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:ring-offset-1 sm:ml-3 sm:w-auto sm:text-sm"
-                      onClick={() => {
-                        postValidatePrompt(myValue)
-                          .then((apiReturn) => {
-                            if (apiReturn.data) {
-                              let inputVariables =
-                                apiReturn.data.input_variables;
-                              if (inputVariables.length === 0) {
-                                setErrorData({
-                                  title:
-                                    "The template you are attempting to use does not contain any variables for data entry.",
-                                });
-                              } else {
-                                setSuccessData({
-                                  title: "Prompt is ready",
-                                });
-                                setModalOpen(false);
-                                setValue(myValue);
-                              }
-                            } else {
-                              setErrorData({
-                                title: "Something went wrong, please try again",
-                              });
-                            }
-                          })
-                          .catch((error) => {
-                            return setErrorData({
-                              title:
-                                "There is something wrong with this prompt, please review it",
-                              list: [error.response.data.detail],
-                            });
-                          });
-                      }}
-                    >
-                      Check & Save
-                    </button>
-                  </div>
-                </div>
-              </Dialog.Panel>
-            </Transition.Child>
-          </div>
-        </div>
-      </Dialog>
-    </Transition.Root>
-  );
-}

From a445b079e08d1d48c43fbc876914ccc84f47608f Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Wed, 28 Jun 2023 17:59:57 -0300
Subject: [PATCH 08/51] =?UTF-8?q?=F0=9F=94=A7=20refactor(loading.py):=20si?=
 =?UTF-8?q?mplify=20instantiation=20of=20prompt=20and=20format=5Fkwargs=20?=
 =?UTF-8?q?assignment=20=F0=9F=92=A1=20chore(loading.py):=20improve=20code?=
 =?UTF-8?q?=20readability=20and=20maintainability=20by=20simplifying=20the?=
 =?UTF-8?q?=20instantiation=20of=20the=20prompt=20object=20and=20assignmen?=
 =?UTF-8?q?t=20of=20format=5Fkwargs=20dictionary.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The code has been refactored to use a dictionary comprehension to create the format_kwargs dictionary. This simplifies the logic and improves code readability. The commented out code for the prompt.partial() method has been removed as it is no longer necessary.
---
 .../langflow/interface/initialize/loading.py   | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/src/backend/langflow/interface/initialize/loading.py b/src/backend/langflow/interface/initialize/loading.py
index 1a075184e..4c24843d4 100644
--- a/src/backend/langflow/interface/initialize/loading.py
+++ b/src/backend/langflow/interface/initialize/loading.py
@@ -112,17 +112,13 @@ def instantiate_prompt(node_type, class_object, params):
 
     prompt = class_object(**params)
 
-    # Now we go through input_variables
-    # Check if they are in params, if so
-    # get their values and set them
-    format_kwargs = {}
-    for input_variable in prompt.input_variables:
-        if input_variable in params:
-            input_value = params[input_variable]
-            format_kwargs[input_variable] = input_value
-
-    if format_kwargs:
-        prompt = prompt.partial(**format_kwargs)
+    format_kwargs = {
+        input_variable: params[input_variable]
+        for input_variable in prompt.input_variables
+        if input_variable in params
+    }
+    # if format_kwargs:
+    #     prompt = prompt.partial(**format_kwargs)
 
     return prompt, format_kwargs
 

From 7b2763a1af65d538e75e2f41deb566b8a639714b Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Wed, 28 Jun 2023 18:16:59 -0300
Subject: [PATCH 09/51] =?UTF-8?q?=F0=9F=90=9B=20fix(parameterComponent):?=
 =?UTF-8?q?=20set=20isPending=20to=20true=20for=20each=20tab=20in=20the=20?=
 =?UTF-8?q?parameter=20component=20state=20to=20fix=20a=20bug=20?=
 =?UTF-8?q?=F0=9F=90=9B=20fix(chatComponent):=20remove=20console.log=20sta?=
 =?UTF-8?q?tements=20for=20'open'=20and=20'isBuilt'=20variables=20to=20cle?=
 =?UTF-8?q?an=20up=20code=20=F0=9F=90=9B=20fix(formModal):=20remove=20unne?=
 =?UTF-8?q?cessary=20console.log=20statement=20for=20'tabsState[id.current?=
 =?UTF-8?q?]'=20variable=20to=20clean=20up=20code=20=F0=9F=90=9B=20fix(Pag?=
 =?UTF-8?q?eComponent):=20set=20isPending=20to=20true=20for=20each=20tab?=
 =?UTF-8?q?=20in=20the=20Page=20component=20state=20to=20fix=20a=20bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../GenericNode/components/parameterComponent/index.tsx        | 1 +
 src/frontend/src/components/chatComponent/index.tsx            | 2 ++
 src/frontend/src/modals/formModal/index.tsx                    | 3 ---
 .../src/pages/FlowPage/components/PageComponent/index.tsx      | 2 ++
 4 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
index 6b12d8b35..56a427ca0 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
@@ -73,6 +73,7 @@ export default function ParameterComponent({
       return {
         ...prev,
         [tabId]: {
+          ...prev[tabId],
           isPending: true,
         },
       };
diff --git a/src/frontend/src/components/chatComponent/index.tsx b/src/frontend/src/components/chatComponent/index.tsx
index 60682f9ea..cd06263ca 100644
--- a/src/frontend/src/components/chatComponent/index.tsx
+++ b/src/frontend/src/components/chatComponent/index.tsx
@@ -59,6 +59,8 @@ export default function Chat({ flow }: ChatType) {
     prevNodesRef.current = currentNodes;
   }, [nodes]);
 
+  console.log("open", open);
+  console.log("isBuilt",isBuilt);
   return (
     <>
       {isBuilt ? (
diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index 4e72851f4..fccf2440d 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -373,10 +373,7 @@ export default function FormModal({
       setChatKey(index);
     }
   }
-
-  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 && (
diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
index 5cffe0395..9a871e639 100644
--- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
@@ -151,6 +151,7 @@ export default function Page({ flow }: { flow: FlowType }) {
         return {
           ...prev,
           [tabId]: {
+            ...prev[tabId],
             isPending: true,
           },
         };
@@ -166,6 +167,7 @@ export default function Page({ flow }: { flow: FlowType }) {
         return {
           ...prev,
           [tabId]: {
+            ...prev[tabId],
             isPending: true,
           },
         };

From dadaaa895d1e15016be50534f64ac40aadc056af Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Wed, 28 Jun 2023 18:17:37 -0300
Subject: [PATCH 10/51] =?UTF-8?q?=F0=9F=94=A5=20refactor(chatComponent/ind?=
 =?UTF-8?q?ex.tsx):=20remove=20unnecessary=20console.log=20statements=20fo?=
 =?UTF-8?q?r=20'open'=20and=20'isBuilt'=20variables?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/components/chatComponent/index.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/frontend/src/components/chatComponent/index.tsx b/src/frontend/src/components/chatComponent/index.tsx
index cd06263ca..60682f9ea 100644
--- a/src/frontend/src/components/chatComponent/index.tsx
+++ b/src/frontend/src/components/chatComponent/index.tsx
@@ -59,8 +59,6 @@ export default function Chat({ flow }: ChatType) {
     prevNodesRef.current = currentNodes;
   }, [nodes]);
 
-  console.log("open", open);
-  console.log("isBuilt",isBuilt);
   return (
     <>
       {isBuilt ? (

From 18b2226b1228777f6a6f75702eb30661dc3ed71d Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 11:25:48 -0300
Subject: [PATCH 11/51] Fixed bug where the node internals are not updated at
 the PromptTemplate

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

diff --git a/src/frontend/src/components/promptComponent/index.tsx b/src/frontend/src/components/promptComponent/index.tsx
index 3f0742407..5cea7008c 100644
--- a/src/frontend/src/components/promptComponent/index.tsx
+++ b/src/frontend/src/components/promptComponent/index.tsx
@@ -6,6 +6,8 @@ import { TypeModal } from "../../utils";
 import { INPUT_STYLE } from "../../constants";
 import { ExternalLink } from "lucide-react";
 import { postValidatePrompt } from "../../controllers/API";
+import { typesContext } from "../../contexts/typesContext";
+import * as _ from "lodash";
 
 export default function PromptAreaComponent({
   setNodeClass,
@@ -15,8 +17,10 @@ export default function PromptAreaComponent({
   disabled,
   editNode = false,
 }: TextAreaComponentType) {
-  const [myValue, setMyValue] = useState(value);
+  const [myValue, setMyValue] = useState("");
   const { openPopUp } = useContext(PopUpContext);
+  const { reactFlowInstance } = useContext(typesContext);
+
   useEffect(() => {
     if (disabled) {
       setMyValue("");
@@ -25,20 +29,21 @@ export default function PromptAreaComponent({
   }, [disabled, onChange]);
 
   useEffect(() => {
-    if (value) {
-      postValidatePrompt(myValue, nodeClass)
+    if (value !== "") { // only executed once
+      setMyValue(value);
+      postValidatePrompt(value, nodeClass)
         .then((apiReturn) => {
           if (apiReturn.data) {
             setNodeClass(apiReturn.data.frontend_node);
+            if(reactFlowInstance){
+              // need to update reactFlowInstance to re-render the nodes.
+              reactFlowInstance.setEdges(_.cloneDeep(reactFlowInstance.getEdges()));
+            }
           }
         })
         .catch((error) => {});
     }
-  }, [value]);
-
-  useEffect(() => {
-    setMyValue(value);
-  }, [value]);
+  }, [reactFlowInstance]);
 
   return (
     <div

From 1be3de50c5433789ec91e9f34d7501589b2eb7eb Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 11:30:00 -0300
Subject: [PATCH 12/51] Changes to only make the Prompt Check run once

---
 src/frontend/src/components/promptComponent/index.tsx | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/frontend/src/components/promptComponent/index.tsx b/src/frontend/src/components/promptComponent/index.tsx
index 5cea7008c..3999d2786 100644
--- a/src/frontend/src/components/promptComponent/index.tsx
+++ b/src/frontend/src/components/promptComponent/index.tsx
@@ -29,16 +29,14 @@ export default function PromptAreaComponent({
   }, [disabled, onChange]);
 
   useEffect(() => {
-    if (value !== "") { // only executed once
+    if (value !== "" && myValue !== value && reactFlowInstance) { // only executed once
       setMyValue(value);
       postValidatePrompt(value, nodeClass)
         .then((apiReturn) => {
           if (apiReturn.data) {
             setNodeClass(apiReturn.data.frontend_node);
-            if(reactFlowInstance){
-              // need to update reactFlowInstance to re-render the nodes.
-              reactFlowInstance.setEdges(_.cloneDeep(reactFlowInstance.getEdges()));
-            }
+            // need to update reactFlowInstance to re-render the nodes.
+            reactFlowInstance.setEdges(_.cloneDeep(reactFlowInstance.getEdges()));
           }
         })
         .catch((error) => {});

From 2876afa79a5f5db7c8e5d7de90217416fa780527 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 11:44:51 -0300
Subject: [PATCH 13/51] =?UTF-8?q?=F0=9F=90=9B=20fix(loading.py):=20fix=20f?=
 =?UTF-8?q?ormatting=20of=20input=20variables=20in=20instantiate=5Fprompt?=
 =?UTF-8?q?=20function=20The=20instantiate=5Fprompt=20function=20now=20pro?=
 =?UTF-8?q?perly=20formats=20the=20input=20variables=20before=20passing=20?=
 =?UTF-8?q?them=20to=20the=20prompt=20object.=20If=20the=20input=20variabl?=
 =?UTF-8?q?e=20is=20a=20string,=20it=20is=20passed=20as=20is.=20If=20the?=
 =?UTF-8?q?=20input=20variable=20is=20a=20list=20of=20Document=20objects,?=
 =?UTF-8?q?=20it=20is=20formatted=20to=20contain=20the=20page=5Fcontent=20?=
 =?UTF-8?q?and=20metadata=20as=20one=20string=20separated=20by=20a=20newli?=
 =?UTF-8?q?ne.=20This=20ensures=20that=20the=20prompt=20object=20receives?=
 =?UTF-8?q?=20the=20correct=20input=20format.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../langflow/interface/initialize/loading.py  | 29 +++++++++++++------
 1 file changed, 20 insertions(+), 9 deletions(-)

diff --git a/src/backend/langflow/interface/initialize/loading.py b/src/backend/langflow/interface/initialize/loading.py
index 4c24843d4..896ee1837 100644
--- a/src/backend/langflow/interface/initialize/loading.py
+++ b/src/backend/langflow/interface/initialize/loading.py
@@ -1,5 +1,5 @@
 import json
-from typing import Any, Callable, Dict, Sequence
+from typing import Any, Callable, Dict, List, Sequence
 
 from langchain.agents import ZeroShotAgent
 from langchain.agents import agent as agent_module
@@ -7,7 +7,7 @@ from langchain.agents.agent import AgentExecutor
 from langchain.agents.agent_toolkits.base import BaseToolkit
 from langchain.agents.tools import BaseTool
 from langflow.interface.initialize.vector_store import vecstore_initializer
-
+from langchain.schema import Document
 from pydantic import ValidationError
 
 from langflow.interface.custom_lists import CUSTOM_NODES
@@ -112,13 +112,24 @@ def instantiate_prompt(node_type, class_object, params):
 
     prompt = class_object(**params)
 
-    format_kwargs = {
-        input_variable: params[input_variable]
-        for input_variable in prompt.input_variables
-        if input_variable in params
-    }
-    # if format_kwargs:
-    #     prompt = prompt.partial(**format_kwargs)
+    format_kwargs = {}
+    for input_variable in prompt.input_variables:
+        if input_variable in params:
+            variable = params[input_variable]
+            if isinstance(variable, str):
+                format_kwargs[input_variable] = variable
+            # check if is a list of Document
+            elif isinstance(variable, List) and all(
+                isinstance(item, Document) for item in variable
+            ):
+                # Format document to contain page_content and metadata
+                # as one string separated by a newline
+                format_kwargs[input_variable] = "\n".join(
+                    [
+                        f"Document:{item.page_content}\nMetadata:{item.metadata}"
+                        for item in variable
+                    ]
+                )
 
     return prompt, format_kwargs
 

From e9a907babeb2dd5cd5729737fbcab0c948ed9392 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 12:55:26 -0300
Subject: [PATCH 14/51] =?UTF-8?q?=F0=9F=94=A7=20chore(utils.ts):=20add=20s?=
 =?UTF-8?q?upport=20for=20output=5Fparsers=20node=20color=20and=20icon=20?=
 =?UTF-8?q?=F0=9F=9A=80=20feat(utils.ts):=20add=20support=20for=20output?=
 =?UTF-8?q?=5Fparsers=20node=20name=20and=20icon=20The=20`nodeColors`=20ob?=
 =?UTF-8?q?ject=20now=20includes=20a=20color=20for=20the=20`output=5Fparse?=
 =?UTF-8?q?rs`=20node=20type,=20allowing=20it=20to=20be=20visually=20disti?=
 =?UTF-8?q?nguished.=20Similarly,=20the=20`nodeNames`=20object=20now=20inc?=
 =?UTF-8?q?ludes=20a=20name=20for=20the=20`output=5Fparsers`=20node=20type?=
 =?UTF-8?q?.=20Additionally,=20the=20`nodeIconsLucide`=20object=20now=20in?=
 =?UTF-8?q?cludes=20an=20icon=20for=20the=20`output=5Fparsers`=20node=20ty?=
 =?UTF-8?q?pe.=20These=20changes=20improve=20the=20consistency=20and=20com?=
 =?UTF-8?q?pleteness=20of=20the=20node=20types=20in=20the=20application.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/utils.ts | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/frontend/src/utils.ts b/src/frontend/src/utils.ts
index df8a8a61a..6ff05292f 100644
--- a/src/frontend/src/utils.ts
+++ b/src/frontend/src/utils.ts
@@ -45,6 +45,7 @@ import { twMerge } from "tailwind-merge";
 import { ADJECTIVES, DESCRIPTIONS, NOUNS } from "./constants";
 import { ComponentType, SVGProps } from "react";
 import {
+  Compass,
   Cpu,
   Fingerprint,
   Gift,
@@ -139,6 +140,7 @@ export const nodeColors: { [char: string]: string } = {
   toolkits: "#DB2C2C",
   wrappers: "#E6277A",
   utilities: "#31A3CC",
+  output_parsers: "#E6A627",
   unknown: "#9CA3AF",
 };
 
@@ -158,6 +160,7 @@ export const nodeNames: { [char: string]: string } = {
   wrappers: "Wrappers",
   textsplitters: "Text Splitters",
   utilities: "Utilities",
+  output_parsers: "Output Parsers",
   unknown: "Unknown",
 };
 
@@ -363,6 +366,9 @@ export const nodeIconsLucide: {
   utilities: Wand2 as React.ForwardRefExoticComponent<
     ComponentType<SVGProps<SVGSVGElement>>
   >,
+  output_parsers: Compass as React.ForwardRefExoticComponent<
+    ComponentType<SVGProps<SVGSVGElement>>
+  >,
   unknown: HelpCircle as React.ForwardRefExoticComponent<
     ComponentType<SVGProps<SVGSVGElement>>
   >,

From fa3bcdefee557add1b7e27b2d3fad179996233ae Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 12:55:58 -0300
Subject: [PATCH 15/51] =?UTF-8?q?=F0=9F=93=A6=20chore(output=5Fparsers):?=
 =?UTF-8?q?=20add=20output=20parsers=20module=20and=20base=20classes=20?=
 =?UTF-8?q?=F0=9F=9A=80=20feat(output=5Fparsers):=20add=20OutputParserCrea?=
 =?UTF-8?q?tor=20class=20to=20handle=20creation=20and=20loading=20of=20out?=
 =?UTF-8?q?put=20parsers=20=F0=9F=9A=80=20feat(output=5Fparsers):=20add=20?=
 =?UTF-8?q?OutputParserFrontendNode=20class=20to=20handle=20formatting=20o?=
 =?UTF-8?q?f=20output=20parser=20fields=20The=20commit=20adds=20the=20foll?=
 =?UTF-8?q?owing=20changes:=20-=20A=20new=20file=20`=5F=5Finit=5F=5F.py`?=
 =?UTF-8?q?=20is=20added=20to=20the=20`output=5Fparsers`=20module.=20-=20A?=
 =?UTF-8?q?=20new=20file=20`base.py`=20is=20added=20to=20the=20`output=5Fp?=
 =?UTF-8?q?arsers`=20module.=20-=20A=20new=20file=20`output=5Fparsers.py`?=
 =?UTF-8?q?=20is=20added=20to=20the=20`frontend=5Fnode`=20module.=20The=20?=
 =?UTF-8?q?`=5F=5Finit=5F=5F.py`=20file=20initializes=20the=20`OutputParse?=
 =?UTF-8?q?rCreator`=20class,=20which=20is=20responsible=20for=20creating?=
 =?UTF-8?q?=20and=20loading=20output=20parsers.=20It=20also=20defines=20a?=
 =?UTF-8?q?=20method=20to=20get=20the=20signature=20of=20an=20output=20par?=
 =?UTF-8?q?ser.=20The=20`base.py`=20file=20contains=20the=20base=20class?=
 =?UTF-8?q?=20`OutputParserCreator`=20which=20is=20a=20subclass=20of=20`La?=
 =?UTF-8?q?ngChainTypeCreator`.=20It=20defines=20the=20type=20name=20as=20?=
 =?UTF-8?q?"output=5Fparsers"=20and=20provides=20methods=20to=20get=20the?=
 =?UTF-8?q?=20frontend=20node=20class=20and=20the=20type=20to=20loader=20d?=
 =?UTF-8?q?ictionary.=20It=20also=20defines=20a=20method=20to=20convert=20?=
 =?UTF-8?q?the=20output=20parsers=20to=20a=20list.=20The=20`output=5Fparse?=
 =?UTF-8?q?rs.py`=20file=20contains=20the=20`OutputParserFrontendNode`=20c?=
 =?UTF-8?q?lass,=20which=20is=20a=20subclass=20of=20`FrontendNode`.=20It?=
 =?UTF-8?q?=20provides=20a=20method=20to=20format=20the=20field=20of=20an?=
 =?UTF-8?q?=20output=20parser.=20These=20changes=20are=20done=20to=20add?=
 =?UTF-8?q?=20support=20for=20output=20parsers=20in=20the=20application.?=
 =?UTF-8?q?=20The=20`OutputParserCreator`=20class=20allows=20for=20dynamic?=
 =?UTF-8?q?=20creation=20and=20loading=20of=20output=20parsers,=20while=20?=
 =?UTF-8?q?the=20`OutputParserFrontendNode`=20class=20provides=20a=20way?=
 =?UTF-8?q?=20to=20format=20the=20fields=20of=20an=20output=20parser.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../interface/output_parsers/__init__.py      |  0
 .../langflow/interface/output_parsers/base.py | 64 +++++++++++++++++++
 .../template/frontend_node/output_parsers.py  | 10 +++
 3 files changed, 74 insertions(+)
 create mode 100644 src/backend/langflow/interface/output_parsers/__init__.py
 create mode 100644 src/backend/langflow/interface/output_parsers/base.py
 create mode 100644 src/backend/langflow/template/frontend_node/output_parsers.py

diff --git a/src/backend/langflow/interface/output_parsers/__init__.py b/src/backend/langflow/interface/output_parsers/__init__.py
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/backend/langflow/interface/output_parsers/base.py b/src/backend/langflow/interface/output_parsers/base.py
new file mode 100644
index 000000000..79cbdd98c
--- /dev/null
+++ b/src/backend/langflow/interface/output_parsers/base.py
@@ -0,0 +1,64 @@
+from typing import Dict, List, Optional, Type
+
+from langchain import output_parsers
+
+from langflow.interface.base import LangChainTypeCreator
+from langflow.interface.importing.utils import import_class
+from langflow.settings import settings
+from langflow.template.frontend_node.output_parsers import OutputParserFrontendNode
+from langflow.utils.logger import logger
+from langflow.utils.util import build_template_from_class, build_template_from_method
+
+
+class OutputParserCreator(LangChainTypeCreator):
+    type_name: str = "output_parsers"
+    from_method_nodes = {
+        "StructuredOutputParser": "from_response_schemas",
+    }
+
+    @property
+    def frontend_node_class(self) -> Type[OutputParserFrontendNode]:
+        return OutputParserFrontendNode
+
+    @property
+    def type_to_loader_dict(self) -> Dict:
+        if self.type_dict is None:
+            self.type_dict = {
+                output_parser_name: import_class(
+                    f"langchain.output_parsers.{output_parser_name}"
+                )
+                # if output_parser_name is not lower case it is a class
+                for output_parser_name in output_parsers.__all__
+            }
+            self.type_dict = {
+                name: output_parser
+                for name, output_parser in self.type_dict.items()
+                if name in settings.output_parsers or settings.dev
+            }
+        return self.type_dict
+
+    def get_signature(self, name: str) -> Optional[Dict]:
+        try:
+            if name in self.from_method_nodes:
+                return build_template_from_method(
+                    name,
+                    type_to_cls_dict=self.type_to_loader_dict,
+                    method_name=self.from_method_nodes[name],
+                )
+            else:
+                return build_template_from_class(
+                    name,
+                    type_to_cls_dict=self.type_to_loader_dict,
+                )
+        except ValueError as exc:
+            # raise ValueError("OutputParser not found") from exc
+            logger.error(f"OutputParser {name} not found: {exc}")
+        except AttributeError as exc:
+            logger.error(f"OutputParser {name} not loaded: {exc}")
+        return None
+
+    def to_list(self) -> List[str]:
+        return list(self.type_to_loader_dict.keys())
+
+
+output_parser_creator = OutputParserCreator()
diff --git a/src/backend/langflow/template/frontend_node/output_parsers.py b/src/backend/langflow/template/frontend_node/output_parsers.py
new file mode 100644
index 000000000..e9b4d3706
--- /dev/null
+++ b/src/backend/langflow/template/frontend_node/output_parsers.py
@@ -0,0 +1,10 @@
+from typing import Optional
+from langflow.template.field.base import TemplateField
+from langflow.template.frontend_node.base import FrontendNode
+
+
+class OutputParserFrontendNode(FrontendNode):
+    @staticmethod
+    def format_field(field: TemplateField, name: Optional[str] = None) -> None:
+        FrontendNode.format_field(field, name)
+        field.show = True

From 5e00debae43b78b21bf8952b61f5d1511988447d Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 12:56:36 -0300
Subject: [PATCH 16/51] =?UTF-8?q?=F0=9F=94=A7=20fix(utils.py):=20add=20imp?=
 =?UTF-8?q?ort=20statement=20for=20output=5Fparsers=20module=20?=
 =?UTF-8?q?=F0=9F=94=A7=20fix(loading.py):=20add=20import=20statement=20fo?=
 =?UTF-8?q?r=20output=5Fparser=5Fcreator=20=F0=9F=94=A7=20fix(listing.py):?=
 =?UTF-8?q?=20add=20import=20statement=20for=20output=5Fparser=5Fcreator?=
 =?UTF-8?q?=20=F0=9F=94=A7=20fix(types.py):=20add=20import=20statement=20f?=
 =?UTF-8?q?or=20output=5Fparser=5Fcreator=20The=20import=20statements=20fo?=
 =?UTF-8?q?r=20the=20`output=5Fparsers`=20module=20were=20missing=20in=20t?=
 =?UTF-8?q?he=20respective=20files.=20This=20fix=20adds=20the=20necessary?=
 =?UTF-8?q?=20import=20statements=20to=20ensure=20that=20the=20`output=5Fp?=
 =?UTF-8?q?arser=5Fcreator`=20is=20accessible=20and=20can=20be=20used=20in?=
 =?UTF-8?q?=20the=20code.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/interface/importing/utils.py    |  6 ++++++
 src/backend/langflow/interface/initialize/loading.py | 12 ++++++++++++
 src/backend/langflow/interface/listing.py            |  2 ++
 src/backend/langflow/interface/types.py              |  2 ++
 4 files changed, 22 insertions(+)

diff --git a/src/backend/langflow/interface/importing/utils.py b/src/backend/langflow/interface/importing/utils.py
index f65376d48..587e02949 100644
--- a/src/backend/langflow/interface/importing/utils.py
+++ b/src/backend/langflow/interface/importing/utils.py
@@ -44,6 +44,7 @@ def import_by_type(_type: str, name: str) -> Any:
         "documentloaders": import_documentloader,
         "textsplitters": import_textsplitter,
         "utilities": import_utility,
+        "output_parsers": import_output_parser,
     }
     if _type == "llms":
         key = "chat" if "chat" in name.lower() else "llm"
@@ -54,6 +55,11 @@ def import_by_type(_type: str, name: str) -> Any:
     return loaded_func(name)
 
 
+def import_output_parser(output_parser: str) -> Any:
+    """Import output parser from output parser name"""
+    return import_module(f"from langchain.output_parsers import {output_parser}")
+
+
 def import_chat_llm(llm: str) -> BaseChatModel:
     """Import chat llm from llm name"""
     return import_class(f"langchain.chat_models.{llm}")
diff --git a/src/backend/langflow/interface/initialize/loading.py b/src/backend/langflow/interface/initialize/loading.py
index 896ee1837..34249239d 100644
--- a/src/backend/langflow/interface/initialize/loading.py
+++ b/src/backend/langflow/interface/initialize/loading.py
@@ -14,6 +14,7 @@ from langflow.interface.custom_lists import CUSTOM_NODES
 from langflow.interface.importing.utils import get_function, import_by_type
 from langflow.interface.toolkits.base import toolkits_creator
 from langflow.interface.chains.base import chain_creator
+from langflow.interface.output_parsers.base import output_parser_creator
 from langflow.interface.utils import load_file_into_dict
 from langflow.utils import validate
 
@@ -72,10 +73,21 @@ def instantiate_based_on_type(class_object, base_type, node_type, params):
         return instantiate_utility(node_type, class_object, params)
     elif base_type == "chains":
         return instantiate_chains(node_type, class_object, params)
+    elif base_type == "output_parsers":
+        return instantiate_output_parser(node_type, class_object, params)
     else:
         return class_object(**params)
 
 
+def instantiate_output_parser(node_type, class_object, params):
+    if node_type in output_parser_creator.from_method_nodes:
+        method = output_parser_creator.from_method_nodes[node_type]
+        if class_method := getattr(class_object, method, None):
+            return class_method(**params)
+        raise ValueError(f"Method {method} not found in {class_object}")
+    return class_object(**params)
+
+
 def instantiate_chains(node_type, class_object, params):
     if "retriever" in params and hasattr(params["retriever"], "as_retriever"):
         params["retriever"] = params["retriever"].as_retriever()
diff --git a/src/backend/langflow/interface/listing.py b/src/backend/langflow/interface/listing.py
index 3d73105c2..bb8e6127b 100644
--- a/src/backend/langflow/interface/listing.py
+++ b/src/backend/langflow/interface/listing.py
@@ -11,6 +11,7 @@ from langflow.interface.tools.base import tool_creator
 from langflow.interface.utilities.base import utility_creator
 from langflow.interface.vector_store.base import vectorstore_creator
 from langflow.interface.wrappers.base import wrapper_creator
+from langflow.interface.output_parsers.base import output_parser_creator
 
 
 def get_type_dict():
@@ -28,6 +29,7 @@ def get_type_dict():
         "embeddings": embedding_creator.to_list(),
         "textSplitters": textsplitter_creator.to_list(),
         "utilities": utility_creator.to_list(),
+        "outputParsers": output_parser_creator.to_list(),
     }
 
 
diff --git a/src/backend/langflow/interface/types.py b/src/backend/langflow/interface/types.py
index 085537756..8bbf8a7b4 100644
--- a/src/backend/langflow/interface/types.py
+++ b/src/backend/langflow/interface/types.py
@@ -11,6 +11,7 @@ from langflow.interface.tools.base import tool_creator
 from langflow.interface.utilities.base import utility_creator
 from langflow.interface.vector_store.base import vectorstore_creator
 from langflow.interface.wrappers.base import wrapper_creator
+from langflow.interface.output_parsers.base import output_parser_creator
 
 
 def get_type_list():
@@ -44,6 +45,7 @@ def build_langchain_types_dict():  # sourcery skip: dict-assign-update-to-union
         documentloader_creator,
         textsplitter_creator,
         utility_creator,
+        output_parser_creator,
     ]
 
     all_types = {}

From c6d8d62ffd9c0aef4c20445688155f0ee22d2379 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 12:56:50 -0300
Subject: [PATCH 17/51] =?UTF-8?q?=F0=9F=9A=A7=20chore(types.py):=20add=20O?=
 =?UTF-8?q?utputParserVertex=20class=20to=20support=20output=20parsing=20f?=
 =?UTF-8?q?unctionality=20The=20OutputParserVertex=20class=20is=20added=20?=
 =?UTF-8?q?to=20the=20types.py=20file.=20This=20class=20extends=20the=20Ve?=
 =?UTF-8?q?rtex=20class=20and=20is=20used=20to=20represent=20a=20vertex=20?=
 =?UTF-8?q?in=20the=20graph=20that=20performs=20output=20parsing.=20It=20t?=
 =?UTF-8?q?akes=20a=20data=20parameter=20of=20type=20Dict=20in=20its=20con?=
 =?UTF-8?q?structor=20and=20calls=20the=20super=20constructor=20with=20the?=
 =?UTF-8?q?=20data=20and=20a=20base=5Ftype=20of=20"output=5Fparsers".=20Th?=
 =?UTF-8?q?is=20change=20is=20made=20to=20support=20the=20implementation?=
 =?UTF-8?q?=20of=20output=20parsing=20functionality=20in=20the=20graph.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/graph/vertex/types.py | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/backend/langflow/graph/vertex/types.py b/src/backend/langflow/graph/vertex/types.py
index 775a2ebd2..af2081217 100644
--- a/src/backend/langflow/graph/vertex/types.py
+++ b/src/backend/langflow/graph/vertex/types.py
@@ -194,3 +194,8 @@ class PromptVertex(Vertex):
 
             self._build()
         return self._built_object
+
+
+class OutputParserVertex(Vertex):
+    def __init__(self, data: Dict):
+        super().__init__(data, base_type="output_parsers")

From e87a475584aa3c1d0a26cb7e5c23c937fe809344 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 12:57:04 -0300
Subject: [PATCH 18/51] =?UTF-8?q?=F0=9F=94=80=20refactor(constants.py):=20?=
 =?UTF-8?q?import=20vertex=20types=20from=20langflow.graph.vertex.types=20?=
 =?UTF-8?q?instead=20of=20individual=20imports=20The=20import=20statements?=
 =?UTF-8?q?=20for=20vertex=20types=20in=20constants.py=20have=20been=20ref?=
 =?UTF-8?q?actored=20to=20import=20all=20types=20from=20langflow.graph.ver?=
 =?UTF-8?q?tex.types.=20This=20improves=20code=20readability=20and=20maint?=
 =?UTF-8?q?ainability=20by=20reducing=20the=20number=20of=20import=20state?=
 =?UTF-8?q?ments=20and=20consolidating=20them=20into=20a=20single=20import?=
 =?UTF-8?q?.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/graph/graph/constants.py | 41 +++++++------------
 1 file changed, 15 insertions(+), 26 deletions(-)

diff --git a/src/backend/langflow/graph/graph/constants.py b/src/backend/langflow/graph/graph/constants.py
index 3398f253f..7775c50ff 100644
--- a/src/backend/langflow/graph/graph/constants.py
+++ b/src/backend/langflow/graph/graph/constants.py
@@ -1,18 +1,5 @@
 from langflow.graph.vertex.base import Vertex
-from langflow.graph.vertex.types import (
-    AgentVertex,
-    ChainVertex,
-    DocumentLoaderVertex,
-    EmbeddingVertex,
-    LLMVertex,
-    MemoryVertex,
-    PromptVertex,
-    TextSplitterVertex,
-    ToolVertex,
-    ToolkitVertex,
-    VectorStoreVertex,
-    WrapperVertex,
-)
+from langflow.graph.vertex import types
 from langflow.interface.agents.base import agent_creator
 from langflow.interface.chains.base import chain_creator
 from langflow.interface.document_loaders.base import documentloader_creator
@@ -25,22 +12,24 @@ from langflow.interface.toolkits.base import toolkits_creator
 from langflow.interface.tools.base import tool_creator
 from langflow.interface.vector_store.base import vectorstore_creator
 from langflow.interface.wrappers.base import wrapper_creator
+from langflow.interface.output_parsers.base import output_parser_creator
 
 
 from typing import Dict, Type
 
 
 VERTEX_TYPE_MAP: Dict[str, Type[Vertex]] = {
-    **{t: PromptVertex for t in prompt_creator.to_list()},
-    **{t: AgentVertex for t in agent_creator.to_list()},
-    **{t: ChainVertex for t in chain_creator.to_list()},
-    **{t: ToolVertex for t in tool_creator.to_list()},
-    **{t: ToolkitVertex for t in toolkits_creator.to_list()},
-    **{t: WrapperVertex for t in wrapper_creator.to_list()},
-    **{t: LLMVertex for t in llm_creator.to_list()},
-    **{t: MemoryVertex for t in memory_creator.to_list()},
-    **{t: EmbeddingVertex for t in embedding_creator.to_list()},
-    **{t: VectorStoreVertex for t in vectorstore_creator.to_list()},
-    **{t: DocumentLoaderVertex for t in documentloader_creator.to_list()},
-    **{t: TextSplitterVertex for t in textsplitter_creator.to_list()},
+    **{t: types.PromptVertex for t in prompt_creator.to_list()},
+    **{t: types.AgentVertex for t in agent_creator.to_list()},
+    **{t: types.ChainVertex for t in chain_creator.to_list()},
+    **{t: types.ToolVertex for t in tool_creator.to_list()},
+    **{t: types.ToolkitVertex for t in toolkits_creator.to_list()},
+    **{t: types.WrapperVertex for t in wrapper_creator.to_list()},
+    **{t: types.LLMVertex for t in llm_creator.to_list()},
+    **{t: types.MemoryVertex for t in memory_creator.to_list()},
+    **{t: types.EmbeddingVertex for t in embedding_creator.to_list()},
+    **{t: types.VectorStoreVertex for t in vectorstore_creator.to_list()},
+    **{t: types.DocumentLoaderVertex for t in documentloader_creator.to_list()},
+    **{t: types.TextSplitterVertex for t in textsplitter_creator.to_list()},
+    **{t: types.OutputParserVertex for t in output_parser_creator.to_list()},
 }

From 3167330cbc8a2c14eb42a39628a2995a78c12b15 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 12:57:16 -0300
Subject: [PATCH 19/51] =?UTF-8?q?=F0=9F=94=A7=20fix(validate.py):=20add=20?=
 =?UTF-8?q?"BaseOutputParser"=20to=20the=20list=20of=20input=5Ftypes=20in?=
 =?UTF-8?q?=20the=20template=5Ffield=20=F0=9F=94=A7=20fix(settings.py):=20?=
 =?UTF-8?q?add=20"output=5Fparsers"=20attribute=20to=20the=20Settings=20cl?=
 =?UTF-8?q?ass=20The=20"input=5Ftypes"=20list=20in=20the=20template=5Ffiel?=
 =?UTF-8?q?d=20of=20the=20post=5Fvalidate=5Fprompt=20function=20in=20valid?=
 =?UTF-8?q?ate.py=20was=20missing=20the=20"BaseOutputParser"=20type.=20Thi?=
 =?UTF-8?q?s=20fix=20adds=20it=20to=20the=20list=20to=20ensure=20proper=20?=
 =?UTF-8?q?validation.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The Settings class in settings.py was missing the "output_parsers" attribute. This fix adds the attribute to the class to ensure that the list of output parsers can be properly configured and accessed.
---
 src/backend/langflow/api/v1/validate.py | 2 +-
 src/backend/langflow/settings.py        | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/backend/langflow/api/v1/validate.py b/src/backend/langflow/api/v1/validate.py
index b5b886816..184657a63 100644
--- a/src/backend/langflow/api/v1/validate.py
+++ b/src/backend/langflow/api/v1/validate.py
@@ -42,7 +42,7 @@ def post_validate_prompt(prompt: ValidatePromptRequest):
                     field_type="str",
                     show=True,
                     advanced=False,
-                    input_types=["BaseLoader"],
+                    input_types=["BaseLoader", "BaseOutputParser"],
                 )
 
                 prompt.frontend_node.template[variable] = template_field.to_dict()
diff --git a/src/backend/langflow/settings.py b/src/backend/langflow/settings.py
index e3644e84c..8fe508210 100644
--- a/src/backend/langflow/settings.py
+++ b/src/backend/langflow/settings.py
@@ -19,6 +19,7 @@ class Settings(BaseSettings):
     toolkits: List[str] = []
     textsplitters: List[str] = []
     utilities: List[str] = []
+    output_parsers: List[str] = []
     dev: bool = False
     database_url: str = "sqlite:///./langflow.db"
     cache: str = "InMemoryCache"
@@ -48,6 +49,10 @@ class Settings(BaseSettings):
         self.toolkits = new_settings.toolkits or []
         self.textsplitters = new_settings.textsplitters or []
         self.utilities = new_settings.utilities or []
+        self.embeddings = new_settings.embeddings or []
+        self.vectorstores = new_settings.vectorstores or []
+        self.documentloaders = new_settings.documentloaders or []
+        self.output_parsers = new_settings.output_parsers or []
         self.dev = dev
 
     def update_settings(self, **kwargs):

From 84718246e1270873ccd9851cc42737132fb0ab4e Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 12:57:31 -0300
Subject: [PATCH 20/51] =?UTF-8?q?=F0=9F=94=A7=20chore(config.yaml):=20add?=
 =?UTF-8?q?=20output=5Fparsers=20section=20with=20StructuredOutputParser?=
 =?UTF-8?q?=20and=20ResponseSchema=20The=20config.yaml=20file=20now=20incl?=
 =?UTF-8?q?udes=20an=20output=5Fparsers=20section=20with=20the=20Structure?=
 =?UTF-8?q?dOutputParser=20and=20ResponseSchema=20as=20the=20specified=20p?=
 =?UTF-8?q?arsers.=20This=20change=20was=20made=20to=20enhance=20the=20fun?=
 =?UTF-8?q?ctionality=20of=20the=20backend=20by=20enabling=20the=20parsing?=
 =?UTF-8?q?=20of=20structured=20output=20and=20response=20schemas.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/config.yaml | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/backend/langflow/config.yaml b/src/backend/langflow/config.yaml
index 26fec2be3..602d45984 100644
--- a/src/backend/langflow/config.yaml
+++ b/src/backend/langflow/config.yaml
@@ -144,3 +144,6 @@ wrappers:
   # - ChatPromptTemplate
   # - SystemMessagePromptTemplate
   # - HumanMessagePromptTemplate
+output_parsers:
+  - StructuredOutputParser
+  - ResponseSchema

From c180a6c6444a91302012f480fced0deac99296d7 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 12:59:25 -0300
Subject: [PATCH 21/51] =?UTF-8?q?=F0=9F=94=80=20chore(config.yaml):=20comm?=
 =?UTF-8?q?ent=20out=20unused=20wrapper=20and=20prompt=20template=20config?=
 =?UTF-8?q?urations=20The=20configurations=20for=20the=20ChatPromptTemplat?=
 =?UTF-8?q?e,=20SystemMessagePromptTemplate,=20and=20HumanMessagePromptTem?=
 =?UTF-8?q?plate=20wrappers=20have=20been=20commented=20out=20as=20they=20?=
 =?UTF-8?q?are=20currently=20not=20being=20used.=20This=20helps=20to=20imp?=
 =?UTF-8?q?rove=20code=20readability=20and=20reduces=20unnecessary=20clutt?=
 =?UTF-8?q?er=20in=20the=20configuration=20file.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/config.yaml | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/backend/langflow/config.yaml b/src/backend/langflow/config.yaml
index 602d45984..133ce7e22 100644
--- a/src/backend/langflow/config.yaml
+++ b/src/backend/langflow/config.yaml
@@ -141,9 +141,6 @@ vectorstores:
   - MongoDBAtlasVectorSearch
 wrappers:
   - RequestsWrapper
-  # - ChatPromptTemplate
-  # - SystemMessagePromptTemplate
-  # - HumanMessagePromptTemplate
 output_parsers:
   - StructuredOutputParser
   - ResponseSchema

From 356719f115426f7e3dd3d38fd1432f7cfb28f0f9 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 19:19:06 -0300
Subject: [PATCH 22/51] Connection made successfully at the handle nodes

---
 .../GenericNode/components/parameterComponent/index.tsx     | 6 ++++--
 src/frontend/src/CustomNodes/GenericNode/index.tsx          | 6 ++++--
 src/frontend/src/types/api/index.ts                         | 1 +
 src/frontend/src/types/components/index.ts                  | 1 +
 src/frontend/src/utils.ts                                   | 5 +++--
 5 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
index 56a427ca0..ba5696aed 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
@@ -36,6 +36,7 @@ export default function ParameterComponent({
   type,
   name = "",
   required = false,
+  optionalHandle = null,
 }: ParameterComponentType) {
   const ref = useRef(null);
   const refHtml = useRef(null);
@@ -132,13 +133,14 @@ export default function ParameterComponent({
           <span className="text-red-600">{required ? " *" : ""}</span>
         </div>
         {left &&
-        (type === "str" ||
+        ((type === "str" ||
           type === "bool" ||
           type === "float" ||
           type === "code" ||
           type === "prompt" ||
           type === "file" ||
-          type === "int") ? (
+          type === "int") && !optionalHandle
+          ) ? (
           <></>
         ) : (
           <ShadTooltip
diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx
index 97c2aac88..65bf962a5 100644
--- a/src/frontend/src/CustomNodes/GenericNode/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx
@@ -204,6 +204,7 @@ export default function GenericNode({
                       data={data}
                       color={
                         nodeColors[types[data.node.template[t].type]] ??
+                        nodeColors[data.node.template[t].type] ??
                         nodeColors.unknown
                       }
                       title={
@@ -214,11 +215,12 @@ export default function GenericNode({
                           : toTitleCase(t)
                       }
                       name={t}
-                      tooltipTitle={data.node.template[t].type}
+                      tooltipTitle={data.node.template[t].input_types?.join("\n") ?? data.node.template[t].type}
                       required={data.node.template[t].required}
-                      id={data.node.template[t].type + "|" + t + "|" + data.id}
+                      id={(data.node.template[t].input_types?.join(";") ?? data.node.template[t].type) + "|" + t + "|" + data.id}
                       left={true}
                       type={data.node.template[t].type}
+                      optionalHandle={data.node.template[t].input_types}
                     />
                   ) : (
                     <></>
diff --git a/src/frontend/src/types/api/index.ts b/src/frontend/src/types/api/index.ts
index ecd79240e..d54a8165c 100644
--- a/src/frontend/src/types/api/index.ts
+++ b/src/frontend/src/types/api/index.ts
@@ -12,6 +12,7 @@ export type APIClassType = {
   description: string;
   template: APITemplateType;
   display_name: string;
+  input_types?: Array<string>;
   [key: string]: Array<string> | string | APITemplateType;
 };
 
diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts
index 090d3a49f..85f3ec1cd 100644
--- a/src/frontend/src/types/components/index.ts
+++ b/src/frontend/src/types/components/index.ts
@@ -36,6 +36,7 @@ export type ParameterComponentType = {
   name?: string;
   tooltipTitle: string;
   dataContext?: typesContextType;
+  optionalHandle?: Array<String>;
 };
 export type InputListComponentType = {
   value: string[];
diff --git a/src/frontend/src/utils.ts b/src/frontend/src/utils.ts
index 6ff05292f..797f3d93e 100644
--- a/src/frontend/src/utils.ts
+++ b/src/frontend/src/utils.ts
@@ -141,6 +141,7 @@ export const nodeColors: { [char: string]: string } = {
   wrappers: "#E6277A",
   utilities: "#31A3CC",
   output_parsers: "#E6A627",
+  str: "#049524",
   unknown: "#9CA3AF",
 };
 
@@ -631,11 +632,11 @@ export function isValidConnection(
   reactFlowInstance: ReactFlowInstance
 ) {
   if (
-    sourceHandle.split("|")[0] === targetHandle.split("|")[0] ||
+    targetHandle.split("|")[0].split(";").some((n) => n === sourceHandle.split("|")[0]) ||
     sourceHandle
       .split("|")
       .slice(2)
-      .some((t) => t === targetHandle.split("|")[0]) ||
+      .some((t) => targetHandle.split("|")[0].split(";").some((n) => n === t)) ||
     targetHandle.split("|")[0] === "str"
   ) {
     let targetNode = reactFlowInstance.getNode(target).data.node;

From d6bd8a1a1b4b62a3e21b32c7759b636db1127918 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 19:30:51 -0300
Subject: [PATCH 23/51] =?UTF-8?q?=F0=9F=94=A7=20chore(utils.py):=20add=20s?=
 =?UTF-8?q?upport=20for=20handle=5Fkeys=20in=20build=5Finput=5Fkeys=5Fresp?=
 =?UTF-8?q?onse=20function=20The=20build=5Finput=5Fkeys=5Fresponse=20funct?=
 =?UTF-8?q?ion=20now=20includes=20support=20for=20handle=5Fkeys=20in=20the?=
 =?UTF-8?q?=20response.=20This=20allows=20the=20function=20to=20populate?=
 =?UTF-8?q?=20the=20handle=5Fkeys=20field=20in=20the=20response=20with=20t?=
 =?UTF-8?q?he=20values=20from=20the=20artifacts=20dictionary,=20if=20avail?=
 =?UTF-8?q?able.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/api/utils.py | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/backend/langflow/api/utils.py b/src/backend/langflow/api/utils.py
index 2df86eb7f..aa9598814 100644
--- a/src/backend/langflow/api/utils.py
+++ b/src/backend/langflow/api/utils.py
@@ -30,6 +30,7 @@ def build_input_keys_response(langchain_object, artifacts):
     input_keys_response = {
         "input_keys": {key: "" for key in langchain_object.input_keys},
         "memory_keys": [],
+        "handle_keys": artifacts.get("handle_keys", []),
     }
 
     # Set the input keys values from artifacts

From 1743edfd1d61b5f1c9967c42d3bc8e7ed535db87 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 19:31:01 -0300
Subject: [PATCH 24/51] =?UTF-8?q?=F0=9F=90=9B=20fix(loading.py):=20handle?=
 =?UTF-8?q?=20case=20when=20"handle=5Fkeys"=20is=20not=20in=20params=20dic?=
 =?UTF-8?q?tionary=20and=20add=20input=5Fvariable=20to=20"handle=5Fkeys"?=
 =?UTF-8?q?=20list=20The=20code=20now=20checks=20if=20the=20"handle=5Fkeys?=
 =?UTF-8?q?"=20key=20is=20present=20in=20the=20params=20dictionary.=20If?=
 =?UTF-8?q?=20it=20is=20not=20present,=20it=20creates=20an=20empty=20list?=
 =?UTF-8?q?=20and=20adds=20the=20input=5Fvariable=20to=20it.=20This=20ensu?=
 =?UTF-8?q?res=20that=20the=20"handle=5Fkeys"=20list=20is=20always=20prese?=
 =?UTF-8?q?nt=20and=20the=20input=5Fvariable=20is=20correctly=20added=20to?=
 =?UTF-8?q?=20it.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/interface/initialize/loading.py | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/backend/langflow/interface/initialize/loading.py b/src/backend/langflow/interface/initialize/loading.py
index 34249239d..eed253192 100644
--- a/src/backend/langflow/interface/initialize/loading.py
+++ b/src/backend/langflow/interface/initialize/loading.py
@@ -142,6 +142,13 @@ def instantiate_prompt(node_type, class_object, params):
                         for item in variable
                     ]
                 )
+                # handle_keys will be a list but it does not exist yet
+                # so we need to create it
+                if "handle_keys" not in params:
+                    format_kwargs["handle_keys"] = []
+
+                # Add the handle_keys to the list
+                format_kwargs["handle_keys"].append(input_variable)
 
     return prompt, format_kwargs
 

From 21174c0e8b7db2d6e51160b6058924d8c838eddb Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 20:30:39 -0300
Subject: [PATCH 25/51] Fixed key problem

---
 .../GenericNode/components/parameterComponent/index.tsx         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
index ba5696aed..4154b9c99 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
@@ -86,7 +86,7 @@ export default function ParameterComponent({
 
     refHtml.current = groupedObj.map((item, i) => (
       <span
-        key={getRandomKeyByssmm()}
+        key={getRandomKeyByssmm() + item.family + i}
         className={classNames(
           i > 0 ? "items-center flex mt-3" : "items-center flex"
         )}

From ffebce974f4a97ecc3b54a50749a53fac890c601 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 20:34:31 -0300
Subject: [PATCH 26/51] =?UTF-8?q?=F0=9F=94=A8=20refactor(formModal):=20rem?=
 =?UTF-8?q?ove=20unused=20keysValue=20state=20variable=20to=20improve=20co?=
 =?UTF-8?q?de=20cleanliness=20and=20readability=20=F0=9F=94=A8=20refactor(?=
 =?UTF-8?q?formModal):=20update=20formKeysData=20type=20in=20tabsState=20t?=
 =?UTF-8?q?o=20include=20handle=5Fkeys=20array=20for=20better=20data=20str?=
 =?UTF-8?q?ucture=20consistency=20and=20completeness?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/modals/formModal/index.tsx | 15 ++++++++-------
 src/frontend/src/types/tabs/index.ts        |  2 +-
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index fccf2440d..a355b695b 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -41,7 +41,6 @@ export default function FormModal({
   flow: FlowType;
 }) {
   const [chatValue, setChatValue] = useState("");
-  const [keysValue, setKeysValue] = useState([]);
   const [chatHistory, setChatHistory] = useState<ChatMessageType[]>([]);
   const { reactFlowInstance } = useContext(typesContext);
   const { setErrorData, setNoticeData } = useContext(alertContext);
@@ -64,12 +63,6 @@ export default function FormModal({
   }, [open]);
   useEffect(() => {
     id.current = flow.id;
-
-    if (tabsState[flow.id].formKeysData) {
-      setKeysValue(
-        Array(tabsState[flow.id].formKeysData.input_keys.length).fill("")
-      );
-    }
   }, [flow.id, tabsState[flow.id], tabsState[flow.id].formKeysData]);
 
   var isStream = false;
@@ -438,6 +431,14 @@ export default function FormModal({
                     </div>
                   </AccordionItem>
                 ))}
+                {tabsState[id.current].formKeysData.handle_keys.map((i, k) => (
+                  <AccordionItem key={k} value={i}>
+                    <div className="flex flex-1 items-center justify-between py-4 font-normal transition-all group text-muted-foreground text-sm">
+                      <div className="group-hover:underline"><Badge size="md" variant="gray">{i}</Badge></div>
+                      Value coming from Handle
+                    </div>
+                  </AccordionItem>
+                ))}
               </Accordion>
             </div>
             <div className="w-full">
diff --git a/src/frontend/src/types/tabs/index.ts b/src/frontend/src/types/tabs/index.ts
index 6b4e2be4f..d0bd0f499 100644
--- a/src/frontend/src/types/tabs/index.ts
+++ b/src/frontend/src/types/tabs/index.ts
@@ -33,6 +33,6 @@ export type TabsContextType = {
 export type TabsState = {
   [key: string]: {
     isPending: boolean;
-    formKeysData: {input_keys?: Array<string>, memory_keys?: Array<string>};
+    formKeysData: {input_keys?: Object, memory_keys?: Array<string>, handle_keys?: Array<string>};
   };
 };

From e98e0b22dfb004faa6a1590251009dc90a45599b Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 20:43:22 -0300
Subject: [PATCH 27/51] =?UTF-8?q?=F0=9F=90=9B=20fix(vertex/base.py):=20add?=
 =?UTF-8?q?=20input=20types=20from=20template=5Fdicts=20to=20optional=5Fin?=
 =?UTF-8?q?puts=20=F0=9F=90=9B=20fix(interface/initialize/loading.py):=20h?=
 =?UTF-8?q?andle=20BaseOutputParser=20instances=20in=20instantiate=5Fpromp?=
 =?UTF-8?q?t=20The=20`optional=5Finputs`=20list=20in=20the=20`Vertex`=20cl?=
 =?UTF-8?q?ass=20is=20now=20extended=20with=20the=20`input=5Ftypes`=20from?=
 =?UTF-8?q?=20the=20`template=5Fdicts`=20dictionary.=20This=20ensures=20th?=
 =?UTF-8?q?at=20the=20`optional=5Finputs`=20list=20contains=20all=20the=20?=
 =?UTF-8?q?input=20types=20that=20are=20not=20required.=20In=20the=20`inst?=
 =?UTF-8?q?antiate=5Fprompt`=20function,=20if=20the=20`variable`=20is=20an?=
 =?UTF-8?q?=20instance=20of=20`BaseOutputParser`=20and=20has=20a=20`get=5F?=
 =?UTF-8?q?format=5Finstructions`=20method,=20the=20`format=5Fkwargs`=20di?=
 =?UTF-8?q?ctionary=20is=20updated=20with=20the=20result=20of=20calling=20?=
 =?UTF-8?q?`get=5Fformat=5Finstructions()`.=20This=20allows=20handling=20`?=
 =?UTF-8?q?BaseOutputParser`=20instances=20correctly=20in=20the=20`instant?=
 =?UTF-8?q?iate=5Fprompt`=20function.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/graph/vertex/base.py            | 8 ++++++++
 src/backend/langflow/interface/initialize/loading.py | 7 ++++++-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/backend/langflow/graph/vertex/base.py b/src/backend/langflow/graph/vertex/base.py
index 5e723b989..79c3270fb 100644
--- a/src/backend/langflow/graph/vertex/base.py
+++ b/src/backend/langflow/graph/vertex/base.py
@@ -46,6 +46,14 @@ class Vertex:
             for key, value in template_dicts.items()
             if not value["required"]
         ]
+        # Add the template_dicts[key]["input_types"] to the optional_inputs
+        self.optional_inputs.extend(
+            [
+                input_type
+                for value in template_dicts.values()
+                for input_type in value.get("input_types", [])
+            ]
+        )
 
         template_dict = self.data["node"]["template"]
         self.vertex_type = (
diff --git a/src/backend/langflow/interface/initialize/loading.py b/src/backend/langflow/interface/initialize/loading.py
index eed253192..6267dd400 100644
--- a/src/backend/langflow/interface/initialize/loading.py
+++ b/src/backend/langflow/interface/initialize/loading.py
@@ -7,7 +7,8 @@ from langchain.agents.agent import AgentExecutor
 from langchain.agents.agent_toolkits.base import BaseToolkit
 from langchain.agents.tools import BaseTool
 from langflow.interface.initialize.vector_store import vecstore_initializer
-from langchain.schema import Document
+
+from langchain.schema import Document, BaseOutputParser
 from pydantic import ValidationError
 
 from langflow.interface.custom_lists import CUSTOM_NODES
@@ -130,6 +131,10 @@ def instantiate_prompt(node_type, class_object, params):
             variable = params[input_variable]
             if isinstance(variable, str):
                 format_kwargs[input_variable] = variable
+            elif isinstance(variable, BaseOutputParser) and hasattr(
+                variable, "get_format_instructions"
+            ):
+                format_kwargs[input_variable] = variable.get_format_instructions()
             # check if is a list of Document
             elif isinstance(variable, List) and all(
                 isinstance(item, Document) for item in variable

From e4b03d7765728d55fcc6a87b1bcf1150fafe8a49 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 21:14:30 -0300
Subject: [PATCH 28/51] =?UTF-8?q?=F0=9F=90=9B=20fix(parameterComponent):?=
 =?UTF-8?q?=20import=20lodash=20library=20to=20use=20=5F.cloneDeep=20funct?=
 =?UTF-8?q?ion=20=F0=9F=90=9B=20fix(chatComponent):=20import=20lodash=20li?=
 =?UTF-8?q?brary=20to=20use=20=5F.cloneDeep=20function=20=E2=9C=A8=20feat(?=
 =?UTF-8?q?chatComponent):=20add=20TabsContext=20to=20access=20tabsState?=
 =?UTF-8?q?=20and=20update=20isBuilt=20state=20based=20on=20tabsState=20ch?=
 =?UTF-8?q?anges?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/parameterComponent/index.tsx       |  1 +
 .../src/components/chatComponent/index.tsx        | 15 ++++++++-------
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
index 4154b9c99..6612f722a 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
@@ -25,6 +25,7 @@ import { nodeColors } from "../../../../utils";
 import ShadTooltip from "../../../../components/ShadTooltipComponent";
 import { PopUpContext } from "../../../../contexts/popUpContext";
 import ToggleShadComponent from "../../../../components/toggleShadComponent";
+import * as _ from "lodash";
 
 export default function ParameterComponent({
   left,
diff --git a/src/frontend/src/components/chatComponent/index.tsx b/src/frontend/src/components/chatComponent/index.tsx
index 60682f9ea..8cdc3a981 100644
--- a/src/frontend/src/components/chatComponent/index.tsx
+++ b/src/frontend/src/components/chatComponent/index.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState } from "react";
+import { useContext, useEffect, useRef, useState } from "react";
 import { useNodes } from "reactflow";
 import { ChatType } from "../../types/chat";
 import ChatTrigger from "./chatTrigger";
@@ -7,10 +7,13 @@ import BuildTrigger from "./buildTrigger";
 import { getBuildStatus } from "../../controllers/API";
 import { NodeType } from "../../types/flow";
 import FormModal from "../../modals/formModal";
+import { TabsContext } from "../../contexts/tabsContext";
+import * as _ from "lodash";
 
 export default function Chat({ flow }: ChatType) {
   const [open, setOpen] = useState(false);
   const [isBuilt, setIsBuilt] = useState(false);
+  const {tabsState} = useContext(TabsContext);
 
   useEffect(() => {
     const handleKeyDown = (event: KeyboardEvent) => {
@@ -43,21 +46,19 @@ export default function Chat({ flow }: ChatType) {
   const prevNodesRef = useRef<any[] | undefined>();
   const nodes = useNodes();
   useEffect(() => {
-    
     const prevNodes = prevNodesRef.current;
     const currentNodes = nodes.map(
-      (node: NodeType) => node.data.node.template
+      (node: NodeType) => _.cloneDeep(node.data.node.template)
       );
-
     if (
-      prevNodes &&
-      JSON.stringify(prevNodes) !== JSON.stringify(currentNodes)
+      tabsState && tabsState[flow.id] && tabsState[flow.id].isPending
+      && JSON.stringify(prevNodes) !== JSON.stringify(currentNodes)
     ) {
       setIsBuilt(false);
     }
 
     prevNodesRef.current = currentNodes;
-  }, [nodes]);
+  }, [tabsState]);
 
   return (
     <>

From 2c4803d28a28ea28795d37ce3314bcbd57384889 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 21:29:34 -0300
Subject: [PATCH 29/51] =?UTF-8?q?=F0=9F=94=A8=20refactor(formModal/index.t?=
 =?UTF-8?q?sx):=20remove=20unused=20code=20related=20to=20handle=5Fkeys=20?=
 =?UTF-8?q?in=20the=20form=20modal=20=F0=9F=94=A8=20refactor(formModal/ind?=
 =?UTF-8?q?ex.tsx):=20remove=20unused=20code=20related=20to=20handle=5Fkey?=
 =?UTF-8?q?s=20in=20the=20form=20modal=20to=20improve=20code=20readability?=
 =?UTF-8?q?=20and=20maintainability?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/modals/formModal/index.tsx | 10 +---------
 1 file changed, 1 insertion(+), 9 deletions(-)

diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index a355b695b..9ee8cbca9 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -426,19 +426,11 @@ export default function FormModal({
                 {tabsState[id.current].formKeysData.memory_keys.map((i, k) => (
                   <AccordionItem key={k} value={i}>
                     <div className="flex flex-1 items-center justify-between py-4 font-normal transition-all group text-muted-foreground text-sm">
-                      <div className="group-hover:underline"><Badge size="md" variant="gray">{i}</Badge></div>
+                      <div className="group-hover:underline"><Badge size="md" variant="gray">{i}</Badge>{tabsState[id.current].formKeysData.handle_keys.some((t) => t === i) && <Badge size="sm" variant="secondary">Handle</Badge>}</div>
                       Used as Memory Key
                     </div>
                   </AccordionItem>
                 ))}
-                {tabsState[id.current].formKeysData.handle_keys.map((i, k) => (
-                  <AccordionItem key={k} value={i}>
-                    <div className="flex flex-1 items-center justify-between py-4 font-normal transition-all group text-muted-foreground text-sm">
-                      <div className="group-hover:underline"><Badge size="md" variant="gray">{i}</Badge></div>
-                      Value coming from Handle
-                    </div>
-                  </AccordionItem>
-                ))}
               </Accordion>
             </div>
             <div className="w-full">

From 966444a88b62ec038f0894956c49fc961e58294c Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 21:33:05 -0300
Subject: [PATCH 30/51] =?UTF-8?q?=F0=9F=90=9B=20fix(formModal/index.tsx):?=
 =?UTF-8?q?=20remove=20unnecessary=20handle=20badge=20from=20AccordionTrig?=
 =?UTF-8?q?ger=20and=20AccordionItem=20components?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/modals/formModal/index.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index 9ee8cbca9..a1c7e416b 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -393,13 +393,13 @@ export default function FormModal({
               <Accordion type="single" collapsible className="w-full">
                 {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>
+                    <AccordionTrigger className="flex gap-2"><Badge variant="gray" size="md">{i}</Badge>{tabsState[id.current].formKeysData.handle_keys.some((t) => t === i) && <Badge size="md" variant="secondary">Handle</Badge>}</AccordionTrigger>
                     <AccordionContent>
                       <div className="p-1 flex flex-col gap-2">
                         <div className="flex items-center space-x-2">
                           <Label htmlFor="airplane-mode" className="-mt-1">From Chat</Label>
                           <ToggleShadComponent
-                            enabled={chatKey === k}
+                            enabled={chatKey === k || tabsState[id.current].formKeysData.handle_keys.some((t) => t === i) }
                             setEnabled={(value) =>
                               handleOnCheckedChange(value, k)
                             }
@@ -426,7 +426,7 @@ export default function FormModal({
                 {tabsState[id.current].formKeysData.memory_keys.map((i, k) => (
                   <AccordionItem key={k} value={i}>
                     <div className="flex flex-1 items-center justify-between py-4 font-normal transition-all group text-muted-foreground text-sm">
-                      <div className="group-hover:underline"><Badge size="md" variant="gray">{i}</Badge>{tabsState[id.current].formKeysData.handle_keys.some((t) => t === i) && <Badge size="sm" variant="secondary">Handle</Badge>}</div>
+                      <div className="group-hover:underline"><Badge size="md" variant="gray">{i}</Badge></div>
                       Used as Memory Key
                     </div>
                   </AccordionItem>

From cfcdb67ed9f4b2d250a99ab5092a4820b51bcd4f Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 22:05:22 -0300
Subject: [PATCH 31/51] =?UTF-8?q?=F0=9F=9A=80=20feat(base.py):=20add=20def?=
 =?UTF-8?q?ault=20values=20for=20string=20and=20prompt=20type=20parameters?=
 =?UTF-8?q?=20in=20=5Fbuild=5Fparams=20method=20The=20unused=20imports=20h?=
 =?UTF-8?q?ave=20been=20removed=20to=20improve=20code=20cleanliness.=20The?=
 =?UTF-8?q?=20code=20in=20the=20=5Fbuild=5Fparams=20method=20has=20been=20?=
 =?UTF-8?q?simplified=20by=20removing=20unnecessary=20conditions=20and=20l?=
 =?UTF-8?q?oops.=20Default=20values=20are=20now=20added=20for=20string=20a?=
 =?UTF-8?q?nd=20prompt=20type=20parameters=20to=20ensure=20that=20they=20h?=
 =?UTF-8?q?ave=20a=20value=20even=20if=20not=20explicitly=20set.=20?=
 =?UTF-8?q?=F0=9F=94=A7=20fix(base.py):=20remove=20unused=20imports=20and?=
 =?UTF-8?q?=20simplify=20code=20in=20=5Fbuild=5Fparams=20method?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/graph/vertex/base.py | 58 ++++++-----------------
 1 file changed, 15 insertions(+), 43 deletions(-)

diff --git a/src/backend/langflow/graph/vertex/base.py b/src/backend/langflow/graph/vertex/base.py
index 79c3270fb..a7fcf88b5 100644
--- a/src/backend/langflow/graph/vertex/base.py
+++ b/src/backend/langflow/graph/vertex/base.py
@@ -1,14 +1,11 @@
-from langflow.utils.constants import DIRECT_TYPES
 from langflow.interface.initialize import loading
 from langflow.interface.listing import ALL_TYPES_DICT
 from langflow.utils.logger import logger
 from langflow.utils.util import sync_to_async
 
 
-import contextlib
 import inspect
 import types
-import warnings
 from typing import Any, Dict, List, Optional
 from typing import TYPE_CHECKING
 
@@ -69,6 +66,7 @@ class Vertex:
                     break
 
     def _build_params(self):
+        # sourcery skip: merge-list-append, remove-redundant-if
         # Some params are required, some are optional
         # but most importantly, some params are python base classes
         # like str and others are LangChain objects like LLMChain, BasePromptTemplate
@@ -89,8 +87,19 @@ class Vertex:
             if isinstance(value, dict)
         }
         params = {}
+
+        for edge in self.edges:
+            param_key = edge.target_param
+            if param_key in template_dict:
+                if template_dict[param_key]["list"]:
+                    if param_key not in params:
+                        params[param_key] = []
+                    params[param_key].append(edge.source)
+                else:
+                    params[param_key] = edge.source
+
         for key, value in template_dict.items():
-            if key == "_type":
+            if key == "_type" or not value.get("show"):
                 continue
             # If the type is not transformable to a python base class
             # then we need to get the edge that connects to this node
@@ -101,45 +110,8 @@ class Vertex:
                 file_path = value.get("file_path")
 
                 params[key] = file_path
-
-            elif value.get("type") not in DIRECT_TYPES:
-                # Get the edge that connects to this node
-                edges = [
-                    edge
-                    for edge in self.edges
-                    if edge.target == self and edge.matched_type in value["type"]
-                ]
-
-                # Get the output of the node that the edge connects to
-                # if the value['list'] is True, then there will be more
-                # than one time setting to params[key]
-                # so we need to append to a list if it exists
-                # or create a new list if it doesn't
-
-                if value["required"] and not edges:
-                    # If a required parameter is not found, raise an error
-                    raise ValueError(
-                        f"Required input {key} for module {self.vertex_type} not found"
-                    )
-                elif value["list"]:
-                    # If this is a list parameter, append all sources to a list
-                    params[key] = [edge.source for edge in edges]
-                elif edges:
-                    # If a single parameter is found, use its source
-                    params[key] = edges[0].source
-
-            elif value["required"] or value.get("value"):
-                # If value does not have value this still passes
-                # but then gives a keyError
-                # so we need to check if value has value
-                new_value = value.get("value")
-                if new_value is None:
-                    warnings.warn(f"Value for {key} in {self.vertex_type} is None. ")
-                if value.get("type") == "int":
-                    with contextlib.suppress(TypeError, ValueError):
-                        new_value = int(new_value)  # type: ignore
-                params[key] = new_value
-
+            elif value.get("type") in ["str", "prompt"] and params.get(key) is None:
+                params[key] = value.get("value")
         # Add _type to params
         self.params = params
 

From 766ef28a0c1d278f554f41e06c65810f0371d996 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 22:06:57 -0300
Subject: [PATCH 32/51] =?UTF-8?q?=F0=9F=94=A7=20refactor(base.py):=20add?=
 =?UTF-8?q?=20source=5Fhandle,=20target=5Fhandle,=20and=20target=5Fparam?=
 =?UTF-8?q?=20attributes=20to=20Edge=20class=20The=20Edge=20class=20constr?=
 =?UTF-8?q?uctor=20now=20takes=20an=20additional=20parameter=20'edge'=20wh?=
 =?UTF-8?q?ich=20is=20a=20dictionary=20containing=20additional=20informati?=
 =?UTF-8?q?on=20about=20the=20edge.=20This=20information=20is=20used=20to?=
 =?UTF-8?q?=20set=20the=20source=5Fhandle,=20target=5Fhandle,=20and=20targ?=
 =?UTF-8?q?et=5Fparam=20attributes=20of=20the=20Edge=20class.=20This=20cha?=
 =?UTF-8?q?nge=20allows=20for=20more=20flexibility=20and=20extensibility?=
 =?UTF-8?q?=20when=20working=20with=20edges=20in=20the=20graph.=20?=
 =?UTF-8?q?=F0=9F=94=A7=20refactor(base.py):=20add=20edge=20parameter=20to?=
 =?UTF-8?q?=20Edge=20class=20constructor=20to=20pass=20additional=20edge?=
 =?UTF-8?q?=20information?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/graph/edge/base.py  | 8 +++++++-
 src/backend/langflow/graph/graph/base.py | 2 +-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/backend/langflow/graph/edge/base.py b/src/backend/langflow/graph/edge/base.py
index 08f084a5c..341c3c78f 100644
--- a/src/backend/langflow/graph/edge/base.py
+++ b/src/backend/langflow/graph/edge/base.py
@@ -6,9 +6,15 @@ if TYPE_CHECKING:
 
 
 class Edge:
-    def __init__(self, source: "Vertex", target: "Vertex"):
+    def __init__(self, source: "Vertex", target: "Vertex", edge: dict):
         self.source: "Vertex" = source
         self.target: "Vertex" = target
+        self.source_handle = edge.get("sourceHandle", "")
+        self.target_handle = edge.get("targetHandle", "")
+        # 'BaseLoader;BaseOutputParser|documents|PromptTemplate-zmTlD'
+        # target_param is documents
+        self.target_param = self.target_handle.split("|")[1]
+
         self.validate_edge()
 
     def validate_edge(self) -> None:
diff --git a/src/backend/langflow/graph/graph/base.py b/src/backend/langflow/graph/graph/base.py
index 46425ddf6..65fff3239 100644
--- a/src/backend/langflow/graph/graph/base.py
+++ b/src/backend/langflow/graph/graph/base.py
@@ -179,7 +179,7 @@ class Graph:
                 raise ValueError(f"Source node {edge['source']} not found")
             if target is None:
                 raise ValueError(f"Target node {edge['target']} not found")
-            edges.append(Edge(source, target))
+            edges.append(Edge(source, target, edge))
         return edges
 
     def _get_vertex_class(self, node_type: str, node_lc_type: str) -> Type[Vertex]:

From 9a69a71ea1ff9561743afc3c3e57e1e39eb0d946 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 22:07:23 -0300
Subject: [PATCH 33/51] =?UTF-8?q?=F0=9F=90=9B=20fix(chat.py):=20add=20exce?=
 =?UTF-8?q?ption=20logging=20to=20stream=5Fbuild=20function=20to=20improve?=
 =?UTF-8?q?=20error=20handling=20The=20`stream=5Fbuild`=20function=20now?=
 =?UTF-8?q?=20logs=20the=20exception=20that=20occurred=20during=20the=20fl?=
 =?UTF-8?q?ow=20building=20process=20using=20the=20`logger.exception`=20me?=
 =?UTF-8?q?thod.=20This=20improves=20error=20handling=20and=20provides=20m?=
 =?UTF-8?q?ore=20detailed=20information=20about=20the=20error=20in=20the?=
 =?UTF-8?q?=20logs.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/api/v1/chat.py | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/backend/langflow/api/v1/chat.py b/src/backend/langflow/api/v1/chat.py
index cdffcdf4f..b394afc99 100644
--- a/src/backend/langflow/api/v1/chat.py
+++ b/src/backend/langflow/api/v1/chat.py
@@ -139,6 +139,7 @@ async def stream_build(flow_id: str):
             # We need to reset the chat history
             chat_manager.chat_history.empty_history(flow_id)
         except Exception as exc:
+            logger.exception(exc)
             logger.error("Error while building the flow: %s", exc)
             yield str(StreamData(event="error", data={"error": str(exc)}))
         finally:

From 8229bf4b4e9a216c3be58a4c30c119f734d5fffe Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 22:32:56 -0300
Subject: [PATCH 34/51] =?UTF-8?q?=F0=9F=90=9B=20fix(chatInput):=20adjust?=
 =?UTF-8?q?=20padding-right=20value=20to=20align=20input=20field=20properl?=
 =?UTF-8?q?y=20=F0=9F=90=9B=20fix(chatMessage):=20set=20max-width=20to=20p?=
 =?UTF-8?q?revent=20overflow=20of=20markdown=20content=20=F0=9F=90=9B=20fi?=
 =?UTF-8?q?x(formModal):=20remove=20unnecessary=20badge=20for=20handle=20k?=
 =?UTF-8?q?eys=20in=20accordion=20item?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/modals/formModal/chatInput/index.tsx   | 4 ++--
 src/frontend/src/modals/formModal/chatMessage/index.tsx | 2 +-
 src/frontend/src/modals/formModal/index.tsx             | 8 +++++---
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/frontend/src/modals/formModal/chatInput/index.tsx b/src/frontend/src/modals/formModal/chatInput/index.tsx
index 50d42dd3f..3bcdec887 100644
--- a/src/frontend/src/modals/formModal/chatInput/index.tsx
+++ b/src/frontend/src/modals/formModal/chatInput/index.tsx
@@ -53,7 +53,7 @@ export default function ChatInput({
           lockChat
             ? " bg-input text-black dark:bg-gray-700 dark:text-gray-300"
             : "  bg-white-200 text-black dark:bg-gray-900 dark:text-gray-300",
-          "p-4 form-input block w-full custom-scroll rounded-md border-gray-300 dark:border-gray-600 pr-12 sm:text-sm" +
+          "p-4 form-input block w-full custom-scroll rounded-md border-gray-300 dark:border-gray-600 pr-16 sm:text-sm" +
             INPUT_STYLE
         )}
         placeholder={"Send a message..."}
@@ -62,7 +62,7 @@ export default function ChatInput({
         <button className={classNames("p-2 px-1 transition-all duration-300 rounded-md",chatValue == "" ? "text-primary" : " bg-indigo-600 text-background")} disabled={lockChat} onClick={() => sendMessage()}>
           {lockChat ? (
             <Lock
-              className="h-5 w-5 ml-1 mr-11 animate-pulse"
+              className="h-5 w-5 ml-1 mr-1 animate-pulse"
               aria-hidden="true"
             />
           ) : (
diff --git a/src/frontend/src/modals/formModal/chatMessage/index.tsx b/src/frontend/src/modals/formModal/chatMessage/index.tsx
index 3b7bdf650..765f35fac 100644
--- a/src/frontend/src/modals/formModal/chatMessage/index.tsx
+++ b/src/frontend/src/modals/formModal/chatMessage/index.tsx
@@ -92,7 +92,7 @@ export default function ChatMessage({
                     <ReactMarkdown
                       remarkPlugins={[remarkGfm, remarkMath]}
                       rehypePlugins={[rehypeMathjax]}
-                      className="markdown prose dark:prose-invert text-primary"
+                      className="markdown prose dark:prose-invert text-primary max-w-full"
                       components={{
                         code({ node, inline, className, children, ...props }) {
                           if (children.length) {
diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index a1c7e416b..ca8133708 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -382,8 +382,8 @@ export default function FormModal({
             <DialogDescription>{CHAT_FORM_DIALOG_SUBTITLE}</DialogDescription>
           </DialogHeader>
 
-          <div className="flex h-[80vh] w-full mt-2">
-            <div className="w-1/4 h-full flex flex-col justify-start mr-6">
+          <div className="flex h-[80vh] w-full mt-2 ">
+            <div className="w-1/4 h-full overflow-auto scrollbar-hide flex flex-col justify-start mr-6">
               <div className="flex py-2">
                 <Variable className="w-6 h-6 pe-1 text-gray-700 stroke-2 dark:text-slate-200"></Variable>
                 <span className="text-md font-semibold text-gray-800 dark:text-white">
@@ -393,9 +393,10 @@ export default function FormModal({
               <Accordion type="single" collapsible className="w-full">
                 {Object.keys(tabsState[id.current].formKeysData.input_keys).map((i, k) => (
                   <AccordionItem key={k} value={i}>
-                    <AccordionTrigger className="flex gap-2"><Badge variant="gray" size="md">{i}</Badge>{tabsState[id.current].formKeysData.handle_keys.some((t) => t === i) && <Badge size="md" variant="secondary">Handle</Badge>}</AccordionTrigger>
+                    <AccordionTrigger className="flex gap-2"><Badge variant="gray" size="md">{i}</Badge></AccordionTrigger>
                     <AccordionContent>
                       <div className="p-1 flex flex-col gap-2">
+                      {tabsState[id.current].formKeysData.handle_keys.some((t) => t === i) ? <div className="font-normal text-muted-foreground ">Handle</div> :
                         <div className="flex items-center space-x-2">
                           <Label htmlFor="airplane-mode" className="-mt-1">From Chat</Label>
                           <ToggleShadComponent
@@ -407,6 +408,7 @@ export default function FormModal({
                             disabled={false}
                           />
                         </div>
+                      }
                         <Textarea
                           value={tabsState[id.current].formKeysData.input_keys[i]}
                           onChange={(e) =>

From e43cbdacb7aea3d21784b042209879c6d35a828f Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 22:48:20 -0300
Subject: [PATCH 35/51] feat (process.py): The
 `build_sorted_vertices_with_caching` function is added to build the sorted
 vertices of the langchain object with caching. It also uses the
 `memoize_dict` decorator to cache the result. The function first builds the
 langchain object from the data graph, then iterates over the sorted vertices
 and updates the artifacts dictionary. This ensures that the artifacts are
 properly updated during the building process.

Both caching mechanisms improve the performance of building the langchain object and sorted vertices, reducing redundant computations and improving overall efficiency.

The `build_langchain_object_with_caching` function now uses the `memoize_dict` decorator to cache the result of building the langchain object from the data graph. This improves performance by avoiding redundant computations when the same data graph is used multiple times.
---
 src/backend/langflow/interface/run.py | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/src/backend/langflow/interface/run.py b/src/backend/langflow/interface/run.py
index a3efe2b0c..3ce5da615 100644
--- a/src/backend/langflow/interface/run.py
+++ b/src/backend/langflow/interface/run.py
@@ -14,6 +14,23 @@ def build_langchain_object_with_caching(data_graph):
     return graph.build()
 
 
+@memoize_dict(maxsize=10)
+def build_sorted_vertices_with_caching(data_graph):
+    """
+    Build langchain object from data_graph.
+    """
+
+    logger.debug("Building langchain object")
+    graph = Graph.from_payload(data_graph)
+    sorted_vertices = graph.topological_sort()
+    artifacts = {}
+    for vertex in sorted_vertices:
+        vertex.build()
+        if vertex.artifacts:
+            artifacts.update(vertex.artifacts)
+    return graph.build(), artifacts
+
+
 def build_langchain_object(data_graph):
     """
     Build langchain object from data_graph.

From af84dd2c68b4548c0b9e4860d3fdc9a4c0d0196f Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Thu, 29 Jun 2023 22:49:32 -0300
Subject: [PATCH 36/51] =?UTF-8?q?=F0=9F=94=80=20refactor(process.py):=20re?=
 =?UTF-8?q?name=20build=5Flangchain=5Fobject=5Fwith=5Fcaching=20to=20build?=
 =?UTF-8?q?=5Fsorted=5Fvertices=5Fwith=5Fcaching=20for=20better=20clarity?=
 =?UTF-8?q?=20=F0=9F=90=9B=20fix(process.py):=20handle=20missing=20inputs?=
 =?UTF-8?q?=20in=20process=5Fgraph=5Fcached=20function=20The=20function=20?=
 =?UTF-8?q?`build=5Flangchain=5Fobject=5Fwith=5Fcaching`=20has=20been=20re?=
 =?UTF-8?q?named=20to=20`build=5Fsorted=5Fvertices=5Fwith=5Fcaching`=20to?=
 =?UTF-8?q?=20provide=20a=20more=20descriptive=20name=20that=20accurately?=
 =?UTF-8?q?=20reflects=20its=20purpose.=20Additionally,=20the=20`process?=
 =?UTF-8?q?=5Fgraph=5Fcached`=20function=20now=20handles=20cases=20where?=
 =?UTF-8?q?=20the=20`inputs`=20parameter=20is=20missing=20or=20empty=20by?=
 =?UTF-8?q?=20populating=20it=20with=20values=20from=20the=20`artifacts`?=
 =?UTF-8?q?=20dictionary.=20This=20ensures=20that=20all=20required=20input?=
 =?UTF-8?q?s=20are=20properly=20set=20before=20running=20the=20graph.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/processing/process.py | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/backend/langflow/processing/process.py b/src/backend/langflow/processing/process.py
index abf7a00b8..3ccb3a8b1 100644
--- a/src/backend/langflow/processing/process.py
+++ b/src/backend/langflow/processing/process.py
@@ -2,7 +2,7 @@ from pathlib import Path
 from langchain.schema import AgentAction
 import json
 from langflow.interface.run import (
-    build_langchain_object_with_caching,
+    build_sorted_vertices_with_caching,
     get_memory_key,
     update_memory_keys,
 )
@@ -88,8 +88,16 @@ def process_graph_cached(data_graph: Dict[str, Any], inputs: Optional[dict] = No
     with PromptTemplate,then run the graph and return the result and thought.
     """
     # Load langchain object
-    langchain_object = build_langchain_object_with_caching(data_graph)
+    langchain_object, artifacts = build_sorted_vertices_with_caching(data_graph)
     logger.debug("Loaded LangChain object")
+    if inputs is None:
+        inputs = {}
+    for (
+        key,
+        value,
+    ) in artifacts.items():
+        if key not in inputs or not inputs[key]:
+            inputs[key] = value
 
     if langchain_object is None:
         # Raise user facing error

From 48750982093b0e31f39b257b9c0c2c6c3cf86683 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 23:13:29 -0300
Subject: [PATCH 37/51] =?UTF-8?q?=F0=9F=90=9B=20fix(formModal/index.tsx):?=
 =?UTF-8?q?=20fix=20initial=20value=20of=20chatValue=20to=20correctly=20re?=
 =?UTF-8?q?trieve=20value=20from=20tabsState=20=F0=9F=90=9B=20fix(formModa?=
 =?UTF-8?q?l/index.tsx):=20fix=20initial=20value=20of=20chatKey=20to=20cor?=
 =?UTF-8?q?rectly=20retrieve=20key=20from=20tabsState=20=F0=9F=90=9B=20fix?=
 =?UTF-8?q?(formModal/index.tsx):=20fix=20handleOnCheckedChange=20to=20cor?=
 =?UTF-8?q?rectly=20set=20chatKey=20and=20chatValue=20=F0=9F=90=9B=20fix(f?=
 =?UTF-8?q?ormModal/index.tsx):=20fix=20onChange=20of=20Textarea=20to=20co?=
 =?UTF-8?q?rrectly=20update=20tabsState=20input=5Fkeys=20=E2=9C=A8=20feat(?=
 =?UTF-8?q?formModal/index.tsx):=20add=20support=20for=20clearing=20input?=
 =?UTF-8?q?=20value=20when=20form=20is=20submitted=20=E2=9C=A8=20feat(form?=
 =?UTF-8?q?Modal/index.tsx):=20add=20support=20for=20clearing=20input=20va?=
 =?UTF-8?q?lue=20when=20form=20is=20closed?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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

diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index ca8133708..0992c4c50 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -40,17 +40,17 @@ export default function FormModal({
   setOpen: Function;
   flow: FlowType;
 }) {
-  const [chatValue, setChatValue] = useState("");
+  const { tabsState, setTabsState } = useContext(TabsContext);
+  const [chatValue, setChatValue] = useState(tabsState[flow.id].formKeysData.input_keys[Object.keys(tabsState[flow.id].formKeysData.input_keys).find((k) => !tabsState[flow.id].formKeysData.handle_keys.some((j) => j === k))]);
   const [chatHistory, setChatHistory] = useState<ChatMessageType[]>([]);
   const { reactFlowInstance } = useContext(typesContext);
   const { setErrorData, setNoticeData } = useContext(alertContext);
-  const { tabsState, setTabsState } = useContext(TabsContext);
   const ws = useRef<WebSocket | null>(null);
   const [lockChat, setLockChat] = useState(false);
   const isOpen = useRef(open);
   const messagesRef = useRef(null);
   const id = useRef(flow.id);
-  const [chatKey, setChatKey] = useState(0);
+  const [chatKey, setChatKey] = useState(Object.keys(tabsState[flow.id].formKeysData.input_keys).find((k) => !tabsState[flow.id].formKeysData.handle_keys.some((j) => j === k)));
 
   useEffect(() => {
     if (messagesRef.current) {
@@ -319,15 +319,7 @@ export default function FormModal({
       let nodeValidationErrors = validateNodes(reactFlowInstance);
       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 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);
@@ -338,6 +330,11 @@ export default function FormModal({
           name: flow.name,
           description: flow.description,
         });
+        setTabsState((old) => {
+          let newTabsState = _.cloneDeep(old);
+          newTabsState[id.current].formKeysData.input_keys[chatKey] = "";
+          return newTabsState;
+        });
       } else {
         setErrorData({
           title: "Oops! Looks like you missed some required information:",
@@ -361,9 +358,10 @@ export default function FormModal({
     setOpen(x);
   }
 
-  function handleOnCheckedChange(checked: boolean, index: number) {
+  function handleOnCheckedChange(checked: boolean, i: string) {
     if (checked === true) {
-      setChatKey(index);
+      setChatKey(i);
+      setChatValue(tabsState[flow.id].formKeysData.input_keys[i]);
     }
   }
   return (
@@ -383,7 +381,7 @@ export default function FormModal({
           </DialogHeader>
 
           <div className="flex h-[80vh] w-full mt-2 ">
-            <div className="w-1/4 h-full overflow-auto scrollbar-hide flex flex-col justify-start mr-6">
+            <div className="w-2/5 h-full overflow-auto scrollbar-hide flex flex-col justify-start mr-6">
               <div className="flex py-2">
                 <Variable className="w-6 h-6 pe-1 text-gray-700 stroke-2 dark:text-slate-200"></Variable>
                 <span className="text-md font-semibold text-gray-800 dark:text-white">
@@ -400,9 +398,9 @@ export default function FormModal({
                         <div className="flex items-center space-x-2">
                           <Label htmlFor="airplane-mode" className="-mt-1">From Chat</Label>
                           <ToggleShadComponent
-                            enabled={chatKey === k || tabsState[id.current].formKeysData.handle_keys.some((t) => t === i) }
+                            enabled={chatKey === i}
                             setEnabled={(value) =>
-                              handleOnCheckedChange(value, k)
+                              handleOnCheckedChange(value, i)
                             }
                             size="small"
                             disabled={false}
@@ -411,14 +409,16 @@ export default function FormModal({
                       }
                         <Textarea
                           value={tabsState[id.current].formKeysData.input_keys[i]}
-                          onChange={(e) =>
-                            setTabsState((old) => {
-                              let newTabsState = _.cloneDeep(old);
-                              newTabsState[id.current].formKeysData.input_keys[i] = e.target.value;
-                              return newTabsState;
-                            })
+                          onChange={(e) => {
+                            if(!tabsState[id.current].formKeysData.handle_keys.some((t) => t === i))
+                              setTabsState((old) => {
+                                let newTabsState = _.cloneDeep(old);
+                                newTabsState[id.current].formKeysData.input_keys[i] = e.target.value;
+                                return newTabsState;
+                              })
+                            }
                           }
-                          disabled={chatKey === k}
+                          disabled={chatKey === i}
                           placeholder="Enter text..."
                         ></Textarea>
                       </div>
@@ -486,7 +486,11 @@ export default function FormModal({
                       chatValue={chatValue}
                       lockChat={lockChat}
                       sendMessage={sendMessage}
-                      setChatValue={setChatValue}
+                      setChatValue={(value) => {setChatValue(value); setTabsState((old) => {
+                        let newTabsState = _.cloneDeep(old);
+                        newTabsState[id.current].formKeysData.input_keys[chatKey] = chatValue;
+                        return newTabsState;
+                      });}}
                       inputRef={ref}
                     />
                   </div>

From 9acff51555262c54755015bca810f216c66a8113 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Thu, 29 Jun 2023 23:19:44 -0300
Subject: [PATCH 38/51] =?UTF-8?q?=F0=9F=94=A7=20chore(codeBlock/index.tsx)?=
 =?UTF-8?q?:=20adjust=20className=20to=20use=20relative=20width=20instead?=
 =?UTF-8?q?=20of=20fixed=20width=20to=20improve=20responsiveness?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/modals/formModal/chatMessage/codeBlock/index.tsx        | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/frontend/src/modals/formModal/chatMessage/codeBlock/index.tsx b/src/frontend/src/modals/formModal/chatMessage/codeBlock/index.tsx
index 851f5118a..dcb478ae1 100644
--- a/src/frontend/src/modals/formModal/chatMessage/codeBlock/index.tsx
+++ b/src/frontend/src/modals/formModal/chatMessage/codeBlock/index.tsx
@@ -69,7 +69,7 @@ export const CodeBlock: FC<Props> = memo(({ language, value }) => {
       </div>
 
       <SyntaxHighlighter
-        className=" w-[570px]"
+        className=" w-[47vw]"
         language={language}
         style={oneDark}
         customStyle={{ margin: 0 }}

From 54b5aa65da09e7fd81f44bbca63258792d3e7aec Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Fri, 30 Jun 2023 00:09:34 -0300
Subject: [PATCH 39/51] =?UTF-8?q?=F0=9F=94=A8=20refactor(formModal/index.t?=
 =?UTF-8?q?sx):=20organize=20imports=20and=20format=20code=20for=20better?=
 =?UTF-8?q?=20readability=20=E2=9C=A8=20feat(formModal/index.tsx):=20add?=
 =?UTF-8?q?=20support=20for=20dropdown=20menu=20component=20and=20button?=
 =?UTF-8?q?=20component=20=F0=9F=94=A7=20chore(formModal/index.tsx):=20fix?=
 =?UTF-8?q?=20indentation=20and=20spacing=20issues=20for=20better=20code?=
 =?UTF-8?q?=20formatting=20=F0=9F=90=9B=20fix(formModal/index.tsx):=20fix?=
 =?UTF-8?q?=20type=20error=20and=20handle=20input=20value=20changes=20corr?=
 =?UTF-8?q?ectly=20=F0=9F=94=A7=20chore(formModal/index.tsx):=20fix=20inde?=
 =?UTF-8?q?ntation=20and=20spacing=20issues=20for=20better=20code=20format?=
 =?UTF-8?q?ting=20=E2=9C=A8=20feat(formModal/index.tsx):=20add=20support?=
 =?UTF-8?q?=20for=20textarea=20component=20and=20handle=20input=20value=20?=
 =?UTF-8?q?changes=20correctly=20=F0=9F=94=A7=20chore(formModal/index.tsx)?=
 =?UTF-8?q?:=20fix=20indentation=20and=20spacing=20issues=20for=20better?=
 =?UTF-8?q?=20code=20formatting=20=E2=9C=A8=20feat(formModal/index.tsx):?=
 =?UTF-8?q?=20add=20support=20for=20toggle=20component=20and=20handle=20in?=
 =?UTF-8?q?put=20value=20changes=20correctly=20=F0=9F=94=A7=20chore(formMo?=
 =?UTF-8?q?dal/index.tsx):=20fix=20indentation=20and=20spacing=20issues=20?=
 =?UTF-8?q?for=20better=20code=20formatting=20=E2=9C=A8=20feat(formModal/i?=
 =?UTF-8?q?ndex.tsx):=20add=20support=20for=20dropdown=20menu=20component?=
 =?UTF-8?q?=20and=20button=20component=20=F0=9F=94=A7=20chore(formModal/in?=
 =?UTF-8?q?dex.tsx):=20fix=20indentation=20and=20spacing=20issues=20for=20?=
 =?UTF-8?q?better=20code=20formatting=20=E2=9C=A8=20feat(formModal/index.t?=
 =?UTF-8?q?sx):=20add=20support=20for=20textarea=20component=20and=20handl?=
 =?UTF-8?q?e=20input=20value=20changes=20correctly=20=F0=9F=94=A7=20chore(?=
 =?UTF-8?q?formModal/index.tsx):=20fix=20indentation=20and=20spacing=20iss?=
 =?UTF-8?q?ues=20for=20better=20code=20formatting=20=E2=9C=A8=20feat(formM?=
 =?UTF-8?q?odal/index.tsx):=20add=20support=20for=20toggle=20component=20a?=
 =?UTF-8?q?nd=20handle=20input=20value=20changes=20correctly=20?=
 =?UTF-8?q?=F0=9F=94=A7=20chore(formModal/index.tsx):=20fix=20indentation?=
 =?UTF-8?q?=20and=20spacing=20issues=20for=20better=20code=20formatting=20?=
 =?UTF-8?q?=E2=9C=A8=20feat(formModal/index.tsx):=20add=20support=20for=20?=
 =?UTF-8?q?dropdown=20menu=20component=20and=20button=20component=20?=
 =?UTF-8?q?=F0=9F=94=A7=20chore(formModal/index.tsx):=20fix=20indentation?=
 =?UTF-8?q?=20and=20spacing=20issues=20for=20better=20code=20formatting=20?=
 =?UTF-8?q?=E2=9C=A8=20feat(formModal/index.tsx):=20add=20support=20for=20?=
 =?UTF-8?q?textarea=20component=20and=20handle=20input=20value=20changes?=
 =?UTF-8?q?=20correctly=20=F0=9F=94=A7=20chore(formModal/index.tsx):=20fix?=
 =?UTF-8?q?=20indentation=20and=20spacing=20issues=20for=20better=20code?=
 =?UTF-8?q?=20formatting=20=E2=9C=A8=20feat(formModal/index.tsx):=20add=20?=
 =?UTF-8?q?support=20for=20toggle=20component=20and=20handle=20input=20val?=
 =?UTF-8?q?ue=20changes=20correctly=20=F0=9F=94=A7=20chore(formModal/index?=
 =?UTF-8?q?.tsx):=20fix=20indentation=20and=20spacing=20issues=20for=20bet?=
 =?UTF-8?q?ter=20code=20formatting=20=E2=9C=A8=20feat(formModal/index.tsx)?=
 =?UTF-8?q?:=20add=20support=20for=20dropdown=20menu=20component=20and=20b?=
 =?UTF-8?q?utton=20component=20=F0=9F=94=A7=20chore(formModal/index.tsx):?=
 =?UTF-8?q?=20fix=20indentation=20and=20spacing=20issues=20for=20better=20?=
 =?UTF-8?q?code=20formatting=20=E2=9C=A8=20feat(formModal/index.tsx):=20ad?=
 =?UTF-8?q?d=20support=20for=20textarea=20component=20and=20handle=20input?=
 =?UTF-8?q?=20value=20changes=20correctly=20=F0=9F=94=A7=20chore(formModal?=
 =?UTF-8?q?/index.tsx):=20fix=20indentation=20and=20spacing=20issues=20for?=
 =?UTF-8?q?=20better=20code?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/modals/formModal/index.tsx | 165 ++++++++++++++------
 1 file changed, 113 insertions(+), 52 deletions(-)

diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index 0992c4c50..134536ac3 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -30,6 +30,14 @@ import {
 import { Textarea } from "../../components/ui/textarea";
 import { Badge } from "../../components/ui/badge";
 import ToggleShadComponent from "../../components/toggleShadComponent";
+import Dropdown from "../../components/dropdownComponent";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "../../components/ui/dropdown-menu";
+import { Button } from "../../components/ui/button";
 
 export default function FormModal({
   flow,
@@ -41,7 +49,13 @@ export default function FormModal({
   flow: FlowType;
 }) {
   const { tabsState, setTabsState } = useContext(TabsContext);
-  const [chatValue, setChatValue] = useState(tabsState[flow.id].formKeysData.input_keys[Object.keys(tabsState[flow.id].formKeysData.input_keys).find((k) => !tabsState[flow.id].formKeysData.handle_keys.some((j) => j === k))]);
+  const [chatValue, setChatValue] = useState(
+    tabsState[flow.id].formKeysData.input_keys[
+      Object.keys(tabsState[flow.id].formKeysData.input_keys).find(
+        (k) => !tabsState[flow.id].formKeysData.handle_keys.some((j) => j === k)
+      )
+    ]
+  );
   const [chatHistory, setChatHistory] = useState<ChatMessageType[]>([]);
   const { reactFlowInstance } = useContext(typesContext);
   const { setErrorData, setNoticeData } = useContext(alertContext);
@@ -50,7 +64,11 @@ export default function FormModal({
   const isOpen = useRef(open);
   const messagesRef = useRef(null);
   const id = useRef(flow.id);
-  const [chatKey, setChatKey] = useState(Object.keys(tabsState[flow.id].formKeysData.input_keys).find((k) => !tabsState[flow.id].formKeysData.handle_keys.some((j) => j === k)));
+  const [chatKey, setChatKey] = useState(
+    Object.keys(tabsState[flow.id].formKeysData.input_keys).find(
+      (k) => !tabsState[flow.id].formKeysData.handle_keys.some((j) => j === k)
+    )
+  );
 
   useEffect(() => {
     if (messagesRef.current) {
@@ -298,7 +316,7 @@ export default function FormModal({
   }, [open]);
   function formatMessage(inputs: any): string {
     if (inputs) {
-      if(typeof inputs == "string") return inputs;
+      if (typeof inputs == "string") return inputs;
       // inputs is a object with the keys and values being input_keys and keysValue
       // so the formated message is a string with the keys and values separated by ": "
       let message = "";
@@ -382,53 +400,86 @@ export default function FormModal({
 
           <div className="flex h-[80vh] w-full mt-2 ">
             <div className="w-2/5 h-full overflow-auto scrollbar-hide flex flex-col justify-start mr-6">
+              <div className="flex justify-between items-center">
               <div className="flex py-2">
                 <Variable className="w-6 h-6 pe-1 text-gray-700 stroke-2 dark:text-slate-200"></Variable>
                 <span className="text-md font-semibold text-gray-800 dark:text-white">
                   Input Variables
                 </span>
               </div>
+              <span className="mr-7 text-sm font-semibold text-gray-800 dark:text-white">
+                  Chat
+                </span>
+              </div>
               <Accordion type="single" collapsible className="w-full">
-                {Object.keys(tabsState[id.current].formKeysData.input_keys).map((i, k) => (
-                  <AccordionItem key={k} value={i}>
-                    <AccordionTrigger className="flex gap-2"><Badge variant="gray" size="md">{i}</Badge></AccordionTrigger>
-                    <AccordionContent>
-                      <div className="p-1 flex flex-col gap-2">
-                      {tabsState[id.current].formKeysData.handle_keys.some((t) => t === i) ? <div className="font-normal text-muted-foreground ">Handle</div> :
-                        <div className="flex items-center space-x-2">
-                          <Label htmlFor="airplane-mode" className="-mt-1">From Chat</Label>
-                          <ToggleShadComponent
-                            enabled={chatKey === i}
-                            setEnabled={(value) =>
-                              handleOnCheckedChange(value, i)
-                            }
-                            size="small"
-                            disabled={false}
-                          />
-                        </div>
-                      }
-                        <Textarea
-                          value={tabsState[id.current].formKeysData.input_keys[i]}
-                          onChange={(e) => {
-                            if(!tabsState[id.current].formKeysData.handle_keys.some((t) => t === i))
-                              setTabsState((old) => {
-                                let newTabsState = _.cloneDeep(old);
-                                newTabsState[id.current].formKeysData.input_keys[i] = e.target.value;
-                                return newTabsState;
-                              })
-                            }
-                          }
-                          disabled={chatKey === i}
-                          placeholder="Enter text..."
-                        ></Textarea>
+                {Object.keys(tabsState[id.current].formKeysData.input_keys).map(
+                  (i, k) => (
+                    <div className="flex items-start gap-3">
+                    <AccordionItem className="w-full" key={k} value={i}>
+                      <AccordionTrigger className="flex gap-2">
+                      <div className="flex items-center w-full justify-between">
+                        <Badge variant="gray" size="md">
+                          {i}
+                        </Badge>
+                        
+                      <div className="-mb-1">
+                    <ToggleShadComponent
+                                enabled={chatKey === i}
+                                setEnabled={(value) =>
+                                  handleOnCheckedChange(value, i)
+                                }
+                                size="small"
+                                disabled={false}
+                              /></div>
                       </div>
-                    </AccordionContent>
-                  </AccordionItem>
-                ))}
+                      </AccordionTrigger>
+                      <AccordionContent>
+                        <div className="p-1 flex flex-col gap-2">
+                          {tabsState[id.current].formKeysData.handle_keys.some(
+                            (t) => t === i
+                          ) ? (
+                            <div className="font-normal text-muted-foreground ">
+                              Handle
+                            </div>
+                          ) : (
+                            <></>
+                          )}
+                          <Textarea
+                            value={
+                              tabsState[id.current].formKeysData.input_keys[i]
+                            }
+                            onChange={(e) => {
+                              if (
+                                !tabsState[
+                                  id.current
+                                ].formKeysData.handle_keys.some((t) => t === i)
+                              )
+                                setTabsState((old) => {
+                                  let newTabsState = _.cloneDeep(old);
+                                  newTabsState[
+                                    id.current
+                                  ].formKeysData.input_keys[i] = e.target.value;
+                                  return newTabsState;
+                                });
+                            }}
+                            disabled={chatKey === i}
+                            placeholder="Enter text..."
+                          ></Textarea>
+                        </div>
+                      </AccordionContent>
+                    </AccordionItem>
+                    
+                    </div>
+                  )
+                )}
                 {tabsState[id.current].formKeysData.memory_keys.map((i, k) => (
                   <AccordionItem key={k} value={i}>
                     <div className="flex flex-1 items-center justify-between py-4 font-normal transition-all group text-muted-foreground text-sm">
-                      <div className="group-hover:underline"><Badge size="md" variant="gray">{i}</Badge></div>
+                      <div className="group-hover:underline">
+                        <Badge size="md" variant="gray">
+                          {i}
+                        </Badge>
+                      </div>
                       Used as Memory Key
                     </div>
                   </AccordionItem>
@@ -437,14 +488,19 @@ export default function FormModal({
             </div>
             <div className="w-full">
               <div className="flex flex-col rounded-md border bg-muted w-full h-full relative">
-              <div className="absolute right-3 top-3 z-50">
-              <button disabled={lockChat} onClick={() => clearChat()}>
-                <Eraser 
-                  className={classNames("h-5 w-5", lockChat ? "text-primary animate-pulse" : "text-primary hover:text-gray-600")}
-                  aria-hidden="true"
-                />
-              </button>
-              </div>
+                <div className="absolute right-3 top-3 z-50">
+                  <button disabled={lockChat} onClick={() => clearChat()}>
+                    <Eraser
+                      className={classNames(
+                        "h-5 w-5",
+                        lockChat
+                          ? "text-primary animate-pulse"
+                          : "text-primary hover:text-gray-600"
+                      )}
+                      aria-hidden="true"
+                    />
+                  </button>
+                </div>
                 <div
                   ref={messagesRef}
                   className="w-full h-full flex-col flex items-center overflow-scroll scrollbar-hide"
@@ -486,11 +542,16 @@ export default function FormModal({
                       chatValue={chatValue}
                       lockChat={lockChat}
                       sendMessage={sendMessage}
-                      setChatValue={(value) => {setChatValue(value); setTabsState((old) => {
-                        let newTabsState = _.cloneDeep(old);
-                        newTabsState[id.current].formKeysData.input_keys[chatKey] = chatValue;
-                        return newTabsState;
-                      });}}
+                      setChatValue={(value) => {
+                        setChatValue(value);
+                        setTabsState((old) => {
+                          let newTabsState = _.cloneDeep(old);
+                          newTabsState[id.current].formKeysData.input_keys[
+                            chatKey
+                          ] = chatValue;
+                          return newTabsState;
+                        });
+                      }}
                       inputRef={ref}
                     />
                   </div>

From 3ae84bea132369dae562ce7e6b12615e0b9efaf2 Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Fri, 30 Jun 2023 06:46:00 -0300
Subject: [PATCH 40/51] =?UTF-8?q?=F0=9F=94=A7=20chore(validate.py):=20add?=
 =?UTF-8?q?=20display=5Fname=20field=20to=20TemplateField=20in=20post=5Fva?=
 =?UTF-8?q?lidate=5Fprompt=20function=20The=20display=5Fname=20field=20is?=
 =?UTF-8?q?=20added=20to=20the=20TemplateField=20object=20in=20the=20post?=
 =?UTF-8?q?=5Fvalidate=5Fprompt=20function.=20This=20field=20allows=20for?=
 =?UTF-8?q?=20a=20more=20user-friendly=20display=20of=20the=20variable=20n?=
 =?UTF-8?q?ame=20in=20the=20UI.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/api/v1/validate.py | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/backend/langflow/api/v1/validate.py b/src/backend/langflow/api/v1/validate.py
index 184657a63..23fad5711 100644
--- a/src/backend/langflow/api/v1/validate.py
+++ b/src/backend/langflow/api/v1/validate.py
@@ -39,6 +39,7 @@ def post_validate_prompt(prompt: ValidatePromptRequest):
             try:
                 template_field = TemplateField(
                     name=variable,
+                    display_name=variable,
                     field_type="str",
                     show=True,
                     advanced=False,

From 5520ecea7a7cfb473dbb400cfbeaaa5094ba1178 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Fri, 30 Jun 2023 10:31:03 -0300
Subject: [PATCH 41/51] =?UTF-8?q?=F0=9F=90=9B=20fix(formModal/index.tsx):?=
 =?UTF-8?q?=20stop=20propagation=20of=20click=20event=20at=20the=20toggle?=
 =?UTF-8?q?=20component?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/modals/formModal/index.tsx | 116 +++++++++++---------
 1 file changed, 62 insertions(+), 54 deletions(-)

diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index 134536ac3..5ed82d0d7 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -401,74 +401,82 @@ export default function FormModal({
           <div className="flex h-[80vh] w-full mt-2 ">
             <div className="w-2/5 h-full overflow-auto scrollbar-hide flex flex-col justify-start mr-6">
               <div className="flex justify-between items-center">
-              <div className="flex py-2">
-                <Variable className="w-6 h-6 pe-1 text-gray-700 stroke-2 dark:text-slate-200"></Variable>
-                <span className="text-md font-semibold text-gray-800 dark:text-white">
-                  Input Variables
-                </span>
-              </div>
-              <span className="mr-7 text-sm font-semibold text-gray-800 dark:text-white">
-                  Chat
+                <div className="flex py-2">
+                  <Variable className="w-6 h-6 pe-1 text-gray-700 stroke-2 dark:text-slate-200"></Variable>
+                  <span className="text-md font-semibold text-primary">
+                    Input Variables
+                  </span>
+                </div>
+                <span className="mr-2 text-md font-semibold text-primary">
+                  Chat Input
                 </span>
               </div>
               <Accordion type="single" collapsible className="w-full">
                 {Object.keys(tabsState[id.current].formKeysData.input_keys).map(
                   (i, k) => (
                     <div className="flex items-start gap-3">
-                    <AccordionItem className="w-full" key={k} value={i}>
-                      <AccordionTrigger className="flex gap-2">
-                      <div className="flex items-center w-full justify-between">
-                        <Badge variant="gray" size="md">
-                          {i}
-                        </Badge>
-                        
-                      <div className="-mb-1">
-                    <ToggleShadComponent
+                      <AccordionItem className="w-full" key={k} value={i}>
+                        <AccordionTrigger className="flex gap-2">
+                          <div className="flex items-center w-full justify-between">
+                            <Badge variant="gray" size="md">
+                              {i}
+                            </Badge>
+
+                            <div
+                              className="-mb-1"
+                              onClick={(event) => {
+                                event.stopPropagation();
+                              }}
+                            >
+                              <ToggleShadComponent
                                 enabled={chatKey === i}
                                 setEnabled={(value) =>
                                   handleOnCheckedChange(value, i)
                                 }
                                 size="small"
                                 disabled={false}
-                              /></div>
-                      </div>
-                      </AccordionTrigger>
-                      <AccordionContent>
-                        <div className="p-1 flex flex-col gap-2">
-                          {tabsState[id.current].formKeysData.handle_keys.some(
-                            (t) => t === i
-                          ) ? (
-                            <div className="font-normal text-muted-foreground ">
-                              Handle
+                              />
                             </div>
-                          ) : (
-                            <></>
-                          )}
-                          <Textarea
-                            value={
-                              tabsState[id.current].formKeysData.input_keys[i]
-                            }
-                            onChange={(e) => {
-                              if (
-                                !tabsState[
-                                  id.current
-                                ].formKeysData.handle_keys.some((t) => t === i)
-                              )
-                                setTabsState((old) => {
-                                  let newTabsState = _.cloneDeep(old);
-                                  newTabsState[
+                          </div>
+                        </AccordionTrigger>
+                        <AccordionContent>
+                          <div className="p-1 flex flex-col gap-2">
+                            {tabsState[
+                              id.current
+                            ].formKeysData.handle_keys.some((t) => t === i) ? (
+                              <div className="font-normal text-muted-foreground ">
+                                Handle
+                              </div>
+                            ) : (
+                              <></>
+                            )}
+                            <Textarea
+                              value={
+                                tabsState[id.current].formKeysData.input_keys[i]
+                              }
+                              onChange={(e) => {
+                                if (
+                                  !tabsState[
                                     id.current
-                                  ].formKeysData.input_keys[i] = e.target.value;
-                                  return newTabsState;
-                                });
-                            }}
-                            disabled={chatKey === i}
-                            placeholder="Enter text..."
-                          ></Textarea>
-                        </div>
-                      </AccordionContent>
-                    </AccordionItem>
-                    
+                                  ].formKeysData.handle_keys.some(
+                                    (t) => t === i
+                                  )
+                                )
+                                  setTabsState((old) => {
+                                    let newTabsState = _.cloneDeep(old);
+                                    newTabsState[
+                                      id.current
+                                    ].formKeysData.input_keys[i] =
+                                      e.target.value;
+                                    return newTabsState;
+                                  });
+                              }}
+                              disabled={chatKey === i}
+                              placeholder="Enter text..."
+                            ></Textarea>
+                          </div>
+                        </AccordionContent>
+                      </AccordionItem>
                     </div>
                   )
                 )}

From fe1646791419c3fc92f31ad6d8a708237060a40d Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Fri, 30 Jun 2023 10:48:51 -0300
Subject: [PATCH 42/51] =?UTF-8?q?=F0=9F=90=9B=20fix(toggleShadComponent):?=
 =?UTF-8?q?=20remove=20unused=20useEffect=20hook=20to=20improve=20code=20r?=
 =?UTF-8?q?eadability=20and=20maintainability=20=E2=9C=A8=20feat(toggleSha?=
 =?UTF-8?q?dComponent):=20add=20disabled=20prop=20to=20Switch=20component?=
 =?UTF-8?q?=20to=20disable=20interaction=20when=20disabled=20is=20true?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

🐛 fix(formModal): remove unused imports to improve code cleanliness
✨ feat(formModal): add MessageSquarePlus icon to represent chat input
✨ feat(formModal): add multiple collapsible accordions for input variables
🐛 fix(formModal): disable Toggle component when handle key is present in formKeysData
---
 .../components/toggleShadComponent/index.tsx  |  8 +--
 src/frontend/src/modals/formModal/index.tsx   | 53 ++++++++++---------
 2 files changed, 29 insertions(+), 32 deletions(-)

diff --git a/src/frontend/src/components/toggleShadComponent/index.tsx b/src/frontend/src/components/toggleShadComponent/index.tsx
index 290a46cb4..6619c1d36 100644
--- a/src/frontend/src/components/toggleShadComponent/index.tsx
+++ b/src/frontend/src/components/toggleShadComponent/index.tsx
@@ -8,11 +8,6 @@ export default function ToggleShadComponent({
   disabled,
   size,
 }: ToggleComponentType) {
-  useEffect(() => {
-    if (disabled) {
-      setEnabled(false);
-    }
-  }, [disabled, setEnabled]);
   let scaleX, scaleY;
   switch (size) {
     case "small":
@@ -32,11 +27,12 @@ export default function ToggleShadComponent({
       scaleY = 1;
   }
   return (
-    <div className={disabled ? "pointer-events-none cursor-not-allowed" : ""}>
+    <div className={disabled ? "pointer-events-none cursor-not-allowed " : ""}>
       <Switch
         style={{
           transform: `scaleX(${scaleX}) scaleY(${scaleY})`,
         }}
+        disabled={disabled}
         className="data-[state=unchecked]:bg-slate-500"
         checked={enabled}
         onCheckedChange={(x: boolean) => {
diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index 5ed82d0d7..a41c53a46 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -4,7 +4,13 @@ import { alertContext } from "../../contexts/alertContext";
 import { classNames, validateNodes } from "../../utils";
 import { typesContext } from "../../contexts/typesContext";
 import ChatMessage from "./chatMessage";
-import { TerminalSquare, MessageSquare, Variable, Eraser } from "lucide-react";
+import {
+  TerminalSquare,
+  MessageSquare,
+  Variable,
+  Eraser,
+  MessageSquarePlus,
+} from "lucide-react";
 import { sendAllProps } from "../../types/api";
 import { ChatMessageType } from "../../types/chat";
 import ChatInput from "./chatInput";
@@ -401,17 +407,20 @@ export default function FormModal({
           <div className="flex h-[80vh] w-full mt-2 ">
             <div className="w-2/5 h-full overflow-auto scrollbar-hide flex flex-col justify-start mr-6">
               <div className="flex justify-between items-center">
-                <div className="flex py-2">
-                  <Variable className="w-6 h-6 pe-1 text-gray-700 stroke-2 dark:text-slate-200"></Variable>
+                <div className="flex py-2 items-center">
+                  <Variable className="w-6 h-6 pe-1 text-primary"></Variable>
                   <span className="text-md font-semibold text-primary">
                     Input Variables
                   </span>
                 </div>
-                <span className="mr-2 text-md font-semibold text-primary">
-                  Chat Input
-                </span>
+                <div className="flex py-2 items-center">
+                  <MessageSquarePlus className="w-6 h-6 pe-1 mr-0.5 text-primary" />
+                  <span className=" text-md font-semibold text-primary">
+                    Chat Input
+                  </span>
+                </div>
               </div>
-              <Accordion type="single" collapsible className="w-full">
+              <Accordion type="multiple" className="w-full">
                 {Object.keys(tabsState[id.current].formKeysData.input_keys).map(
                   (i, k) => (
                     <div className="flex items-start gap-3">
@@ -434,7 +443,9 @@ export default function FormModal({
                                   handleOnCheckedChange(value, i)
                                 }
                                 size="small"
-                                disabled={false}
+                                disabled={tabsState[
+                                  id.current
+                                ].formKeysData.handle_keys.some((t) => t === i)}
                               />
                             </div>
                           </div>
@@ -443,33 +454,23 @@ export default function FormModal({
                           <div className="p-1 flex flex-col gap-2">
                             {tabsState[
                               id.current
-                            ].formKeysData.handle_keys.some((t) => t === i) ? (
+                            ].formKeysData.handle_keys.some((t) => t === i) && (
                               <div className="font-normal text-muted-foreground ">
-                                Handle
+                                Source: Component
                               </div>
-                            ) : (
-                              <></>
                             )}
                             <Textarea
                               value={
                                 tabsState[id.current].formKeysData.input_keys[i]
                               }
                               onChange={(e) => {
-                                if (
-                                  !tabsState[
+                                setTabsState((old) => {
+                                  let newTabsState = _.cloneDeep(old);
+                                  newTabsState[
                                     id.current
-                                  ].formKeysData.handle_keys.some(
-                                    (t) => t === i
-                                  )
-                                )
-                                  setTabsState((old) => {
-                                    let newTabsState = _.cloneDeep(old);
-                                    newTabsState[
-                                      id.current
-                                    ].formKeysData.input_keys[i] =
-                                      e.target.value;
-                                    return newTabsState;
-                                  });
+                                  ].formKeysData.input_keys[i] = e.target.value;
+                                  return newTabsState;
+                                });
                               }}
                               disabled={chatKey === i}
                               placeholder="Enter text..."

From 270d5fb1066fc643bea6d8808352eca89c47c0cb Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Fri, 30 Jun 2023 11:17:32 -0300
Subject: [PATCH 43/51] =?UTF-8?q?=F0=9F=90=9B=20fix(loading.py):=20add=20m?=
 =?UTF-8?q?issing=20condition=20to=20check=20if=20variable=20is=20an=20ins?=
 =?UTF-8?q?tance=20of=20BaseOutputParser=20and=20has=20"get=5Fformat=5Fins?=
 =?UTF-8?q?tructions"=20attribute=20The=20code=20was=20missing=20a=20condi?=
 =?UTF-8?q?tion=20to=20check=20if=20the=20variable=20is=20an=20instance=20?=
 =?UTF-8?q?of=20BaseOutputParser=20and=20has=20the=20"get=5Fformat=5Finstr?=
 =?UTF-8?q?uctions"=20attribute.=20This=20condition=20is=20necessary=20to?=
 =?UTF-8?q?=20properly=20handle=20the=20variable=20and=20avoid=20potential?=
 =?UTF-8?q?=20errors.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/interface/initialize/loading.py | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/backend/langflow/interface/initialize/loading.py b/src/backend/langflow/interface/initialize/loading.py
index 6267dd400..bc8c7f0cf 100644
--- a/src/backend/langflow/interface/initialize/loading.py
+++ b/src/backend/langflow/interface/initialize/loading.py
@@ -149,6 +149,14 @@ def instantiate_prompt(node_type, class_object, params):
                 )
                 # handle_keys will be a list but it does not exist yet
                 # so we need to create it
+
+            if (
+                isinstance(variable, List)
+                and all(isinstance(item, Document) for item in variable)
+            ) or (
+                isinstance(variable, BaseOutputParser)
+                and hasattr(variable, "get_format_instructions")
+            ):
                 if "handle_keys" not in params:
                     format_kwargs["handle_keys"] = []
 

From 052155bc6a1772becca9027e494f0a146c30f7cf Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Fri, 30 Jun 2023 11:19:50 -0300
Subject: [PATCH 44/51] Edited dragOver drop effect on dropping file, printed
 file dropped over the pane

---
 .../components/PageComponent/index.tsx        | 94 ++++++++++---------
 .../extraSidebarComponent/index.tsx           |  2 +-
 2 files changed, 53 insertions(+), 43 deletions(-)

diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
index 9a871e639..ac0675862 100644
--- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
@@ -219,62 +219,72 @@ export default function Page({ flow }: { flow: FlowType }) {
 
   const onDragOver = useCallback((event: React.DragEvent) => {
     event.preventDefault();
-    event.dataTransfer.dropEffect = "move";
+    console.log(event.dataTransfer.types);
+    if (event.dataTransfer.types.some((t) => t === "nodedata")) {
+      event.dataTransfer.dropEffect = "move";
+    } else {
+      event.dataTransfer.dropEffect = "copy";
+    }
   }, []);
 
   const onDrop = useCallback(
     (event: React.DragEvent) => {
       event.preventDefault();
-      takeSnapshot();
+      if (event.dataTransfer.types.some((t) => t === "nodedata")) {
+        takeSnapshot();
 
-      // Get the current bounds of the ReactFlow wrapper element
-      const reactflowBounds = reactFlowWrapper.current.getBoundingClientRect();
+        // Get the current bounds of the ReactFlow wrapper element
+        const reactflowBounds =
+          reactFlowWrapper.current.getBoundingClientRect();
 
-      // Extract the data from the drag event and parse it as a JSON object
-      let data: { type: string; node?: APIClassType } = JSON.parse(
-        event.dataTransfer.getData("json")
-      );
+        // Extract the data from the drag event and parse it as a JSON object
+        let data: { type: string; node?: APIClassType } = JSON.parse(
+          event.dataTransfer.getData("nodedata")
+        );
 
-      // If data type is not "chatInput" or if there are no "chatInputNode" nodes present in the ReactFlow instance, create a new node
-      // Calculate the position where the node should be created
-      const position = reactFlowInstance.project({
-        x: event.clientX - reactflowBounds.left,
-        y: event.clientY - reactflowBounds.top,
-      });
+        // If data type is not "chatInput" or if there are no "chatInputNode" nodes present in the ReactFlow instance, create a new node
+        // Calculate the position where the node should be created
+        const position = reactFlowInstance.project({
+          x: event.clientX - reactflowBounds.left,
+          y: event.clientY - reactflowBounds.top,
+        });
 
-      // Generate a unique node ID
-      let { type } = data;
-      let newId = getNodeId(type);
-      let newNode: NodeType;
+        // Generate a unique node ID
+        let { type } = data;
+        let newId = getNodeId(type);
+        let newNode: NodeType;
 
-      if (data.type !== "groupNode") {
-        // Create a new node object
-        newNode = {
-          id: newId,
-          type: "genericNode",
-          position,
-          data: {
-            ...data,
+        if (data.type !== "groupNode") {
+          // Create a new node object
+          newNode = {
             id: newId,
-            value: null,
-          },
-        };
-      } else {
-        // Create a new node object
-        newNode = {
-          id: newId,
-          type: "genericNode",
-          position,
-          data: {
-            ...data,
+            type: "genericNode",
+            position,
+            data: {
+              ...data,
+              id: newId,
+              value: null,
+            },
+          };
+        } else {
+          // Create a new node object
+          newNode = {
             id: newId,
-            value: null,
-          },
-        };
+            type: "genericNode",
+            position,
+            data: {
+              ...data,
+              id: newId,
+              value: null,
+            },
+          };
 
-        // Add the new node to the list of nodes in state
+          // Add the new node to the list of nodes in state
+        }
+        setNodes((nds) => nds.concat(newNode));
+      } else if (event.dataTransfer.types.some((t) => t === "Files")) {
+        console.log(event.dataTransfer.files.item(0));
       }
-      setNodes((nds) => nds.concat(newNode));
     },
     // Specify dependencies for useCallback
     [getNodeId, reactFlowInstance, setErrorData, setNodes, takeSnapshot]
diff --git a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx
index b4f380164..1c98efd6d 100644
--- a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx
@@ -40,7 +40,7 @@ export default function ExtraSidebar() {
     crt.classList.add("cursor-grabbing");
     document.body.appendChild(crt);
     event.dataTransfer.setDragImage(crt, 0, 0);
-    event.dataTransfer.setData("json", JSON.stringify(data));
+    event.dataTransfer.setData("nodedata", JSON.stringify(data));
   }
 
   function handleSearchInput(e: string) {

From 0eead8f3f74ab700d27b65281af2a9ef91b9b1ef Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Fri, 30 Jun 2023 11:23:19 -0300
Subject: [PATCH 45/51] =?UTF-8?q?=F0=9F=90=9B=20fix(loading.py):=20fix=20c?=
 =?UTF-8?q?ondition=20to=20check=20for=20"handle=5Fkeys"=20in=20format=5Fk?=
 =?UTF-8?q?wargs=20instead=20of=20params=20The=20condition=20to=20check=20?=
 =?UTF-8?q?for=20the=20presence=20of=20"handle=5Fkeys"=20has=20been=20fixe?=
 =?UTF-8?q?d=20to=20correctly=20check=20for=20its=20existence=20in=20the?=
 =?UTF-8?q?=20format=5Fkwargs=20dictionary=20instead=20of=20the=20params?=
 =?UTF-8?q?=20dictionary.=20This=20ensures=20that=20the=20"handle=5Fkeys"?=
 =?UTF-8?q?=20list=20is=20properly=20populated=20when=20necessary.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/backend/langflow/interface/initialize/loading.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/backend/langflow/interface/initialize/loading.py b/src/backend/langflow/interface/initialize/loading.py
index bc8c7f0cf..e8d9cade4 100644
--- a/src/backend/langflow/interface/initialize/loading.py
+++ b/src/backend/langflow/interface/initialize/loading.py
@@ -157,7 +157,7 @@ def instantiate_prompt(node_type, class_object, params):
                 isinstance(variable, BaseOutputParser)
                 and hasattr(variable, "get_format_instructions")
             ):
-                if "handle_keys" not in params:
+                if "handle_keys" not in format_kwargs:
                     format_kwargs["handle_keys"] = []
 
                 # Add the handle_keys to the list

From 1aa906dbb65f48566da890c2170ccee161fed790 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Fri, 30 Jun 2023 11:25:00 -0300
Subject: [PATCH 46/51] Added logic to upload flow on drop

---
 src/frontend/src/contexts/tabsContext.tsx     | 79 +++++++++++--------
 .../components/PageComponent/index.tsx        |  4 +-
 src/frontend/src/types/tabs/index.ts          |  2 +-
 3 files changed, 51 insertions(+), 34 deletions(-)

diff --git a/src/frontend/src/contexts/tabsContext.tsx b/src/frontend/src/contexts/tabsContext.tsx
index b847f4ecd..c60650a48 100644
--- a/src/frontend/src/contexts/tabsContext.tsx
+++ b/src/frontend/src/contexts/tabsContext.tsx
@@ -189,26 +189,28 @@ export function TabsProvider({ children }: { children: ReactNode }) {
   }
 
   function processFlowEdges(flow) {
-    if(!flow.data || !flow.data.edges) return;
+    if (!flow.data || !flow.data.edges) return;
     flow.data.edges.forEach((edge) => {
       edge.className = "";
       edge.style = { stroke: "#555555" };
     });
   }
-  function updateDisplay_name(node:NodeType,template:APIClassType) {
-    node.data.node.display_name = template["display_name"]?template["display_name"]:node.data.type;
+  function updateDisplay_name(node: NodeType, template: APIClassType) {
+    node.data.node.display_name = template["display_name"]
+      ? template["display_name"]
+      : node.data.type;
   }
 
   function processFlowNodes(flow) {
-    if(!flow.data || !flow.data.nodes) return;
-    flow.data.nodes.forEach((node:NodeType) => {
+    if (!flow.data || !flow.data.nodes) return;
+    flow.data.nodes.forEach((node: NodeType) => {
       const template = templates[node.data.type];
       if (!template) {
         setErrorData({ title: `Unknown node type: ${node.data.type}` });
         return;
       }
       if (Object.keys(template["template"]).length > 0) {
-        updateDisplay_name(node,template);
+        updateDisplay_name(node, template);
         updateNodeBaseClasses(node, template);
         updateNodeEdges(flow, node, template);
         updateNodeDescription(node, template);
@@ -217,11 +219,15 @@ export function TabsProvider({ children }: { children: ReactNode }) {
     });
   }
 
-  function updateNodeBaseClasses(node:NodeType,template:APIClassType) {
+  function updateNodeBaseClasses(node: NodeType, template: APIClassType) {
     node.data.node.base_classes = template["base_classes"];
   }
 
-  function updateNodeEdges(flow:FlowType, node:NodeType,template:APIClassType) {
+  function updateNodeEdges(
+    flow: FlowType,
+    node: NodeType,
+    template: APIClassType
+  ) {
     flow.data.edges.forEach((edge) => {
       if (edge.source === node.id) {
         edge.sourceHandle = edge.sourceHandle
@@ -233,11 +239,11 @@ export function TabsProvider({ children }: { children: ReactNode }) {
     });
   }
 
-  function updateNodeDescription(node:NodeType,template:APIClassType) {
+  function updateNodeDescription(node: NodeType, template: APIClassType) {
     node.data.node.description = template["description"];
   }
 
-  function updateNodeTemplate(node:NodeType,template:APIClassType) {
+  function updateNodeTemplate(node: NodeType, template: APIClassType) {
     node.data.node.template = updateTemplate(
       template["template"] as unknown as APITemplateType,
       node.data.node.template as APITemplateType
@@ -302,28 +308,39 @@ export function TabsProvider({ children }: { children: ReactNode }) {
    * If the file type is application/json, the file is read and parsed into a JSON object.
    * The resulting JSON object is passed to the addFlow function.
    */
-  function uploadFlow(newProject?: boolean) {
-    // create a file input
-    const input = document.createElement("input");
-    input.type = "file";
-    input.accept = ".json";
-    // add a change event listener to the file input
-    input.onchange = (e: Event) => {
-      // check if the file type is application/json
-      if ((e.target as HTMLInputElement).files[0].type === "application/json") {
-        // get the file from the file input
-        const file = (e.target as HTMLInputElement).files[0];
-        // read the file as text
-        file.text().then((text) => {
-          // parse the text into a JSON object
-          let flow: FlowType = JSON.parse(text);
+  function uploadFlow(newProject?: boolean, file?: File) {
+    if (file) {
+      file.text().then((text) => {
+        // parse the text into a JSON object
+        let flow: FlowType = JSON.parse(text);
 
-          addFlow(flow, newProject);
-        });
-      }
-    };
-    // trigger the file input click event to open the file dialog
-    input.click();
+        addFlow(flow, newProject);
+      });
+    } else {
+      // create a file input
+      const input = document.createElement("input");
+      input.type = "file";
+      input.accept = ".json";
+      // add a change event listener to the file input
+      input.onchange = (e: Event) => {
+        // check if the file type is application/json
+        if (
+          (e.target as HTMLInputElement).files[0].type === "application/json"
+        ) {
+          // get the file from the file input
+          const currentfile = (e.target as HTMLInputElement).files[0];
+          // read the file as text
+          currentfile.text().then((text) => {
+            // parse the text into a JSON object
+            let flow: FlowType = JSON.parse(text);
+
+            addFlow(flow, newProject);
+          });
+        }
+      };
+      // trigger the file input click event to open the file dialog
+      input.click();
+    }
   }
 
   function uploadFlows() {
diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
index ac0675862..7deb62571 100644
--- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
@@ -37,6 +37,7 @@ const nodeTypes = {
 export default function Page({ flow }: { flow: FlowType }) {
   let {
     updateFlow,
+    uploadFlow,
     disableCopyPaste,
     addFlow,
     getNodeId,
@@ -219,7 +220,6 @@ export default function Page({ flow }: { flow: FlowType }) {
 
   const onDragOver = useCallback((event: React.DragEvent) => {
     event.preventDefault();
-    console.log(event.dataTransfer.types);
     if (event.dataTransfer.types.some((t) => t === "nodedata")) {
       event.dataTransfer.dropEffect = "move";
     } else {
@@ -283,7 +283,7 @@ export default function Page({ flow }: { flow: FlowType }) {
         }
         setNodes((nds) => nds.concat(newNode));
       } else if (event.dataTransfer.types.some((t) => t === "Files")) {
-        console.log(event.dataTransfer.files.item(0));
+        uploadFlow(false, event.dataTransfer.files.item(0))
       }
     },
     // Specify dependencies for useCallback
diff --git a/src/frontend/src/types/tabs/index.ts b/src/frontend/src/types/tabs/index.ts
index d0bd0f499..9a2a083b2 100644
--- a/src/frontend/src/types/tabs/index.ts
+++ b/src/frontend/src/types/tabs/index.ts
@@ -14,7 +14,7 @@ export type TabsContextType = {
   downloadFlow: (flow: FlowType) => void;
   downloadFlows: () => void;
   uploadFlows: () => void;
-  uploadFlow: (newFlow?: boolean) => void;
+  uploadFlow: (newFlow?: boolean, file?: File) => void;
   hardReset: () => void;
   //disable CopyPaste
   disableCopyPaste: boolean;

From 7fddffc12e7718b5dc6e5b64af7eb697aaf61ba8 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Fri, 30 Jun 2023 11:28:48 -0300
Subject: [PATCH 47/51] =?UTF-8?q?=F0=9F=8E=A8=20style(formModal/index.tsx)?=
 =?UTF-8?q?:=20adjust=20size=20and=20spacing=20of=20icons=20and=20text=20i?=
 =?UTF-8?q?n=20FormModal=20component=20for=20better=20visual=20consistency?=
 =?UTF-8?q?=20=F0=9F=90=9B=20fix(formModal/index.tsx):=20add=20unique=20ke?=
 =?UTF-8?q?y=20prop=20to=20dynamically=20rendered=20elements=20in=20FormMo?=
 =?UTF-8?q?dal=20component=20to=20remove=20console=20warning?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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

diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index a41c53a46..8b939b967 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -408,14 +408,14 @@ export default function FormModal({
             <div className="w-2/5 h-full overflow-auto scrollbar-hide flex flex-col justify-start mr-6">
               <div className="flex justify-between items-center">
                 <div className="flex py-2 items-center">
-                  <Variable className="w-6 h-6 pe-1 text-primary"></Variable>
-                  <span className="text-md font-semibold text-primary">
+                  <Variable className="w-4 h-4 mr-1 text-primary"></Variable>
+                  <span className="text-sm font-semibold text-primary">
                     Input Variables
                   </span>
                 </div>
                 <div className="flex py-2 items-center">
-                  <MessageSquarePlus className="w-6 h-6 pe-1 mr-0.5 text-primary" />
-                  <span className=" text-md font-semibold text-primary">
+                  <MessageSquarePlus className="w-4 h-4 mr-1 text-primary" />
+                  <span className="text-sm font-semibold text-primary">
                     Chat Input
                   </span>
                 </div>
@@ -423,7 +423,7 @@ export default function FormModal({
               <Accordion type="multiple" className="w-full">
                 {Object.keys(tabsState[id.current].formKeysData.input_keys).map(
                   (i, k) => (
-                    <div className="flex items-start gap-3">
+                    <div className="flex items-start gap-3" key={k}>
                       <AccordionItem className="w-full" key={k} value={i}>
                         <AccordionTrigger className="flex gap-2">
                           <div className="flex items-center w-full justify-between">

From a13e60ed57341653de6dedb25aae40d609eb96b7 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Fri, 30 Jun 2023 11:33:07 -0300
Subject: [PATCH 48/51] Fixed icon size at node changing with title size

---
 src/frontend/src/CustomNodes/GenericNode/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx
index 65bf962a5..cd49aaa5b 100644
--- a/src/frontend/src/CustomNodes/GenericNode/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx
@@ -102,7 +102,7 @@ export default function GenericNode({
                 color: nodeColors[types[data.type]] ?? nodeColors.unknown,
               }}
             />
-            <div className="ml-2 truncate">
+            <div className="ml-2 truncate flex-1">
               <ShadTooltip
                 delayDuration={1500}
                 content={data.node.display_name}

From 374f462f17daf33a4a7fc83a8095459af9c98da9 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Fri, 30 Jun 2023 11:35:52 -0300
Subject: [PATCH 49/51] =?UTF-8?q?=F0=9F=94=A8=20refactor(formModal/index.t?=
 =?UTF-8?q?sx):=20remove=20unused=20MessageSquarePlus=20component=20and=20?=
 =?UTF-8?q?adjust=20styling=20for=20chat=20input=20section?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/modals/formModal/index.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx
index 8b939b967..18434442d 100644
--- a/src/frontend/src/modals/formModal/index.tsx
+++ b/src/frontend/src/modals/formModal/index.tsx
@@ -413,8 +413,7 @@ export default function FormModal({
                     Input Variables
                   </span>
                 </div>
-                <div className="flex py-2 items-center">
-                  <MessageSquarePlus className="w-4 h-4 mr-1 text-primary" />
+                <div className="flex mr-2.5 py-2 items-center">
                   <span className="text-sm font-semibold text-primary">
                     Chat Input
                   </span>

From 562bbe99ee72fd62cb2c18a265456524e01b30ee Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Fri, 30 Jun 2023 11:45:36 -0300
Subject: [PATCH 50/51] Undo Snapshot when importing by drop

---
 .../src/pages/FlowPage/components/PageComponent/index.tsx      | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
index 7deb62571..6c3a5780e 100644
--- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
@@ -283,7 +283,8 @@ export default function Page({ flow }: { flow: FlowType }) {
         }
         setNodes((nds) => nds.concat(newNode));
       } else if (event.dataTransfer.types.some((t) => t === "Files")) {
-        uploadFlow(false, event.dataTransfer.files.item(0))
+        takeSnapshot();
+        uploadFlow(false, event.dataTransfer.files.item(0));
       }
     },
     // Specify dependencies for useCallback

From 356c76b1b21cb16cfb3d771cd494f023917f41af Mon Sep 17 00:00:00 2001
From: Gabriel Luiz Freitas Almeida <gabriel@logspace.ai>
Date: Fri, 30 Jun 2023 11:34:49 -0300
Subject: [PATCH 51/51] =?UTF-8?q?=E2=9C=A8=20feat(constants.tsx):=20update?=
 =?UTF-8?q?=20DESCRIPTIONS,=20ADJECTIVES,=20and=20NOUNS=20arrays=20with=20?=
 =?UTF-8?q?new=20values=20to=20enhance=20variety=20and=20creativity=20in?=
 =?UTF-8?q?=20generated=20text=20The=20DESCRIPTIONS=20array=20has=20been?=
 =?UTF-8?q?=20updated=20with=20additional=20phrases=20to=20provide=20a=20w?=
 =?UTF-8?q?ider=20range=20of=20options=20for=20generating=20text.=20The=20?=
 =?UTF-8?q?ADJECTIVES=20array=20has=20been=20expanded=20with=20more=20desc?=
 =?UTF-8?q?riptive=20words=20to=20add=20more=20color=20and=20personality?=
 =?UTF-8?q?=20to=20the=20generated=20text.=20The=20NOUNS=20array=20has=20b?=
 =?UTF-8?q?een=20enriched=20with=20new=20names=20to=20increase=20the=20div?=
 =?UTF-8?q?ersity=20of=20possible=20flow=20names.=20These=20updates=20aim?=
 =?UTF-8?q?=20to=20enhance=20the=20quality=20and=20creativity=20of=20the?=
 =?UTF-8?q?=20generated=20text=20by=20providing=20a=20greater=20variety=20?=
 =?UTF-8?q?of=20options.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/constants.tsx | 117 ++++++++++++++++++++++++++++++++-
 1 file changed, 115 insertions(+), 2 deletions(-)

diff --git a/src/frontend/src/constants.tsx b/src/frontend/src/constants.tsx
index 76b345ed5..4d634400b 100644
--- a/src/frontend/src/constants.tsx
+++ b/src/frontend/src/constants.tsx
@@ -173,7 +173,7 @@ export const DESCRIPTIONS: string[] = [
   "Your Hub for Text Generation.",
   "Promptly Ingenious!",
   "Building Linguistic Labyrinths.",
-  "LangFlow: Create, Chain, Communicate.",
+  "Create, Chain, Communicate.",
   "Connect the Dots, Craft Language.",
   "Interactive Language Weaving.",
   "Generate, Innovate, Communicate.",
@@ -183,6 +183,46 @@ export const DESCRIPTIONS: string[] = [
   "Nurture NLP Nodes Here.",
   "Conversational Cartography Unlocked.",
   "Design, Develop, Dialogize.",
+  "Unleashing Linguistic Creativity.",
+  "Graph Your Way to Great Conversations.",
+  "The Power of Language at Your Fingertips.",
+  "Sculpting Language with Precision.",
+  "Where Language Meets Logic.",
+  "Building Intelligent Interactions.",
+  "Your Passport to Linguistic Landscapes.",
+  "Create, Curate, Communicate with LangFlow.",
+  "Flow into the Future of Language.",
+  "Mapping Meaningful Conversations.",
+  "Unravel the Art of Articulation.",
+  "Language Engineering Excellence.",
+  "Navigate the Networks of Conversation.",
+  "Crafting Conversations, One Node at a Time.",
+  "The Pinnacle of Prompt Generation.",
+  "Language Models, Mapped and Mastered.",
+  "Powerful Prompts, Perfectly Positioned.",
+  "Innovation in Interaction with LangFlow.",
+  "Your Toolkit for Text Generation.",
+  "Unfolding Linguistic Possibilities.",
+  "Building Powerful Solutions with Language Models.",
+  "Uncover Business Opportunities with NLP.",
+  "Harness the Power of Conversational AI.",
+  "Transform Your Business with Smart Dialogues.",
+  "Craft Meaningful Interactions, Generate Value.",
+  "Unleashing Business Potential through Language Engineering.",
+  "Empowering Enterprises with Intelligent Interactions.",
+  "Driving Innovation in Business Communication.",
+  "Catalyzing Business Growth through Conversational AI.",
+  "Text Generation Meets Business Transformation.",
+  "Navigate the Linguistic Landscape, Discover Opportunities.",
+  "Create Powerful Connections, Boost Business Value.",
+  "Empowering Communication, Enabling Opportunities.",
+  "Advanced NLP for Groundbreaking Business Solutions.",
+  "Innovation in Interaction, Revolution in Revenue.",
+  "Maximize Impact with Intelligent Conversations.",
+  "Beyond Text Generation - Unleashing Business Opportunities.",
+  "Unlock the Power of AI in Your Business Conversations.",
+  "Crafting Dialogues that Drive Business Success.",
+  "Engineered for Excellence, Built for Business.",
 ];
 
 /**
@@ -256,8 +296,49 @@ export const ADJECTIVES: string[] = [
   "thirsty",
   "tiny",
   "trusting",
+  "bubbly",
+  "charming",
+  "cheerful",
+  "comical",
+  "dazzling",
+  "delighted",
+  "dynamic",
+  "effervescent",
+  "enthusiastic",
+  "exuberant",
+  "fluffy",
+  "friendly",
+  "funky",
+  "giddy",
+  "giggly",
+  "gleeful",
+  "goofy",
+  "graceful",
+  "grinning",
+  "hilarious",
+  "inquisitive",
+  "joyous",
+  "jubilant",
+  "lively",
+  "mirthful",
+  "mischievous",
+  "optimistic",
+  "peppy",
+  "perky",
+  "playful",
+  "quirky",
+  "radiant",
+  "sassy",
+  "silly",
+  "spirited",
+  "sprightly",
+  "twinkly",
+  "upbeat",
+  "vibrant",
+  "witty",
+  "zany",
+  "zealous",
 ];
-
 /**
  * Nouns for the name of the flow
  * @constant
@@ -406,6 +487,38 @@ export const NOUNS: string[] = [
   "wright",
   "yalow",
   "yonath",
+  "coulomb",
+  "degrasse",
+  "dewey",
+  "edison",
+  "eratosthenes",
+  "faraday",
+  "galton",
+  "gauss",
+  "herschel",
+  "hubble",
+  "joule",
+  "kaku",
+  "kepler",
+  "khayyam",
+  "lavoisier",
+  "maxwell",
+  "mendel",
+  "mendeleev",
+  "ohm",
+  "pascal",
+  "planck",
+  "riemann",
+  "schrodinger",
+  "sagan",
+  "tesla",
+  "tyson",
+  "volta",
+  "watt",
+  "weber",
+  "wien",
+  "zoBell",
+  "zuse",
 ];
 
 /**