diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
index a7ad0e16c..8c2332a2d 100644
--- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
@@ -363,7 +363,7 @@ export default function Page({
 
   return (
     <div className="flex h-full overflow-hidden">
-      {view && <ExtraSidebar />}
+      {!view && <ExtraSidebar />}
       {/* Main area */}
       <main className="flex flex-1">
         {/* Primary column */}
@@ -372,63 +372,47 @@ export default function Page({
             {Object.keys(templates).length > 0 &&
             Object.keys(types).length > 0 ? (
               <div className="h-full w-full">
-                {view ? (
-                  <ReactFlow
-                    nodes={nodes}
-                    edges={edges}
-                    className="theme-attribution"
-                    minZoom={0.01}
-                    maxZoom={8}
-                  >
-                    <Background className="" />
-                    <Controls
-                      className="bg-muted fill-foreground stroke-foreground text-primary
-                 [&>button]:border-b-border hover:[&>button]:bg-border"
-                    ></Controls>
-                  </ReactFlow>
-                ) : (
-                  <ReactFlow
-                    nodes={nodes}
-                    onMove={() => {
-                      if (reactFlowInstance)
-                        updateFlow({
-                          ...flow,
-                          data: reactFlowInstance.toObject(),
-                        });
-                    }}
-                    edges={edges}
-                    onNodesChange={onNodesChangeMod}
-                    onEdgesChange={onEdgesChangeMod}
-                    onConnect={onConnect}
-                    disableKeyboardA11y={true}
-                    onLoad={setReactFlowInstance}
-                    onInit={setReactFlowInstance}
-                    nodeTypes={nodeTypes}
-                    onEdgeUpdate={onEdgeUpdate}
-                    onEdgeUpdateStart={onEdgeUpdateStart}
-                    onEdgeUpdateEnd={onEdgeUpdateEnd}
-                    onNodeDragStart={onNodeDragStart}
-                    onSelectionDragStart={onSelectionDragStart}
-                    onSelectionEnd={onSelectionEnd}
-                    onSelectionStart={onSelectionStart}
-                    onEdgesDelete={onEdgesDelete}
-                    connectionLineComponent={ConnectionLineComponent}
-                    onDragOver={onDragOver}
-                    onDrop={onDrop}
-                    onNodesDelete={onDelete}
-                    onSelectionChange={onSelectionChange}
-                    className="theme-attribution"
-                    minZoom={0.01}
-                    maxZoom={8}
-                  >
-                    <Background className="" />
-                    <Controls
-                      className="bg-muted fill-foreground stroke-foreground text-primary
+                <ReactFlow
+                  nodes={nodes}
+                  onMove={() => {
+                    if (reactFlowInstance)
+                      updateFlow({
+                        ...flow,
+                        data: reactFlowInstance.toObject(),
+                      });
+                  }}
+                  edges={edges}
+                  onNodesChange={onNodesChangeMod}
+                  onEdgesChange={onEdgesChangeMod}
+                  onConnect={onConnect}
+                  disableKeyboardA11y={true}
+                  onLoad={setReactFlowInstance}
+                  onInit={setReactFlowInstance}
+                  nodeTypes={nodeTypes}
+                  onEdgeUpdate={onEdgeUpdate}
+                  onEdgeUpdateStart={onEdgeUpdateStart}
+                  onEdgeUpdateEnd={onEdgeUpdateEnd}
+                  onNodeDragStart={onNodeDragStart}
+                  onSelectionDragStart={onSelectionDragStart}
+                  onSelectionEnd={onSelectionEnd}
+                  onSelectionStart={onSelectionStart}
+                  onEdgesDelete={onEdgesDelete}
+                  connectionLineComponent={ConnectionLineComponent}
+                  onDragOver={onDragOver}
+                  onDrop={onDrop}
+                  onNodesDelete={onDelete}
+                  onSelectionChange={onSelectionChange}
+                  className="theme-attribution"
+                  minZoom={0.01}
+                  maxZoom={8}
+                >
+                  <Background className="" />
+                  <Controls
+                    className="bg-muted fill-foreground stroke-foreground text-primary
                    [&>button]:border-b-border hover:[&>button]:bg-border"
-                    ></Controls>
-                  </ReactFlow>
-                )}
-                {view && (
+                  ></Controls>
+                </ReactFlow>
+                {!view && (
                   <Chat flow={flow} reactFlowInstance={reactFlowInstance} />
                 )}
               </div>
diff --git a/src/frontend/src/pages/FlowPage/index.tsx b/src/frontend/src/pages/FlowPage/index.tsx
index 92ebc6775..3555da2fa 100644
--- a/src/frontend/src/pages/FlowPage/index.tsx
+++ b/src/frontend/src/pages/FlowPage/index.tsx
@@ -29,7 +29,7 @@ export default function FlowPage() {
         {flows.length > 0 &&
           tabId !== "" &&
           flows.findIndex((flow) => flow.id === tabId) !== -1 && (
-            <Page view flow={flows.find((flow) => flow.id === tabId)} />
+            <Page flow={flows.find((flow) => flow.id === tabId)} />
           )}
         <a
           target={"_blank"}
diff --git a/src/frontend/src/pages/ViewPage/index.tsx b/src/frontend/src/pages/ViewPage/index.tsx
index f7e484217..3d23b3fe6 100644
--- a/src/frontend/src/pages/ViewPage/index.tsx
+++ b/src/frontend/src/pages/ViewPage/index.tsx
@@ -26,7 +26,7 @@ export default function ViewPage() {
       {flows.length > 0 &&
         tabId !== "" &&
         flows.findIndex((flow) => flow.id === tabId) !== -1 && (
-          <Page flow={flows.find((flow) => flow.id === tabId)} />
+          <Page view flow={flows.find((flow) => flow.id === tabId)} />
         )}
     </div>
   );