Merge branch 'dev' into new_icons

src/backend/langflow/config.yaml

@@ -42,17 +42,20 @@ documentloaders:
   - IMSDbLoader
   - GitbookLoader
   - ReadTheDocsLoader
+  - SlackDirectoryLoader
   - NotionDirectoryLoader
 embeddings:
   - OpenAIEmbeddings
   - HuggingFaceEmbeddings
-
+  - CohereEmbeddings
 llms:
   - OpenAI
   # - AzureOpenAI
   - ChatOpenAI
   - HuggingFaceHub
   - LlamaCpp
+  - CTransformers
+  - Cohere
 memories:
   - ConversationBufferMemory
   - ConversationSummaryMemory
@@ -117,7 +120,7 @@ vectorstores:
   - Qdrant
   - Weaviate
 wrappers:
-  - RequestsWrapper # Wait more tests
+  - RequestsWrapper
   # - ChatPromptTemplate
   # - SystemMessagePromptTemplate
   # - HumanMessagePromptTemplate

src/backend/langflow/interface/base.py

@@ -53,30 +53,33 @@ class LangChainTypeCreator(BaseModel, ABC):
         signature = self.get_signature(name)
         if signature is None:
             logger.error(f"Node {name} not loaded")
-            return None
-        if isinstance(signature, FrontendNode):
             return signature
-        fields = [
-            TemplateField(
-                name=key,
-                field_type=value["type"],
-                required=value.get("required", False),
-                placeholder=value.get("placeholder", ""),
-                is_list=value.get("list", False),
-                show=value.get("show", True),
-                multiline=value.get("multiline", False),
-                value=value.get("value", None),
-                suffixes=value.get("suffixes", []),
-                file_types=value.get("fileTypes", []),
-                content=value.get("content", None),
+        if not isinstance(signature, FrontendNode):
+            fields = [
+                TemplateField(
+                    name=key,
+                    field_type=value["type"],
+                    required=value.get("required", False),
+                    placeholder=value.get("placeholder", ""),
+                    is_list=value.get("list", False),
+                    show=value.get("show", True),
+                    multiline=value.get("multiline", False),
+                    value=value.get("value", None),
+                    suffixes=value.get("suffixes", []),
+                    file_types=value.get("fileTypes", []),
+                    content=value.get("content", None),
+                )
+                for key, value in signature["template"].items()
+                if key != "_type"
+            ]
+            template = Template(type_name=name, fields=fields)
+            signature = self.frontend_node_class(
+                template=template,
+                description=signature.get("description", ""),
+                base_classes=signature["base_classes"],
+                name=name,
             )
-            for key, value in signature["template"].items()
-            if key != "_type"
-        ]
-        template = Template(type_name=name, fields=fields)
-        return self.frontend_node_class(
-            template=template,
-            description=signature.get("description", ""),
-            base_classes=signature["base_classes"],
-            name=name,
-        )
+
+        signature.add_extra_fields()
+
+        return signature

src/backend/langflow/interface/document_loaders/base.py

@@ -89,6 +89,9 @@ class DocumentLoaderCreator(LangChainTypeCreator):
                 "UnstructuredWordDocumentLoader": build_file_path_template(
                     suffixes=[".docx", ".doc"], fileTypes=["docx", "doc"]
                 ),
+                "SlackDirectoryLoader": build_file_path_template(
+                    suffixes=[".zip"], fileTypes=["zip"]
+                ),
             }
 
             if name in file_path_templates:

src/backend/langflow/template/frontend_node/base.py

@@ -24,6 +24,9 @@ class FrontendNode(BaseModel):
             }
         }
 
+    def add_extra_fields(self) -> None:
+        pass
+
     @staticmethod
     def format_field(field: TemplateField, name: Optional[str] = None) -> None:
         """Formats a given field based on its attributes and value."""

src/backend/langflow/template/frontend_node/llms.py

@@ -43,7 +43,7 @@ class LLMFrontendNode(FrontendNode):
             field.field_type = "code"
             field.advanced = True
             field.show = True
-        elif field.name in ["model_name", "temperature"]:
+        elif field.name in ["model_name", "temperature", "model_file", "model_type"]:
             field.advanced = False
             field.show = True
 

src/backend/langflow/template/frontend_node/vectorstores.py

@@ -5,6 +5,21 @@ from langflow.template.frontend_node.base import FrontendNode
 
 
 class VectorStoreFrontendNode(FrontendNode):
