From d86282aa60e35e10a910d7e1d8f0442148d77fc1 Mon Sep 17 00:00:00 2001
From: Val Alexander <bunsthedev@gmail.com>
Date: Wed, 1 Apr 2026 08:57:16 -0500
Subject: [PATCH] Standardize button sizes in dialog actions

- Use `size="sm"` for modal and alert dialog actions
- Align button heights across project scripts and skills screens
---
 apps/web/src/components/ChatView.tsx                 |  3 ++-
 apps/web/src/components/ProjectScriptsControl.tsx    | 11 +++++++----
 apps/web/src/components/skills/CreateSkillDialog.tsx |  3 ++-
 apps/web/src/components/skills/SkillsPage.tsx        |  6 +++---
 4 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/apps/web/src/components/ChatView.tsx b/apps/web/src/components/ChatView.tsx
index 8272abe33..73021d062 100644
--- a/apps/web/src/components/ChatView.tsx
+++ b/apps/web/src/components/ChatView.tsx
@@ -5602,11 +5602,12 @@ export default function ChatView({ threadId }: ChatViewProps) {
             <Button
               type="button"
               variant="outline"
+              size="sm"
               onClick={() => setPendingProjectScriptRun(null)}
             >
               Cancel
             </Button>
-            <Button type="button" onClick={() => void submitPendingProjectScriptRun()}>
+            <Button type="button" size="sm" onClick={() => void submitPendingProjectScriptRun()}>
               Run action
             </Button>
           </DialogFooter>
diff --git a/apps/web/src/components/ProjectScriptsControl.tsx b/apps/web/src/components/ProjectScriptsControl.tsx
index 055893822..f2a455bb5 100644
--- a/apps/web/src/components/ProjectScriptsControl.tsx
+++ b/apps/web/src/components/ProjectScriptsControl.tsx
@@ -558,6 +558,7 @@ export default function ProjectScriptsControl({
               <Button
                 type="button"
                 variant="outline"
+                size="sm"
                 className="mr-auto"
                 onClick={() => setDeleteConfirmOpen(true)}
               >
@@ -567,13 +568,14 @@ export default function ProjectScriptsControl({
             <Button
               type="button"
               variant="outline"
+              size="sm"
               onClick={() => {
                 setDialogOpen(false);
               }}
             >
               Cancel
             </Button>
-            <Button form={addScriptFormId} type="submit">
+            <Button form={addScriptFormId} type="submit" size="sm">
               {isEditing ? "Save changes" : "Save action"}
             </Button>
           </DialogFooter>
@@ -587,8 +589,8 @@ export default function ProjectScriptsControl({
             <AlertDialogDescription>This action cannot be undone.</AlertDialogDescription>
           </AlertDialogHeader>
           <AlertDialogFooter>
-            <AlertDialogClose render={<Button variant="outline" />}>Cancel</AlertDialogClose>
-            <Button variant="destructive" onClick={confirmDeleteScript}>
+            <AlertDialogClose render={<Button variant="outline" size="sm" />}>Cancel</AlertDialogClose>
+            <Button variant="destructive" size="sm" onClick={confirmDeleteScript}>
               Delete action
             </Button>
           </AlertDialogFooter>
@@ -669,11 +671,12 @@ export default function ProjectScriptsControl({
             ) : null}
           </DialogPanel>
           <DialogFooter>
-            <Button type="button" variant="outline" onClick={() => setImportDialogOpen(false)}>
+            <Button type="button" variant="outline" size="sm" onClick={() => setImportDialogOpen(false)}>
               Cancel
             </Button>
             <Button
               type="button"
+              size="sm"
               onClick={() => void handleImportScripts()}
               disabled={importLoading || availableImportDrafts.length === 0}
             >
diff --git a/apps/web/src/components/skills/CreateSkillDialog.tsx b/apps/web/src/components/skills/CreateSkillDialog.tsx
index 53d53cb41..b86292b77 100644
--- a/apps/web/src/components/skills/CreateSkillDialog.tsx
+++ b/apps/web/src/components/skills/CreateSkillDialog.tsx
@@ -197,10 +197,11 @@ export function CreateSkillDialog(props: {
           </div>
         </DialogPanel>
         <DialogFooter>
-          <Button variant="outline" onClick={() => props.onOpenChange(false)}>
+          <Button variant="outline" size="sm" onClick={() => props.onOpenChange(false)}>
             Cancel
           </Button>
           <Button
+            size="sm"
             onClick={() => createMutation.mutate()}
             disabled={Boolean(nameError) || !description.trim() || createMutation.isPending}
           >
diff --git a/apps/web/src/components/skills/SkillsPage.tsx b/apps/web/src/components/skills/SkillsPage.tsx
index 88ec65f9c..13f57b694 100644
--- a/apps/web/src/components/skills/SkillsPage.tsx
+++ b/apps/web/src/components/skills/SkillsPage.tsx
@@ -192,14 +192,14 @@ function SkillDetailDialog(props: {
           {isCatalog && !skill.installed ? (
             <>
               {props.cwd ? (
-                <Button variant="outline" onClick={() => props.onInstallProject(skill.id)}>
+                <Button variant="outline" size="sm" onClick={() => props.onInstallProject(skill.id)}>
                   Install to project
                 </Button>
               ) : null}
-              <Button onClick={() => props.onInstallGlobal(skill.id)}>Install globally</Button>
+              <Button size="sm" onClick={() => props.onInstallGlobal(skill.id)}>Install globally</Button>
             </>
           ) : !isCatalog && mutable ? (
-            <Button variant="destructive" onClick={() => props.onDelete(skill)}>
+            <Button variant="destructive" size="sm" onClick={() => props.onDelete(skill)}>
               Delete
             </Button>
           ) : null}