Add hidden property to slash commands (#7797)

packages/cli/src/ui/commands/corgiCommand.ts

@@ -10,6 +10,7 @@ export const corgiCommand: SlashCommand = {
   name: 'corgi',
   description: 'Toggles corgi mode.',
   kind: CommandKind.BUILT_IN,
+  hidden: true,
   action: (context, _args) => {
     context.ui.toggleCorgiMode();
   },

packages/cli/src/ui/commands/types.ts

@@ -170,6 +170,7 @@ export interface SlashCommand {
   name: string;
   altNames?: string[];
   description: string;
+  hidden?: boolean;
 
   kind: CommandKind;
 

packages/cli/src/ui/components/Help.tsx

@@ -64,29 +64,27 @@ export const Help: React.FC<Help> = ({ commands }) => (
     <Text bold color={Colors.Foreground}>
       Commands:
     </Text>
-    {commands
-      .filter((command) => command.description)
-      .map((command: SlashCommand) => (
-        <Box key={command.name} flexDirection="column">
-          <Text color={Colors.Foreground}>
-            <Text bold color={Colors.AccentPurple}>
-              {' '}
-              /{command.name}
-            </Text>
-            {command.description && ' - ' + command.description}
+    {commands.map((command: SlashCommand) => (
+      <Box key={command.name} flexDirection="column">
+        <Text color={Colors.Foreground}>
+          <Text bold color={Colors.AccentPurple}>
+            {' '}
+            /{command.name}
           </Text>
-          {command.subCommands &&
-            command.subCommands.map((subCommand) => (
-              <Text key={subCommand.name} color={Colors.Foreground}>
-                <Text bold color={Colors.AccentPurple}>
-                  {'   '}
-                  {subCommand.name}
-                </Text>
-                {subCommand.description && ' - ' + subCommand.description}
+          {command.description && ' - ' + command.description}
+        </Text>
+        {command.subCommands &&
+          command.subCommands.map((subCommand) => (
+            <Text key={subCommand.name} color={Colors.Foreground}>
+              <Text bold color={Colors.AccentPurple}>
+                {'   '}
+                {subCommand.name}
               </Text>
-            ))}
-        </Box>
-      ))}
+              {subCommand.description && ' - ' + subCommand.description}
+            </Text>
+          ))}
+      </Box>
+    ))}
     <Text color={Colors.Foreground}>
       <Text bold color={Colors.AccentPurple}>
         {' '}

packages/cli/src/ui/hooks/slashCommandProcessor.test.ts

@@ -220,6 +220,18 @@ describe('useSlashCommandProcessor', () => {
       expect(fileAction).toHaveBeenCalledTimes(1);
       expect(builtinAction).not.toHaveBeenCalled();
     });
+
+    it('should not include hidden commands in the command list', async () => {
+      const visibleCommand = createTestCommand({ name: 'visible' });
+      const hiddenCommand = createTestCommand({ name: 'hidden', hidden: true });
+      const result = setupProcessorHook([visibleCommand, hiddenCommand]);
+
+      await waitFor(() => {
+        expect(result.current.slashCommands).toHaveLength(1);
+      });
+
+      expect(result.current.slashCommands[0].name).toBe('visible');
+    });
   });
 
   describe('Command Execution Logic', () => {

packages/cli/src/ui/hooks/useSlashCompletion.ts

@@ -443,6 +443,7 @@ export function useSlashCompletion(props: UseSlashCompletionProps): {
       commands.filter(
         (cmd) =>
           cmd.description &&
+          !cmd.hidden &&
           (cmd.name.toLowerCase().startsWith(partial.toLowerCase()) ||
             cmd.altNames?.some((alt) =>
               alt.toLowerCase().startsWith(partial.toLowerCase()),