From 9bafb1f5dd68687774d89e00050c6d71a6708304 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Wed, 5 Jun 2024 09:45:17 -0300
Subject: [PATCH] Fixed success alert not appearing at front, and removed alert
 displayed at playground

---
 src/frontend/src/App.tsx                     | 27 ++++++++------------
 src/frontend/src/modals/IOModal/index.tsx    |  1 +
 src/frontend/src/stores/flowStore.ts         | 26 +++++++++++--------
 src/frontend/src/types/zustand/flow/index.ts |  3 ++-
 4 files changed, 29 insertions(+), 28 deletions(-)

diff --git a/src/frontend/src/App.tsx b/src/frontend/src/App.tsx
index 5eee2bfa6..b9e02a27d 100644
--- a/src/frontend/src/App.tsx
+++ b/src/frontend/src/App.tsx
@@ -222,12 +222,19 @@ export default function App() {
                   id={alert.id}
                   removeAlert={removeAlert}
                 />
+              ) : alert.type === "notice" ? (
+                <NoticeAlert
+                  key={alert.id}
+                  title={alert.title}
+                  link={alert.link}
+                  id={alert.id}
+                  removeAlert={removeAlert}
+                />
               ) : (
-                alert.type === "notice" && (
-                  <NoticeAlert
+                alert.type === "success" && (
+                  <SuccessAlert
                     key={alert.id}
                     title={alert.title}
-                    link={alert.link}
                     id={alert.id}
                     removeAlert={removeAlert}
                   />
@@ -236,20 +243,6 @@ export default function App() {
             </div>
           ))}
         </div>
-        <div className="z-40 flex flex-col-reverse">
-          {tempNotificationList.map((alert) => (
-            <div key={alert.id}>
-              {alert.type === "success" && (
-                <SuccessAlert
-                  key={alert.id}
-                  title={alert.title}
-                  id={alert.id}
-                  removeAlert={removeAlert}
-                />
-              )}
-            </div>
-          ))}
-        </div>
       </div>
     </div>
   );
diff --git a/src/frontend/src/modals/IOModal/index.tsx b/src/frontend/src/modals/IOModal/index.tsx
index a3d00e89c..e956c5262 100644
--- a/src/frontend/src/modals/IOModal/index.tsx
+++ b/src/frontend/src/modals/IOModal/index.tsx
@@ -91,6 +91,7 @@ export default function IOModal({
       await buildFlow({
         input_value: chatValue,
         startNodeId: chatInput?.id,
+        silent: true,
       }).catch((err) => {
         console.error(err);
         setLockChat(false);
diff --git a/src/frontend/src/stores/flowStore.ts b/src/frontend/src/stores/flowStore.ts
index ece6fb4e3..d3cbbef6f 100644
--- a/src/frontend/src/stores/flowStore.ts
+++ b/src/frontend/src/stores/flowStore.ts
@@ -430,10 +430,12 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
     startNodeId,
     stopNodeId,
     input_value,
+    silent,
   }: {
     startNodeId?: string;
     stopNodeId?: string;
     input_value?: string;
+    silent?: boolean;
   }) => {
     get().setIsBuilding(true);
     const currentFlow = useFlowsManagerStore.getState().currentFlow;
@@ -536,19 +538,23 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
       startNodeId,
       stopNodeId,
       onGetOrderSuccess: () => {
-        setNoticeData({ title: "Running components" });
+        if (!silent) {
+          setNoticeData({ title: "Running components" });
+        }
       },
       onBuildComplete: (allNodesValid) => {
         const nodeId = startNodeId || stopNodeId;
-        if (nodeId && allNodesValid) {
-          setSuccessData({
-            title: `${
-              get().nodes.find((node) => node.id === nodeId)?.data.node
-                ?.display_name
-            } built successfully`,
-          });
-        } else {
-          setSuccessData({ title: FLOW_BUILD_SUCCESS_ALERT });
+        if (!silent) {
+          if (nodeId && allNodesValid) {
+            setSuccessData({
+              title: `${
+                get().nodes.find((node) => node.id === nodeId)?.data.node
+                  ?.display_name
+              } built successfully`,
+            });
+          } else {
+            setSuccessData({ title: FLOW_BUILD_SUCCESS_ALERT });
+          }
         }
         get().setIsBuilding(false);
       },
diff --git a/src/frontend/src/types/zustand/flow/index.ts b/src/frontend/src/types/zustand/flow/index.ts
index 71ff76f55..bbb68d1c9 100644
--- a/src/frontend/src/types/zustand/flow/index.ts
+++ b/src/frontend/src/types/zustand/flow/index.ts
@@ -106,11 +106,12 @@ export type FlowStoreType = {
     startNodeId,
     stopNodeId,
     input_value,
+    silent,
   }: {
-    nodeId?: string;
     startNodeId?: string;
     stopNodeId?: string;
     input_value?: string;
+    silent?: boolean;
   }) => Promise<void>;
   getFlow: () => { nodes: Node[]; edges: Edge[]; viewport: Viewport };
   updateVerticesBuild: (