From 14be74049c2dd6909e487285278cc4f67b0a6650 Mon Sep 17 00:00:00 2001
From: anovazzi1 <otavio2204@gmail.com>
Date: Tue, 23 Jan 2024 18:11:28 -0300
Subject: [PATCH] refactor(chatComponent): remove unused import and variable
 feat(chatComponent): add dynamic rendering of BuildTrigger component based on
 checkInputAndOutput value fix(chatComponent): update showTrigger state when
 nodes change to reflect changes in checkInputAndOutput value

---
 src/frontend/src/components/chatComponent/index.tsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/frontend/src/components/chatComponent/index.tsx b/src/frontend/src/components/chatComponent/index.tsx
index f007daab1..5d0416ff7 100644
--- a/src/frontend/src/components/chatComponent/index.tsx
+++ b/src/frontend/src/components/chatComponent/index.tsx
@@ -1,10 +1,8 @@
 import { useEffect, useRef, useState } from "react";
-import { useNodes } from "reactflow";
 import { CHAT_FORM_DIALOG_SUBTITLE } from "../../constants/constants";
 import BaseModal from "../../modals/baseModal";
 import useFlowStore from "../../stores/flowStore";
 import { ChatType } from "../../types/chat";
-import { NodeType } from "../../types/flow";
 import IOView from "../IOview";
 import ChatTrigger from "../ViewTriggers/chat";
 import IconComponent from "../genericIconComponent";
@@ -13,9 +11,15 @@ import BuildTrigger from "./buildTrigger";
 export default function Chat({ flow }: ChatType): JSX.Element {
   const [open, setOpen] = useState(false);
   const flowState = useFlowStore((state) => state.flowState);
+  const nodes = useFlowStore((state) => state.nodes);
   const checkInputAndOutput = useFlowStore(
     (state) => state.checkInputAndOutput
   );
+  const [showTrigger, setShowTrigger] = useState(checkInputAndOutput());
+  useEffect(() => {
+    setShowTrigger(checkInputAndOutput());
+  }, [nodes]);
+
   useEffect(() => {
     const handleKeyDown = (event: KeyboardEvent) => {
       if (
@@ -34,13 +38,12 @@ export default function Chat({ flow }: ChatType): JSX.Element {
   }, []);
 
   const prevNodesRef = useRef<any[] | undefined>();
-  const nodes: NodeType[] = useNodes();
 
   return (
     <>
       <div className="flex flex-col">
         <BuildTrigger open={open} flow={flow} />
-        {checkInputAndOutput() && (
+        {showTrigger && (
           <BaseModal open={open} setOpen={setOpen}>
             <BaseModal.Trigger asChild>
               <ChatTrigger />