improvement(terminal): default sizing and collapsed width

Author: emir-karabeg

apps/sim/app/_styles/globals.css

@@ -14,7 +14,7 @@
   --panel-width: 320px; /* PANEL_WIDTH.DEFAULT */
   --toolbar-triggers-height: 300px; /* TOOLBAR_TRIGGERS_HEIGHT.DEFAULT */
   --editor-connections-height: 172px; /* EDITOR_CONNECTIONS_HEIGHT.DEFAULT */
-  --terminal-height: 155px; /* TERMINAL_HEIGHT.DEFAULT */
+  --terminal-height: 206px; /* TERMINAL_HEIGHT.DEFAULT */
 }
 
 .sidebar-container {

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/terminal/terminal.tsx

@@ -410,10 +410,8 @@ const ExecutionGroupRow = memo(function ExecutionGroupRow({
 }) {
   return (
     <div className='flex flex-col px-[6px]'>
-      {/* Dashed separator between executions */}
-      {showSeparator && (
-        <div className='mx-[4px] my-[4px] border-[var(--border)] border-t border-dashed' />
-      )}
+      {/* Separator between executions */}
+      {showSeparator && <div className='mx-[4px] my-[4px] border-[var(--border)] border-t' />}
 
       {/* Entry tree */}
       <div className='ml-[4px] flex flex-col gap-[2px] pb-[4px]'>
@@ -1091,7 +1089,8 @@ export const Terminal = memo(function Terminal() {
   }, [expandToLastHeight, navigateToEntry])
 
   /**
-   * Adjust output panel width on resize
+   * Adjust output panel width on resize.
+   * Closes the output panel if there's not enough space for the minimum width.
    */
   useEffect(() => {
     const handleResize = () => {
@@ -1107,7 +1106,14 @@ export const Terminal = memo(function Terminal() {
       const terminalWidth = window.innerWidth - sidebarWidth - panelWidth
       const maxWidth = terminalWidth - TERMINAL_CONFIG.BLOCK_COLUMN_WIDTH_PX
 
-      if (outputPanelWidth > maxWidth && maxWidth >= MIN_OUTPUT_PANEL_WIDTH_PX) {
+      // Close output panel if there's not enough space for minimum width
+      if (maxWidth < MIN_OUTPUT_PANEL_WIDTH_PX) {
+        setAutoSelectEnabled(false)
+        setSelectedEntry(null)
+        return
+      }
+
+      if (outputPanelWidth > maxWidth) {
         setOutputPanelWidth(Math.max(maxWidth, MIN_OUTPUT_PANEL_WIDTH_PX))
       }
     }

apps/sim/stores/constants.ts

@@ -36,7 +36,7 @@ export const PANEL_WIDTH = {
 
 /** Terminal height constraints */
 export const TERMINAL_HEIGHT = {
-  DEFAULT: 155,
+  DEFAULT: 206,
   MIN: 30,
   /** Maximum is 70% of viewport, enforced dynamically */
   MAX_PERCENTAGE: 0.7,
@@ -58,8 +58,8 @@ export const EDITOR_CONNECTIONS_HEIGHT = {
 
 /** Output panel (terminal execution results) width constraints */
 export const OUTPUT_PANEL_WIDTH = {
-  DEFAULT: 440,
-  MIN: 440,
+  DEFAULT: 560,
+  MIN: 280,
 } as const
 
 /** Terminal block column width - minimum width for the logs column */