improvement(terminal): default sizing and collapsed width

This commit is contained in:
Emir Karabeg
2026-01-28 12:25:37 -08:00
parent 3d51849018
commit 9076003e89
3 changed files with 16 additions and 10 deletions

View File

@@ -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 {

View File

@@ -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))
}
}

View File

@@ -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 */