fix: reset sidebar to midpoint of min/max, detail to 50/50 split

Read current panel dimensions from DOM, compute sidebar midpoint
as (192px + maxWidth) / 2, and detail as equal halves. Write
computed values to localStorage before reload.

1 files changed, 32 insertions, 6 deletions

diff --git a/apps/web/app/reader/_components/command-palette.tsx b/apps/web/app/reader/_components/command-palette.tsx
index 32f035a..e9b7b04 100644
--- a/apps/web/app/reader/_components/command-palette.tsx
+++ b/apps/web/app/reader/_components/command-palette.tsx
@@ -195,12 +195,38 @@ export function CommandPalette() {
             <Command.Item
               onSelect={() =>
                 actionAndClose(() => {
-                  localStorage.removeItem(
-                    "react-resizable-panels:asa-detail-layout:entry-list:detail-panel"
-                  )
-                  localStorage.removeItem(
-                    "react-resizable-panels:asa-sidebar-layout:sidebar:main-content"
-                  )
+                  const sidebarPanel = document.querySelector('[data-panel-id="sidebar"]') as HTMLElement | null
+                  const mainContentPanel = document.querySelector('[data-panel-id="main-content"]') as HTMLElement | null
+                  if (sidebarPanel && mainContentPanel) {
+                    const totalPixels = sidebarPanel.offsetWidth + mainContentPanel.offsetWidth
+                    const minPixels = 192
+                    const maxPixels = parseInt(sidebarPanel.style.maxWidth, 10) || Math.round(totalPixels * 0.35)
+                    const midpoint = Math.round((minPixels + maxPixels) / 2)
+                    localStorage.setItem(
+                      "react-resizable-panels:asa-sidebar-layout:sidebar:main-content",
+                      JSON.stringify({ sidebar: midpoint, "main-content": totalPixels - midpoint })
+                    )
+                  } else {
+                    localStorage.removeItem(
+                      "react-resizable-panels:asa-sidebar-layout:sidebar:main-content"
+                    )
+                  }
+
+                  const entryListPanel = document.querySelector('[data-panel-id="entry-list"]') as HTMLElement | null
+                  const detailPanel = document.querySelector('[data-panel-id="detail-panel"]') as HTMLElement | null
+                  if (entryListPanel && detailPanel) {
+                    const totalPixels = entryListPanel.offsetWidth + detailPanel.offsetWidth
+                    const halfPixels = Math.round(totalPixels / 2)
+                    localStorage.setItem(
+                      "react-resizable-panels:asa-detail-layout:entry-list:detail-panel",
+                      JSON.stringify({ "entry-list": halfPixels, "detail-panel": totalPixels - halfPixels })
+                    )
+                  } else {
+                    localStorage.removeItem(
+                      "react-resizable-panels:asa-detail-layout:entry-list:detail-panel"
+                    )
+                  }
+
                   window.location.reload()
                 })
               }