fix: address PR #41 round 4 (truncation, throttle persist, clamp width)

Author: geier

app-prefixable/src/context/layout.tsx

@@ -12,6 +12,8 @@ const LAYOUT_STORAGE_KEY = "opencode.layout";
 const DEFAULT_REVIEW_WIDTH = 320;
 const DEFAULT_INFO_WIDTH = 256;
 const DEFAULT_SIDEBAR_WIDTH = 256;
+const SIDEBAR_MIN_WIDTH = 180;
+const SIDEBAR_MAX_WIDTH = 480;
 
 interface PanelState {
   opened: boolean;
@@ -54,6 +56,7 @@ interface LayoutContextValue {
   sidebar: {
     width: () => number;
     resize: (width: number) => void;
+    persist: () => void;
   };
   // File tabs
   tabs: {
@@ -135,9 +138,11 @@ export function LayoutProvider(props: ParentProps) {
     initial.info.width ?? DEFAULT_INFO_WIDTH,
   );
 
-  // Sidebar state
+  // Sidebar state (clamp loaded value to valid range)
   const [sidebarWidth, setSidebarWidth] = createSignal(
-    initial.sidebar?.width ?? DEFAULT_SIDEBAR_WIDTH,
+    Math.max(SIDEBAR_MIN_WIDTH, Math.min(SIDEBAR_MAX_WIDTH,
+      Number.isFinite(initial.sidebar?.width) ? initial.sidebar!.width! : DEFAULT_SIDEBAR_WIDTH,
+    )),
   );
 
   // File tabs state
@@ -201,9 +206,9 @@ export function LayoutProvider(props: ParentProps) {
     sidebar: {
       width: sidebarWidth,
       resize: (width: number) => {
-        setSidebarWidth(width);
-        persist();
+        setSidebarWidth(Math.max(SIDEBAR_MIN_WIDTH, Math.min(SIDEBAR_MAX_WIDTH, width)));
       },
+      persist,
     },
     tabs: {
       all: fileTabs,

app-prefixable/src/pages/layout.tsx

@@ -904,7 +904,7 @@ export function Layout(props: ParentProps) {
                               >
                                 <Archive class="w-4 h-4" />
                               </span>
-                              <span class="truncate">
+                              <span class="min-w-0 flex-1 truncate">
                                 {session.title || "Untitled"}
                               </span>
                             </A>
@@ -996,7 +996,10 @@ export function Layout(props: ParentProps) {
             setSidebarDragging(true);
             layout.sidebar.resize(width);
           }}
-          onDragEnd={() => setSidebarDragging(false)}
+          onDragEnd={() => {
+            setSidebarDragging(false);
+            layout.sidebar.persist();
+          }}
           onCollapse={toggleSidebar}
           collapseThreshold={100}
         />