feat(cli): Add /auth logout command to clear credentials and auth state (#13383)

packages/cli/src/ui/components/LogoutConfirmationDialog.test.tsx

@@ -0,0 +1,82 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { renderWithProviders } from '../../test-utils/render.js';
+import { act } from 'react';
+import { vi, describe, it, expect, beforeEach } from 'vitest';
+import {
+  LogoutConfirmationDialog,
+  LogoutChoice,
+} from './LogoutConfirmationDialog.js';
+import { RadioButtonSelect } from './shared/RadioButtonSelect.js';
+
+vi.mock('./shared/RadioButtonSelect.js', () => ({
+  RadioButtonSelect: vi.fn(() => null),
+}));
+
+describe('LogoutConfirmationDialog', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('should render the dialog with title, description, and hint', () => {
+    const { lastFrame } = renderWithProviders(
+      <LogoutConfirmationDialog onSelect={vi.fn()} />,
+    );
+
+    expect(lastFrame()).toContain('You are now logged out.');
+    expect(lastFrame()).toContain(
+      'Login again to continue using Gemini CLI, or exit the application.',
+    );
+    expect(lastFrame()).toContain('(Use Enter to select, Esc to close)');
+  });
+
+  it('should render RadioButtonSelect with Login and Exit options', () => {
+    renderWithProviders(<LogoutConfirmationDialog onSelect={vi.fn()} />);
+
+    expect(RadioButtonSelect).toHaveBeenCalled();
+    const mockCall = vi.mocked(RadioButtonSelect).mock.calls[0][0];
+    expect(mockCall.items).toEqual([
+      { label: 'Login', value: LogoutChoice.LOGIN, key: 'login' },
+      { label: 'Exit', value: LogoutChoice.EXIT, key: 'exit' },
+    ]);
+    expect(mockCall.isFocused).toBe(true);
+  });
+
+  it('should call onSelect with LOGIN when Login is selected', () => {
+    const onSelect = vi.fn();
+    renderWithProviders(<LogoutConfirmationDialog onSelect={onSelect} />);
+
+    const mockCall = vi.mocked(RadioButtonSelect).mock.calls[0][0];
+    mockCall.onSelect(LogoutChoice.LOGIN);
+
+    expect(onSelect).toHaveBeenCalledWith(LogoutChoice.LOGIN);
+  });
+
+  it('should call onSelect with EXIT when Exit is selected', () => {
+    const onSelect = vi.fn();
+    renderWithProviders(<LogoutConfirmationDialog onSelect={onSelect} />);
+
+    const mockCall = vi.mocked(RadioButtonSelect).mock.calls[0][0];
+    mockCall.onSelect(LogoutChoice.EXIT);
+
+    expect(onSelect).toHaveBeenCalledWith(LogoutChoice.EXIT);
+  });
+
+  it('should call onSelect with EXIT when escape key is pressed', () => {
+    const onSelect = vi.fn();
+    const { stdin } = renderWithProviders(
+      <LogoutConfirmationDialog onSelect={onSelect} />,
+    );
+
+    act(() => {
+      // Send kitty escape key sequence
+      stdin.write('\u001b[27u');
+    });
+
+    expect(onSelect).toHaveBeenCalledWith(LogoutChoice.EXIT);
+  });
+});

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

@@ -0,0 +1,79 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { Box, Text } from 'ink';
+import type React from 'react';
+import { theme } from '../semantic-colors.js';
+import type { RadioSelectItem } from './shared/RadioButtonSelect.js';
+import { RadioButtonSelect } from './shared/RadioButtonSelect.js';
+import { useKeypress } from '../hooks/useKeypress.js';
+
+export enum LogoutChoice {
+  LOGIN = 'login',
+  EXIT = 'exit',
+}
+
+interface LogoutConfirmationDialogProps {
+  onSelect: (choice: LogoutChoice) => void;
+}
+
+export const LogoutConfirmationDialog: React.FC<
+  LogoutConfirmationDialogProps
+> = ({ onSelect }) => {
+  // Handle escape key to exit (consistent with other dialogs)
+  useKeypress(
+    (key) => {
+      if (key.name === 'escape') {
+        onSelect(LogoutChoice.EXIT);
+      }
+    },
+    { isActive: true },
+  );
+
+  const options: Array<RadioSelectItem<LogoutChoice>> = [
+    {
+      label: 'Login',
+      value: LogoutChoice.LOGIN,
+      key: 'login',
+    },
+    {
+      label: 'Exit',
+      value: LogoutChoice.EXIT,
+      key: 'exit',
+    },
+  ];
+
+  return (
+    <Box flexDirection="row" width="100%">
+      <Box
+        flexDirection="column"
+        borderStyle="round"
+        borderColor={theme.border.focused}
+        padding={1}
+        flexGrow={1}
+        marginLeft={1}
+        marginRight={1}
+      >
+        <Box flexDirection="column" marginBottom={1}>
+          <Text bold color={theme.text.primary}>
+            You are now logged out.
+          </Text>
+          <Text color={theme.text.secondary}>
+            Login again to continue using Gemini CLI, or exit the application.
+          </Text>
+        </Box>
+
+        <RadioButtonSelect items={options} onSelect={onSelect} isFocused />
+
+        <Box marginTop={1}>
+          <Text color={theme.text.secondary}>
+            (Use Enter to select, Esc to close)
+          </Text>
+        </Box>
+      </Box>
+    </Box>
+  );
+};