From 4f56de600209c811d4bba90e3c36c7cc0560be81 Mon Sep 17 00:00:00 2001
From: Emir Karabeg <emirkarabeg@berkeley.edu>
Date: Fri, 31 Jan 2025 17:44:22 -0800
Subject: [PATCH] Added console open state and made it open on run

---
 app/w/components/console/console.tsx  | 10 ++++++----
 app/w/hooks/use-workflow-execution.ts | 11 +++++++++--
 stores/console/store.ts               |  5 +++++
 stores/console/types.ts               |  2 ++
 4 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/app/w/components/console/console.tsx b/app/w/components/console/console.tsx
index fd4497bcc7..34e609ae69 100644
--- a/app/w/components/console/console.tsx
+++ b/app/w/components/console/console.tsx
@@ -14,9 +14,11 @@ import { useWorkflowRegistry } from '@/stores/workflow/registry'
 import { ConsoleEntry } from './components/console-entry/console-entry'
 
 export function Console() {
-  const [isCollapsed, setIsCollapsed] = useState(true)
   const [width, setWidth] = useState(336) // 84 * 4 = 336px (default width)
   const [isDragging, setIsDragging] = useState(false)
+
+  const isOpen = useConsoleStore((state) => state.isOpen)
+  const toggleConsole = useConsoleStore((state) => state.toggleConsole)
   const entries = useConsoleStore((state) => state.entries)
   const clearConsole = useConsoleStore((state) => state.clearConsole)
   const { activeWorkflowId } = useWorkflowRegistry()
@@ -53,12 +55,12 @@ export function Console() {
     }
   }, [isDragging])
 
-  if (isCollapsed) {
+  if (!isOpen) {
     return (
       <Tooltip>
         <TooltipTrigger asChild>
           <button
-            onClick={() => setIsCollapsed(false)}
+            onClick={toggleConsole}
             className="fixed right-4 bottom-[18px] z-10 flex h-9 w-9 items-center justify-center rounded-lg bg-background text-muted-foreground transition-colors hover:text-foreground hover:bg-accent border"
           >
             <Terminal className="h-5 w-5" />
@@ -110,7 +112,7 @@ export function Console() {
         <Tooltip>
           <TooltipTrigger asChild>
             <button
-              onClick={() => setIsCollapsed(true)}
+              onClick={toggleConsole}
               className="absolute left-4 bottom-[18px] flex h-9 w-9 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:text-foreground hover:bg-accent"
             >
               <PanelLeftClose className="h-5 w-5" />
diff --git a/app/w/hooks/use-workflow-execution.ts b/app/w/hooks/use-workflow-execution.ts
index c6bdbd0a9b..76f3757886 100644
--- a/app/w/hooks/use-workflow-execution.ts
+++ b/app/w/hooks/use-workflow-execution.ts
@@ -13,10 +13,17 @@ export function useWorkflowExecution() {
   const { blocks, edges } = useWorkflowStore()
   const { activeWorkflowId } = useWorkflowRegistry()
   const { addNotification } = useNotificationStore()
-  const { addConsole } = useConsoleStore()
+  const { addConsole, toggleConsole, isOpen } = useConsoleStore()
 
   const handleRunWorkflow = useCallback(async () => {
+    if (!activeWorkflowId) return
     setIsExecuting(true)
+
+    // Open console if it's not already open
+    if (!isOpen) {
+      toggleConsole()
+    }
+
     try {
       // Extract existing block states
       const currentBlockStates = Object.entries(blocks).reduce((acc, [id, block]) => {
@@ -97,7 +104,7 @@ export function useWorkflowExecution() {
     } finally {
       setIsExecuting(false)
     }
-  }, [blocks, edges, addNotification, activeWorkflowId, addConsole])
+  }, [activeWorkflowId, blocks, edges, addNotification, addConsole, isOpen, toggleConsole])
 
   return { isExecuting, executionResult, handleRunWorkflow }
 } 
\ No newline at end of file
diff --git a/stores/console/store.ts b/stores/console/store.ts
index b9061bc1e4..edcad80121 100644
--- a/stores/console/store.ts
+++ b/stores/console/store.ts
@@ -9,6 +9,7 @@ export const useConsoleStore = create<ConsoleStore>()(
     persist(
       (set, get) => ({
         entries: [],
+        isOpen: true,
 
         addConsole: (entry) => {
           set((state) => {
@@ -34,6 +35,10 @@ export const useConsoleStore = create<ConsoleStore>()(
         getWorkflowEntries: (workflowId) => {
           return get().entries.filter((entry) => entry.workflowId === workflowId)
         },
+
+        toggleConsole: () => {
+          set((state) => ({ isOpen: !state.isOpen }))
+        },
       }),
       {
         name: 'console-store',
diff --git a/stores/console/types.ts b/stores/console/types.ts
index 48183373d4..761d0af44f 100644
--- a/stores/console/types.ts
+++ b/stores/console/types.ts
@@ -13,7 +13,9 @@ export interface ConsoleEntry {
 
 export interface ConsoleStore {
   entries: ConsoleEntry[]
+  isOpen: boolean
   addConsole: (entry: Omit<ConsoleEntry, 'id'>) => void
   clearConsole: (workflowId: string | null) => void
   getWorkflowEntries: (workflowId: string) => ConsoleEntry[]
+  toggleConsole: () => void
 }
\ No newline at end of file