From d7a1306790846a95efd2bd406d26e430106c4c0d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A8=8B=E5=BA=8F=E5=91=98=E9=98=BF=E6=B1=9F=28Relakkes?=
 =?UTF-8?q?=29?= <relakkes@gmail.com>
Date: Wed, 10 Jun 2026 23:47:57 +0800
Subject: [PATCH] fix(desktop): let memory markdown editor fill pane

Tested: cd desktop && bun run test -- src/__tests__/memorySettings.test.tsx --run --reporter=verbose --pool=forks --maxWorkers=1 --minWorkers=1
Tested: bun run check:desktop
Tested: bun run check:coverage
Tested: Chrome CDP smoke confirmed the memory editor textarea expands to 592px tall
Confidence: high
Scope-risk: narrow
---
 desktop/src/__tests__/memorySettings.test.tsx | 10 ++++++++++
 desktop/src/pages/MemorySettings.tsx          | 16 ++++++++--------
 2 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/desktop/src/__tests__/memorySettings.test.tsx b/desktop/src/__tests__/memorySettings.test.tsx
index 0474595b..131a4bec 100644
--- a/desktop/src/__tests__/memorySettings.test.tsx
+++ b/desktop/src/__tests__/memorySettings.test.tsx
@@ -163,6 +163,16 @@ describe('MemorySettings', () => {
     expect(await screen.findByTestId('markdown-preview')).toHaveTextContent('Prefer small diffs')
   })
 
+  it('lets the markdown editor fill the remaining detail pane height', async () => {
+    render(<MemorySettings />)
+
+    fireEvent.click(await screen.findByRole('button', { name: 'Edit' }))
+
+    const editor = await screen.findByLabelText('Editor')
+    expect(editor).toHaveClass('min-h-0', 'flex-1', 'resize-none')
+    expect(editor.parentElement).toHaveClass('flex', 'min-h-0', 'flex-1', 'flex-col')
+  })
+
   it('cancels edit mode by discarding the unsaved draft', async () => {
     render(<MemorySettings />)
 
diff --git a/desktop/src/pages/MemorySettings.tsx b/desktop/src/pages/MemorySettings.tsx
index 65e3599e..30895d48 100644
--- a/desktop/src/pages/MemorySettings.tsx
+++ b/desktop/src/pages/MemorySettings.tsx
@@ -306,7 +306,7 @@ export function MemorySettings() {
           </section>
         </aside>
 
-        <section className="min-h-0 overflow-hidden bg-[var(--color-surface-container-lowest)]">
+        <section className="flex min-h-0 flex-col overflow-hidden bg-[var(--color-surface-container-lowest)]">
           <div className="grid gap-3 border-b border-[var(--color-border)] bg-[var(--color-surface-container-lowest)] px-4 py-3 lg:grid-cols-[minmax(0,1fr)_auto] lg:items-center">
             <div className="min-w-0">
               <div className="flex flex-wrap items-center gap-2">
@@ -332,8 +332,8 @@ export function MemorySettings() {
 
           {selectedFile ? (
             isEditing ? (
-              <div className="min-h-[560px]">
-                <div className="flex h-10 items-center justify-between border-b border-[var(--color-border)] bg-[var(--color-surface-container-low)] px-3 text-xs font-medium uppercase tracking-normal text-[var(--color-text-tertiary)]">
+              <div className="flex min-h-0 flex-1 flex-col">
+                <div className="flex h-10 shrink-0 items-center justify-between border-b border-[var(--color-border)] bg-[var(--color-surface-container-low)] px-3 text-xs font-medium uppercase tracking-normal text-[var(--color-text-tertiary)]">
                   <div className="flex min-w-0 items-center gap-2">
                     <span>{t('settings.memory.editor')}</span>
                     <span>MARKDOWN</span>
@@ -375,12 +375,12 @@ export function MemorySettings() {
                   value={draftContent}
                   onChange={(event) => updateDraft(event.target.value)}
                   spellCheck={false}
-                  className="h-[calc(100%-40px)] w-full resize-none overflow-auto bg-transparent p-5 font-mono text-[13px] leading-6 text-[var(--color-text-primary)] outline-none placeholder:text-[var(--color-text-tertiary)]"
+                  className="min-h-0 flex-1 w-full resize-none overflow-auto bg-transparent p-5 font-mono text-[13px] leading-6 text-[var(--color-text-primary)] outline-none placeholder:text-[var(--color-text-tertiary)]"
                 />
               </div>
             ) : (
-              <div className="min-h-[560px] overflow-y-auto">
-                <div className="flex h-10 items-center justify-between border-b border-[var(--color-border)] bg-[var(--color-surface-container-low)] px-3 text-xs font-medium uppercase tracking-normal text-[var(--color-text-tertiary)]">
+              <div className="flex min-h-0 flex-1 flex-col overflow-hidden">
+                <div className="flex h-10 shrink-0 items-center justify-between border-b border-[var(--color-border)] bg-[var(--color-surface-container-low)] px-3 text-xs font-medium uppercase tracking-normal text-[var(--color-text-tertiary)]">
                   <div className="flex min-w-0 items-center gap-2">
                     <span>{t('settings.memory.preview')}</span>
                     <span>{t('settings.memory.rendered')}</span>
@@ -395,7 +395,7 @@ export function MemorySettings() {
                     icon={<PencilLine size={14} aria-hidden="true" />}
                   />
                 </div>
-                <div className="p-6">
+                <div className="min-h-0 flex-1 overflow-y-auto p-6">
                   <MarkdownRenderer
                     content={previewContent || ' '}
                     variant="document"
@@ -405,7 +405,7 @@ export function MemorySettings() {
               </div>
             )
           ) : (
-            <div className="flex min-h-[520px] items-center justify-center p-8">
+            <div className="flex min-h-0 flex-1 items-center justify-center p-8">
               <EmptyState icon={<FileText size={20} />} text={isLoadingFile ? t('common.loading') : t('settings.memory.selectFile')} />
             </div>
           )}