From aca27709dfec3a56f775459e5b0b9d25bc593e28 Mon Sep 17 00:00:00 2001
From: Taylor Mullen <ntaylormullen@google.com>
Date: Sat, 17 May 2025 21:25:28 -0700
Subject: feat: Add auto-accept indicator and toggle

- This commit introduces a visual indicator in the CLI to show when auto-accept for tool confirmations is enabled. Users can now also toggle this setting on/off using Shift + Tab.
- This addresses user feedback for better visibility and control over the auto-accept feature, improving the overall user experience.
- This behavior is similar to Claude Code, providing a familiar experience for users transitioning from that environment.
- Added tests for the new auto indicator hook.

Fixes https://b.corp.google.com/issues/413740468
---
 packages/cli/src/ui/components/AutoAcceptIndicator.tsx | 18 ++++++++++++++++++
 packages/cli/src/ui/components/LoadingIndicator.tsx    |  6 ++++--
 2 files changed, 22 insertions(+), 2 deletions(-)
 create mode 100644 packages/cli/src/ui/components/AutoAcceptIndicator.tsx

(limited to 'packages/cli/src/ui/components')

diff --git a/packages/cli/src/ui/components/AutoAcceptIndicator.tsx b/packages/cli/src/ui/components/AutoAcceptIndicator.tsx
new file mode 100644
index 00000000..dc23d5e2
--- /dev/null
+++ b/packages/cli/src/ui/components/AutoAcceptIndicator.tsx
@@ -0,0 +1,18 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { Box, Text } from 'ink';
+import { Colors } from '../colors.js';
+
+export const AutoAcceptIndicator: React.FC = () => (
+  <Box>
+    <Text color={Colors.AccentGreen}>
+      accepting edits
+      <Text color={Colors.SubtleComment}> (shift + tab to disable)</Text>
+    </Text>
+  </Box>
+);
diff --git a/packages/cli/src/ui/components/LoadingIndicator.tsx b/packages/cli/src/ui/components/LoadingIndicator.tsx
index ca5fb5de..4f342c9d 100644
--- a/packages/cli/src/ui/components/LoadingIndicator.tsx
+++ b/packages/cli/src/ui/components/LoadingIndicator.tsx
@@ -13,12 +13,14 @@ interface LoadingIndicatorProps {
   isLoading: boolean;
   currentLoadingPhrase: string;
   elapsedTime: number;
+  rightContent?: React.ReactNode;
 }
 
 export const LoadingIndicator: React.FC<LoadingIndicatorProps> = ({
   isLoading,
   currentLoadingPhrase,
   elapsedTime,
+  rightContent,
 }) => {
   if (!isLoading) {
     return null; // Don't render anything if not loading
@@ -30,10 +32,10 @@ export const LoadingIndicator: React.FC<LoadingIndicatorProps> = ({
         <Spinner type="dots" />
       </Box>
       <Text color={Colors.AccentPurple}>
-        {currentLoadingPhrase} ({elapsedTime}s)
+        {currentLoadingPhrase} (esc to cancel, {elapsedTime}s)
       </Text>
       <Box flexGrow={1}>{/* Spacer */}</Box>
-      <Text color={Colors.SubtleComment}>(ESC to cancel)</Text>
+      {rightContent && <Box>{rightContent}</Box>}
     </Box>
   );
 };
-- 
cgit v1.2.3