diff --git a/space_flow/src/pages/FlowPage/flowManager/index.tsx b/space_flow/src/pages/FlowPage/flowManager/index.tsx
index f82571da8..18e8551df 100644
--- a/space_flow/src/pages/FlowPage/flowManager/index.tsx
+++ b/space_flow/src/pages/FlowPage/flowManager/index.tsx
@@ -1,10 +1,8 @@
-import { useContext, useEffect, useState } from "react";
-import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
+import { useContext, useEffect } from "react";
 import { ReactFlowProvider } from "reactflow";
 import FlowPage from "..";
 import { TabsContext } from "../../../contexts/tabsContext";
 import TabComponent from "./tabComponent";
-import { PlusIcon } from "@heroicons/react/24/outline";
 var _ = require("lodash");
 
 export function TabsManager() {
diff --git a/space_flow/src/pages/FlowPage/flowManager/tabComponent/index.tsx b/space_flow/src/pages/FlowPage/flowManager/tabComponent/index.tsx
index 9b407b197..0e0728781 100644
--- a/space_flow/src/pages/FlowPage/flowManager/tabComponent/index.tsx
+++ b/space_flow/src/pages/FlowPage/flowManager/tabComponent/index.tsx
@@ -13,7 +13,7 @@ export default function TabComponent({ selected, flow, onClick }) {
       {flow ? (
         !selected ? (
           <div
-            className="flex justify-between select-none truncate w-44 items-center px-4 my-2 mt-3 border-x border-t border-t-transparent border-gray-300 -ml-px"
+            className="flex justify-between select-none truncate w-44 items-center px-4 my-1.5 border-x border-t border-t-transparent border-gray-300 -ml-px"
             onClick={onClick}
           >
             {flow.name}
@@ -23,11 +23,11 @@ export default function TabComponent({ selected, flow, onClick }) {
                 removeFlow(flow.id);
               }}
             >
-              <XMarkIcon className="h-4" />
+              <XMarkIcon className="h-4 hover:bg-white rounded-full" />
             </button>
           </div>
         ) : (
-          <div className="bg-white flex select-none justify-between w-44 items-center pt-3 border border-b-0 border-gray-300 px-4 py-2 rounded-t-xl -ml-px">
+          <div className="bg-white flex select-none justify-between w-44 items-center border border-b-0 border-gray-300 px-4 py-1.5 rounded-t-xl -ml-px">
             {isRename ? (
               <input
                 autoFocus
@@ -61,17 +61,17 @@ export default function TabComponent({ selected, flow, onClick }) {
                 removeFlow(flow.id);
               }}
             >
-              <XMarkIcon className="h-4" />
+              <XMarkIcon className="h-4 hover:bg-gray-100 rounded-full" />
             </button>
           </div>
         )
       ) : (
-        <div className="h-full py-2 pt-3 flex justify-center items-center">
+        <div className="h-full py-1.5 flex justify-center items-center">
           <button
-            className="px-3 flex items-center h-full mb-1 border-gray-300 -ml-px border-t border-t-transparent"
+            className="px-3 flex items-center h-full pb-0.5 pt-0.5 border-gray-300 -ml-px border-t border-t-transparent"
             onClick={onClick}
           >
-            <PlusIcon className="h-5" />
+            <PlusIcon className="h-5 rounded-full hover:bg-white" />
           </button>
         </div>
       )}
diff --git a/space_flow/src/pages/FlowPage/index.tsx b/space_flow/src/pages/FlowPage/index.tsx
index b3bd00539..38544d576 100644
--- a/space_flow/src/pages/FlowPage/index.tsx
+++ b/space_flow/src/pages/FlowPage/index.tsx
@@ -51,7 +51,7 @@ export default function FlowPage({flow}) {
     if(flow?.data && reactFlowInstance){
       setViewport(flow.data.viewport)
     }
-  },[nodes,edges,flow,])
+  },[nodes, edges, flow, reactFlowInstance, setViewport])
 
   useEffect(()=>{
     if(reactFlowInstance && flow){