From e7b6326cfa8dea1b5f502be89b2dfed8aa40582f Mon Sep 17 00:00:00 2001
From: Abhi <43648792+abhipatel12@users.noreply.github.com>
Date: Sat, 21 Mar 2026 00:29:09 -0400
Subject: [PATCH] fix(cli): add Esc instruction to HooksDialog footer (#23258)

---
 packages/cli/src/ui/components/HooksDialog.tsx         |  5 +++++
 .../components/__snapshots__/HooksDialog.test.tsx.snap | 10 ++++++++++
 2 files changed, 15 insertions(+)

diff --git a/packages/cli/src/ui/components/HooksDialog.tsx b/packages/cli/src/ui/components/HooksDialog.tsx
index 0421f7d9eb..6a60a10af6 100644
--- a/packages/cli/src/ui/components/HooksDialog.tsx
+++ b/packages/cli/src/ui/components/HooksDialog.tsx
@@ -244,6 +244,11 @@ export const HooksDialog: React.FC<HooksDialogProps> = ({
           </Box>
         </>
       )}
+      <Box marginTop={1} flexDirection="column">
+        <Text color={theme.text.secondary} wrap="truncate">
+          (Press Esc to close)
+        </Text>
+      </Box>
     </Box>
   );
 };
diff --git a/packages/cli/src/ui/components/__snapshots__/HooksDialog.test.tsx.snap b/packages/cli/src/ui/components/__snapshots__/HooksDialog.test.tsx.snap
index 1a2271cc45..cd16040059 100644
--- a/packages/cli/src/ui/components/__snapshots__/HooksDialog.test.tsx.snap
+++ b/packages/cli/src/ui/components/__snapshots__/HooksDialog.test.tsx.snap
@@ -6,6 +6,8 @@ exports[`HooksDialog > snapshots > renders empty hooks dialog 1`] = `
 │                                                                                                  │
 │ No hooks configured.                                                                             │
 │                                                                                                  │
+│ (Press Esc to close)                                                                             │
+│                                                                                                  │
 ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯
 "
 `;
@@ -31,6 +33,8 @@ exports[`HooksDialog > snapshots > renders hook using command as name when name
 │ Tip: Use /hooks enable <hook-name> or /hooks disable <hook-name> to toggle individual hooks. Use │
 │ /hooks enable-all or /hooks disable-all to toggle all hooks at once.                             │
 │                                                                                                  │
+│ (Press Esc to close)                                                                             │
+│                                                                                                  │
 ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯
 "
 `;
@@ -57,6 +61,8 @@ exports[`HooksDialog > snapshots > renders hook with all metadata (matcher, sequ
 │ Tip: Use /hooks enable <hook-name> or /hooks disable <hook-name> to toggle individual hooks. Use │
 │ /hooks enable-all or /hooks disable-all to toggle all hooks at once.                             │
 │                                                                                                  │
+│ (Press Esc to close)                                                                             │
+│                                                                                                  │
 ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯
 "
 `;
@@ -93,6 +99,8 @@ exports[`HooksDialog > snapshots > renders hooks grouped by event name with enab
 │ Tip: Use /hooks enable <hook-name> or /hooks disable <hook-name> to toggle individual hooks. Use │
 │ /hooks enable-all or /hooks disable-all to toggle all hooks at once.                             │
 │                                                                                                  │
+│ (Press Esc to close)                                                                             │
+│                                                                                                  │
 ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯
 "
 `;
@@ -119,6 +127,8 @@ exports[`HooksDialog > snapshots > renders single hook with security warning, so
 │ Tip: Use /hooks enable <hook-name> or /hooks disable <hook-name> to toggle individual hooks. Use │
 │ /hooks enable-all or /hooks disable-all to toggle all hooks at once.                             │
 │                                                                                                  │
+│ (Press Esc to close)                                                                             │
+│                                                                                                  │
 ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯
 "
 `;