From 57524d538c27ed1868baeaeb1e618650c1dfb58f Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <62335616+lucaseduoli@users.noreply.github.com>
Date: Mon, 31 Mar 2025 12:00:51 -0300
Subject: [PATCH] fix: update currentflow to be fetched from Flow Store for
 icon to be rendered correctly (#7354)

* Updated current flow to be fetched from FlowStore

* Changed setPlaygroundPage's place because of console error
---
 src/frontend/src/modals/IOModal/new-modal.tsx | 4 +---
 src/frontend/src/pages/Playground/index.tsx   | 8 +++-----
 2 files changed, 4 insertions(+), 8 deletions(-)

diff --git a/src/frontend/src/modals/IOModal/new-modal.tsx b/src/frontend/src/modals/IOModal/new-modal.tsx
index 19cb40aef..8519ab4da 100644
--- a/src/frontend/src/modals/IOModal/new-modal.tsx
+++ b/src/frontend/src/modals/IOModal/new-modal.tsx
@@ -67,10 +67,8 @@ export default function IOModal({
   const currentFlowId = playgroundPage
     ? uuidv5(`${clientId}_${realFlowId}`, uuidv5.DNS)
     : realFlowId;
-  const currentFlow = useFlowsManagerStore((state) => state.currentFlow);
+  const currentFlow = useFlowStore((state) => state.currentFlow);
   const [sidebarOpen, setSidebarOpen] = useState(true);
-  const setPlaygroundPage = useFlowStore((state) => state.setPlaygroundPage);
-  setPlaygroundPage(!!playgroundPage);
 
   const { mutate: deleteSessionFunction } = useDeleteMessages();
   const [visibleSession, setvisibleSession] = useState<string | undefined>(
diff --git a/src/frontend/src/pages/Playground/index.tsx b/src/frontend/src/pages/Playground/index.tsx
index 11ca13c46..59f6ae312 100644
--- a/src/frontend/src/pages/Playground/index.tsx
+++ b/src/frontend/src/pages/Playground/index.tsx
@@ -3,17 +3,13 @@ import { useCustomNavigate } from "@/customization/hooks/use-custom-navigate";
 import { track } from "@/customization/utils/analytics";
 import IOModal from "@/modals/IOModal/new-modal";
 import useFlowStore from "@/stores/flowStore";
-import { useStoreStore } from "@/stores/storeStore";
 import { useUtilityStore } from "@/stores/utilityStore";
 import { CookieOptions, getCookie, setCookie } from "@/utils/utils";
 import { useEffect } from "react";
 import { useParams } from "react-router-dom";
 import { v4 as uuid } from "uuid";
-import { getComponent } from "../../controllers/API";
 import useFlowsManagerStore from "../../stores/flowsManagerStore";
-import cloneFLowWithParent, {
-  getInputsAndOutputs,
-} from "../../utils/storeUtils";
+import { getInputsAndOutputs } from "../../utils/storeUtils";
 export default function PlaygroundPage() {
   const setCurrentFlow = useFlowsManagerStore((state) => state.setCurrentFlow);
   const currentSavedFlow = useFlowsManagerStore((state) => state.currentFlow);
@@ -26,6 +22,7 @@ export default function PlaygroundPage() {
 
   const currentFlowId = useFlowsManagerStore((state) => state.currentFlowId);
   const setIsLoading = useFlowsManagerStore((state) => state.setIsLoading);
+  const setPlaygroundPage = useFlowStore((state) => state.setPlaygroundPage);
 
   async function getFlowData() {
     try {
@@ -56,6 +53,7 @@ export default function PlaygroundPage() {
 
   useEffect(() => {
     if (id) track("Playground Page Loaded", { flowId: id });
+    setPlaygroundPage(true);
   }, []);
 
   useEffect(() => {