From 4c6610d62bfb81b7f7d801aeb8c9307420f178a5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=91=A8=E5=87=AF?= <851708184@qq.com>
Date: Fri, 23 Oct 2026 16:59:29 +0800
Subject: [PATCH 1/2] fix(web): cap dialog height so long content keeps actions
 reachable

Dialog content is fixed-centered with no height limit, so a long skill
body (the textarea uses field-sizing-content) grows the dialog past the
viewport and the footer actions end up unreachable because the page
itself does not scroll.

Cap the shared dialog at the viewport height with internal scrolling.
This also fixes other long-form dialogs (e.g. the memory editor) in one
place.

Closes #429
---
 web/src/lib/components/ui/dialog.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/src/lib/components/ui/dialog.svelte b/web/src/lib/components/ui/dialog.svelte
index 2d690100..232061a0 100644
--- a/web/src/lib/components/ui/dialog.svelte
+++ b/web/src/lib/components/ui/dialog.svelte
@@ -34,7 +34,7 @@
     />
     <DialogPrimitive.Content
       class={cn(
-        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 ring-foreground/5 dark:ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-6 rounded-[min(var(--radius-4xl),24px)] p-6 text-sm shadow-xl ring-1 duration-100 sm:max-w-md fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none [--floating-label-bg:var(--popover)]",
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 ring-foreground/5 dark:ring-foreground/10 grid max-h-[calc(100dvh-2rem)] max-w-[calc(100%-2rem)] gap-6 overflow-y-auto rounded-[min(var(--radius-4xl),24px)] p-6 text-sm shadow-xl ring-1 duration-100 sm:max-w-md fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none [--floating-label-bg:var(--popover)]",
         className
       )}
     >

From 53094d7b681e8f9788fda26092259e8b66b5a210 Mon Sep 17 00:00:00 2001
From: EyJunge1 <149941075+EyJunge1@users.noreply.github.com>
Date: Sat, 24 Oct 2026 20:03:28 +0200
Subject: [PATCH 2/2] fix(web): keep dialog header and actions pinned while
 body scrolls
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Overflow on the whole dialog made Save reachable only after scrolling
and hid the close button. Cap height on a flex column shell, scroll the
body, and pin header/footer — aligning AiCleanup with the shared layout.
---
 web/src/lib/components/explorer/AiCleanupDialog.svelte | 6 +++---
 web/src/lib/components/ui/app-dialog.svelte            | 8 +++++---
 web/src/lib/components/ui/dialog.svelte                | 4 ++--
 3 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/web/src/lib/components/explorer/AiCleanupDialog.svelte b/web/src/lib/components/explorer/AiCleanupDialog.svelte
index 1e3792db..9ef641d1 100644
--- a/web/src/lib/components/explorer/AiCleanupDialog.svelte
+++ b/web/src/lib/components/explorer/AiCleanupDialog.svelte
@@ -225,7 +225,7 @@
 <AppDialog
   bind:open
   title={i18n.t("label-ai-cleanup-title")}
-  class="grid! sm:max-w-2xl max-h-[90vh] grid-rows-[auto_minmax(0,1fr)_auto] overflow-hidden {GAP_WIDE}"
+  class="sm:max-w-2xl {GAP_WIDE}"
   onOpenChange={handleOpenChange}
 >
   {#if phase === "loading"}
@@ -234,7 +234,7 @@
       <span class="text-sm">{i18n.t("label-ai-cleanup-loading")}</span>
     </div>
   {:else if phase === "select"}
-    <div class="flex min-h-0 flex-col {GAP_LOOSE} overflow-hidden">
+    <div class="flex min-h-0 flex-1 flex-col {GAP_LOOSE} overflow-hidden">
       <div class="flex flex-wrap items-center justify-between {GAP}">
         <h3 class="text-sm font-medium">{i18n.t("label-ai-cleanup-select")}</h3>
         <div class="flex flex-wrap {GAP_TIGHT}">
@@ -290,7 +290,7 @@
       </div>
     </div>
   {:else if phase === "diff" && pendingCleanup}
-    <div class="flex min-h-0 flex-col {GAP_LOOSE} overflow-hidden">
+    <div class="flex min-h-0 flex-1 flex-col {GAP_LOOSE} overflow-hidden">
       <div class="flex flex-wrap items-center justify-between {GAP}">
         <span class="text-xs text-muted-foreground">
           {i18n.t("label-ai-cleanup-changes-selected", {
diff --git a/web/src/lib/components/ui/app-dialog.svelte b/web/src/lib/components/ui/app-dialog.svelte
index 8ced3e5d..2f2d6473 100644
--- a/web/src/lib/components/ui/app-dialog.svelte
+++ b/web/src/lib/components/ui/app-dialog.svelte
@@ -27,12 +27,14 @@
 </script>
 
 <Dialog bind:open {onOpenChange} class={className} {showCloseButton}>
-  <DialogHeader>
+  <DialogHeader class="shrink-0 pe-10">
     <DialogTitle>{title}</DialogTitle>
   </DialogHeader>
-  {@render children?.()}
+  <div class="flex min-h-0 flex-1 flex-col overflow-y-auto">
+    {@render children?.()}
+  </div>
   {#if footer}
-    <DialogFooter>
+    <DialogFooter class="shrink-0">
       {@render footer()}
     </DialogFooter>
   {/if}
diff --git a/web/src/lib/components/ui/dialog.svelte b/web/src/lib/components/ui/dialog.svelte
index 232061a0..ca502ff6 100644
--- a/web/src/lib/components/ui/dialog.svelte
+++ b/web/src/lib/components/ui/dialog.svelte
@@ -34,7 +34,7 @@
     />
     <DialogPrimitive.Content
       class={cn(
-        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 ring-foreground/5 dark:ring-foreground/10 grid max-h-[calc(100dvh-2rem)] max-w-[calc(100%-2rem)] gap-6 overflow-y-auto rounded-[min(var(--radius-4xl),24px)] p-6 text-sm shadow-xl ring-1 duration-100 sm:max-w-md fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none [--floating-label-bg:var(--popover)]",
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 ring-foreground/5 dark:ring-foreground/10 flex max-h-[calc(100dvh-2rem)] max-w-[calc(100%-2rem)] flex-col gap-6 overflow-hidden rounded-[min(var(--radius-4xl),24px)] p-6 text-sm shadow-xl ring-1 duration-100 sm:max-w-md fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none [--floating-label-bg:var(--popover)]",
         className
       )}
     >
@@ -45,7 +45,7 @@
             <Button
               {...props}
               variant="ghost"
-              class="bg-secondary absolute top-4 right-4"
+              class="bg-secondary absolute top-4 right-4 z-10"
               size="icon-sm"
             >
               <XIcon />