+    def add_extra_fields(self) -> None:
+        if self.template.type_name == "Weaviate":
+            extra_field = TemplateField(
+                name="weaviate_url",
+                field_type="str",
+                required=True,
+                placeholder="http://localhost:8080",
+                show=True,
+                advanced=False,
+                multiline=False,
+                value="http://localhost:8080",
+            )
+
+            self.template.add_field(extra_field)
+
     @staticmethod
     def format_field(field: TemplateField, name: Optional[str] = None) -> None:
         FrontendNode.format_field(field, name)

src/backend/langflow/template/template/base.py

@@ -23,3 +23,6 @@ class Template(BaseModel):
         result = {field.name: field.to_dict() for field in self.fields}
         result["_type"] = self.type_name  # type: ignore
         return result
+
+    def add_field(self, field: TemplateField) -> None:
+        self.fields.append(field)

src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx

@@ -119,6 +119,7 @@ export default function ParameterComponent({
             ) : (
               <InputComponent
                 disabled={disabled}
+                disableCopyPaste={true}
                 password={data.node.template[name].password ?? false}
                 value={data.node.template[name].value ?? ""}
                 onChange={(t) => {

src/frontend/src/CustomNodes/GenericNode/index.tsx

@@ -11,7 +11,13 @@ import {
   ExclamationCircleIcon,
 } from "@heroicons/react/24/solid";
 
-import { classNames, nodeColors, nodeIcons, toNormalCase, toTitleCase } from "../../utils";
+import {
+  classNames,
+  nodeColors,
+  nodeIcons,
+  toNormalCase,
+  toTitleCase,
+} from "../../utils";
 import ParameterComponent from "./components/parameterComponent";
 import { typesContext } from "../../contexts/typesContext";
 import { useContext, useState, useEffect, useRef, Fragment } from "react";
@@ -107,7 +113,7 @@ export default function GenericNode({
             }}
           />
           <Tooltip title={data.type} placement="top">
-              <div className="ml-2 truncate">{data.type}</div>
+            <div className="ml-2 truncate">{data.type}</div>
           </Tooltip>
           <div>
             <Tooltip

src/frontend/src/components/inputComponent/index.tsx

@@ -6,11 +6,13 @@ import { TabsContext } from "../../contexts/tabsContext";
 export default function InputComponent({
   value,
   onChange,
+  disableCopyPaste = false,
   disabled,
   password,
 }: InputComponentType) {
   const [myValue, setMyValue] = useState(value ?? "");
   const [pwdVisible, setPwdVisible] = useState(false);
+  const { setDisableCopyPaste } = useContext(TabsContext);
   useEffect(() => {
     if (disabled) {
       setMyValue("");
@@ -27,6 +29,12 @@ export default function InputComponent({
     >
       <input
         value={myValue}
+        onFocus={() => {
+          if (disableCopyPaste) setDisableCopyPaste(true);
+        }}
+        onBlur={() => {
+          if (disableCopyPaste) setDisableCopyPaste(false);
+        }}
         className={classNames(
           "block w-full pr-12 form-input dark:bg-gray-900 dark:border-gray-600 rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm",
           disabled ? " bg-gray-200 dark:bg-gray-700" : "",

src/frontend/src/contexts/tabsContext.tsx

@@ -87,6 +87,19 @@ export function TabsProvider({ children }: { children: ReactNode }) {
       cookieObject.flows.forEach((flow) => {
         flow.data.nodes.forEach((node) => {
           if (Object.keys(templates[node.data.type]["template"]).length > 0) {
+            node.data.node.base_classes =
+              templates[node.data.type]["base_classes"];
+            flow.data.edges.forEach((edge) => {
+              if (edge.source === node.id) {
+                edge.sourceHandle = edge.sourceHandle
+                  .split("|")
+                  .slice(0, 2)
+                  .concat(templates[node.data.type]["base_classes"])
+                  .join("|");
+              }
+            });
+            node.data.node.description =
+              templates[node.data.type]["description"];
             node.data.node.template = updateTemplate(
               templates[node.data.type][
                 "template"
@@ -276,6 +289,18 @@ export function TabsProvider({ children }: { children: ReactNode }) {
     if (data) {
       data.nodes.forEach((node) => {
         if (Object.keys(templates[node.data.type]["template"]).length > 0) {
+          node.data.node.base_classes =
+            templates[node.data.type]["base_classes"];
+          flow.data.edges.forEach((edge) => {
+            if (edge.source === node.id) {
+              edge.sourceHandle = edge.sourceHandle
+                .split("|")
+                .slice(0, 2)
+                .concat(templates[node.data.type]["base_classes"])
+                .join("|");
+            }
+          });
+          node.data.node.description = templates[node.data.type]["description"];
           node.data.node.template = updateTemplate(
             templates[node.data.type]["template"] as unknown as APITemplateType,
             node.data.node.template as APITemplateType

src/frontend/src/modals/NodeModal/components/ModalField/index.tsx

@@ -12,7 +12,15 @@ import PromptAreaComponent from "../../../../components/promptComponent";
 import CodeAreaComponent from "../../../../components/codeAreaComponent";
 import { classNames } from "../../../../utils";
 
-export default function ModalField({ data, title, required, id, name, type }) {
+export default function ModalField({
+  data,
+  title,
+  required,
+  id,
+  name,
+  type,
+  index,
+}) {
   const { save } = useContext(TabsContext);
   const [enabled, setEnabled] = useState(
     data.node.template[name]?.value ?? false
@@ -30,7 +38,17 @@ export default function ModalField({ data, title, required, id, name, type }) {
     <div
       className={classNames(
         "flex flex-row w-full items-center justify-between",
-        display ? "" : "hidden"
+        display ? "" : "hidden",
+        Object.keys(data.node.template).filter(
+          (t) =>
+            t.charAt(0) !== "_" &&
+            data.node.template[t].advanced &&
+            data.node.template[t].show
+        ).length -
+          1 ===
+          index
+          ? "pb-4"
+          : ""
       )}
     >
       {display && (

src/frontend/src/modals/NodeModal/index.tsx

@@ -3,7 +3,14 @@ import { XMarkIcon } from "@heroicons/react/24/outline";
 import { Fragment, useContext, useRef, useState } from "react";
 import { PopUpContext } from "../../contexts/popUpContext";
 import { NodeDataType } from "../../types/flow";
-import { nodeColors, nodeIcons, toNormalCase, toTitleCase } from "../../utils";
+import {
+  classNames,
+  limitScrollFieldsModal,
+  nodeColors,
+  nodeIcons,
+  toNormalCase,
+  toTitleCase,
+} from "../../utils";
 import { typesContext } from "../../contexts/typesContext";
 import ModalField from "./components/ModalField";
 
@@ -84,8 +91,20 @@ export default function NodeModal({ data }: { data: NodeDataType }) {
                     </div>
                   </div>
                   <div className="h-full w-full bg-gray-200 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 sm:p-4  w-full rounded-lg bg-white dark:bg-gray-800 shadow">
+                    <div className="flex w-full h-[445px]">
+                      <div
+                        className={classNames(
+                          "px-4 sm:p-4 w-full rounded-lg bg-white dark:bg-gray-800 shadow",
+                          Object.keys(data.node.template).filter(
+                            (t) =>
+                              t.charAt(0) !== "_" &&
+                              data.node.template[t].advanced &&
+                              data.node.template[t].show
+                          ).length > limitScrollFieldsModal
+                            ? "overflow-scroll overflow-x-hidden custom-scroll"
+                            : "overflow-hidden"
+                        )}
+                      >
                         <div className="flex flex-col h-full gap-5">
                           {Object.keys(data.node.template)
                             .filter(
@@ -116,6 +135,7 @@ export default function NodeModal({ data }: { data: NodeDataType }) {
                                   }
                                   name={t}
                                   type={data.node.template[t].type}
+                                  index={idx}
                                 />
                               );
                             })}

src/frontend/src/modals/genericModal/index.tsx

@@ -11,7 +11,7 @@ export default function PromptAreaModal({
   setValue,
   buttonText,
   modalTitle,
-  type
+  type,
 }: {
   setValue: (value: string) => void;
   value: string;
@@ -121,40 +121,41 @@ export default function PromptAreaModal({
                         switch (myModalType) {
                           case 1:
                             setModalOpen(false);
-                          break;
+                            break;
                           case 2:
                             checkPrompt(myValue)
-                            .then((apiReturn) => {
-                              if (apiReturn.data) {
-                                let inputVariables =
-                                  apiReturn.data.input_variables;
-                                if (inputVariables.length === 0) {
+                              .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:
-                                      "The template you are attempting to use does not contain any variables for data entry.",
+                                      "Something went wrong, please try again",
                                   });
-                                } 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],
                                 });
-                              }
-                            })
-                            .catch((error) => {
-                              return setErrorData({
-                                title:
-                                  "There is something wrong with this prompt, please review it",
-                                list: [error.response.data.detail],
                               });
-                            });
-                          break;
-                        
+                            break;
+
                           default:
                             break;
                         }

src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx

@@ -34,7 +34,7 @@ export default function ExtraSidebar() {
               {Object.keys(data[d])
                 .sort()
                 .map((t: string, k) => (
-                  <Tooltip title={t.length > 21 ? t : ''} placement="right">
+                  <Tooltip title={t.length > 21 ? t : ""} placement="right">
                     <div key={k}>
                       <div
                         draggable

src/frontend/src/pages/FlowPage/index.tsx

@@ -317,10 +317,8 @@ export default function FlowPage({ flow }: { flow: FlowType }) {
             onPaneClick={() => {
               setDisableCopyPaste(false);
             }}
-            onNodeClick={() => {
-              setDisableCopyPaste(true);
-            }}
             onPaneMouseLeave={() => {
+              console.log("saiu o mouse");
               setDisableCopyPaste(true);
             }}
             onNodesChange={onNodesChange}

src/frontend/src/types/components/index.ts

@@ -10,6 +10,7 @@ export type InputComponentType = {
   disabled?: boolean;
   onChange: (value: string) => void;
   password: boolean;
+  disableCopyPaste?: boolean;
 };
 export type ToggleComponentType = {
   enabled: boolean;

src/frontend/src/utils.ts

@@ -21,14 +21,17 @@ import { FlowType } from "./types/flow";
 import { APITemplateType, TemplateVariableType } from "./types/api";
 import _ from "lodash";
 import { ChromaIcon } from "./icons";
+import { v4 as uuidv4 } from "uuid";
 
 export function classNames(...classes: Array<string>) {
   return classes.filter(Boolean).join(" ");
 }
 
+export const limitScrollFieldsModal = 7;
+
 export enum TypeModal {
   TEXT = 1,
-  PROMPT = 2 
+  PROMPT = 2,
 }
 
 export const textColors = {
@@ -501,33 +504,62 @@ export const programmingLanguages: languageMap = {
 };
 
 export function toTitleCase(str: string) {
-	let result = str
-		.split("_")
-		.map((word, index) => {
-			if (index === 0) {
+  let result = str
+    .split("_")
+    .map((word, index) => {
+      if (index === 0) {
+        return checkUpperWords(
+          word[0].toUpperCase() + word.slice(1).toLowerCase()
+        );
+      }
+      return checkUpperWords(word.toLowerCase());
+    })
+    .join(" ");
 
-				return checkUpperWords(word[0].toUpperCase() + word.slice(1).toLowerCase());
-			}
-			return checkUpperWords(word.toLowerCase());
-		})
-		.join(" ");
-
-	return result
-		.split("-")
-		.map((word, index) => {
-			if (index === 0) {
-				return checkUpperWords(word[0].toUpperCase() + word.slice(1).toLowerCase());
-			}
-			return checkUpperWords(word.toLowerCase());
-		})
-		.join(" ");
+  return result
+    .split("-")
+    .map((word, index) => {
+      if (index === 0) {
+        return checkUpperWords(
+          word[0].toUpperCase() + word.slice(1).toLowerCase()
+        );
+      }
+      return checkUpperWords(word.toLowerCase());
+    })
+    .join(" ");
 }
 
 export const upperCaseWords: string[] = ["llm", "uri"];
 export function checkUpperWords(str: string) {
-  const words = str.split(' ').map((word) => {
-    return upperCaseWords.includes(word.toLowerCase()) ? word.toUpperCase() : word[0].toUpperCase() + word.slice(1).toLowerCase();
+  const words = str.split(" ").map((word) => {
+    return upperCaseWords.includes(word.toLowerCase())
+      ? word.toUpperCase()
+      : word[0].toUpperCase() + word.slice(1).toLowerCase();
   });
 
-  return words.join(' ');
-}
+  return words.join(" ");
+}
+
+export function updateIds(newFLow: FlowType, baseFlow: FlowType) {
+  newFLow.data.nodes.forEach((node) => {
+    while (baseFlow.data.nodes.some((n) => n.id === node.id)) {
+      const newId = uuidv4();
+      newFLow.data.edges.forEach((edge) => {
+        if (edge.source === node.id) {
+          edge.source = newId;
+        }
+        if (edge.target === node.id) {
+          edge.target = newId;
+        }
+        const index = edge.id.split("|").findIndex((e) => e === node.id);
+        if (index != -1) {
+          let tempList = edge.id.split("|");
+          tempList[index] = newId;
+          edge.id = tempList.concat(newId).join("|");
+        }
+        node.id = newId;
+      });
+    }
+  });
+  return newFLow;
+}