From 53629398b4344ae760f159d8ff9af55f77bdf50b Mon Sep 17 00:00:00 2001
From: igorrCarvalho <igorsilvabhz6@gmail.com>
Date: Thu, 25 Jan 2024 12:08:16 -0300
Subject: [PATCH] Refactor: Change inputTypes and outputTypes to a only object
 array

---
 src/frontend/src/components/IOview/index.tsx   |  6 ++++--
 .../src/components/newChatView/index.tsx       |  9 ++++++---
 src/frontend/src/stores/flowStore.ts           | 18 ++++++------------
 src/frontend/src/types/zustand/flow/index.ts   |  6 ++----
 4 files changed, 18 insertions(+), 21 deletions(-)

diff --git a/src/frontend/src/components/IOview/index.tsx b/src/frontend/src/components/IOview/index.tsx
index 7cba3b23a..a01988fd4 100644
--- a/src/frontend/src/components/IOview/index.tsx
+++ b/src/frontend/src/components/IOview/index.tsx
@@ -10,8 +10,10 @@ import { Badge } from "../ui/badge";
 import { Textarea } from "../ui/textarea";
 
 export default function IOView(): JSX.Element {
-  const inputIds = useFlowStore((state) => state.inputIds);
-  const outputIds = useFlowStore((state) => state.outputIds);
+  const inputs = useFlowStore((state) => state.inputs);
+  const outputs = useFlowStore((state) => state.outputs);
+  const inputIds = inputs.map((obj) => obj.id);
+  const outputIds = outputs.map((obj) => obj.id);
   const nodes = useFlowStore((state) => state.nodes);
   const setNode = useFlowStore((state) => state.setNode);
   const options = inputIds.concat(outputIds);
diff --git a/src/frontend/src/components/newChatView/index.tsx b/src/frontend/src/components/newChatView/index.tsx
index 6de401468..a6158d96c 100644
--- a/src/frontend/src/components/newChatView/index.tsx
+++ b/src/frontend/src/components/newChatView/index.tsx
@@ -20,9 +20,8 @@ export default function newChatView(): JSX.Element {
   const [chatHistory, setChatHistory] = useState<ChatMessageType[]>([]);
   const {
     flowPool,
-    outputIds,
-    inputIds,
-    inputTypes,
+    outputs,
+    inputs,
     getNode,
     setNode,
     buildFlow,
@@ -33,6 +32,10 @@ export default function newChatView(): JSX.Element {
   const [lockChat, setLockChat] = useState(false);
   const messagesRef = useRef<HTMLDivElement | null>(null);
 
+  const inputTypes = inputs.map((obj) => obj.type);
+  const inputIds = inputs.map((obj) => obj.id);
+  const outputIds = outputs.map((obj) => obj.id)
+
   //build chat history
   useEffect(() => {
     const chatOutputResponses: FlowPoolObjectType[] = [];
diff --git a/src/frontend/src/stores/flowStore.ts b/src/frontend/src/stores/flowStore.ts
index 01b4acaea..f74bd5576 100644
--- a/src/frontend/src/stores/flowStore.ts
+++ b/src/frontend/src/stores/flowStore.ts
@@ -39,10 +39,8 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
   reactFlowInstance: null,
   lastCopiedSelection: null,
   flowPool: {},
-  outputTypes: [],
-  inputTypes: [],
-  inputIds: [],
-  outputIds: [],
+  inputs: [],
+  outputs: [],
   setFlowPool: (flowPool) => {
     set({ flowPool });
   },
@@ -68,10 +66,8 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
       nodes,
       edges: newEdges,
       flowState: undefined,
-      inputIds: inputs.map((input) => input.id),
-      outputIds: outputs.map((output) => output.id),
-      inputTypes: inputs.map((input) => input.type),
-      outputTypes: outputs.map((output) => output.type),
+      inputs,
+      outputs,
       hasIO: inputs.length > 0 && outputs.length > 0,
     });
     get().reactFlowInstance!.setViewport(viewport);
@@ -111,10 +107,8 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
       edges: newEdges,
       nodes: newChange,
       flowState: undefined,
-      inputIds: inputs.map((input) => input.id),
-      outputIds: outputs.map((output) => output.id),
-      inputTypes: inputs.map((input) => input.type),
-      outputTypes: outputs.map((output) => output.type),
+      inputs,
+      outputs,
       hasIO: inputs.length > 0 && outputs.length > 0,
     });
 
diff --git a/src/frontend/src/types/zustand/flow/index.ts b/src/frontend/src/types/zustand/flow/index.ts
index 69e59c08d..514954fbf 100644
--- a/src/frontend/src/types/zustand/flow/index.ts
+++ b/src/frontend/src/types/zustand/flow/index.ts
@@ -35,11 +35,9 @@ export type FlowPoolType = {
 
 export type FlowStoreType = {
   flowPool: FlowPoolType;
-  inputTypes: string[];
-  outputTypes: string[];
-  inputIds: string[];
+  inputs: Array<{ type: string; id: string; }>;
+  outputs: Array<{ type: string; id: string; }>;
   hasIO: boolean;
-  outputIds: string[];
   setFlowPool: (flowPool: FlowPoolType) => void;
   addDataToFlowPool: (data: any, nodeId: string) => void;
   CleanFlowPool: () => void;