fss-link 1.0.40 → 1.0.45

package/dist/ui/components/FolderTrustDialog.tsx

@@ -0,0 +1,74 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { Box, Text } from 'ink';
+import React from 'react';
+import { Colors } from '../colors.js';
+import {
+  RadioButtonSelect,
+  RadioSelectItem,
+} from './shared/RadioButtonSelect.js';
+import { useKeypress } from '../hooks/useKeypress.js';
+
+export enum FolderTrustChoice {
+  TRUST_FOLDER = 'trust_folder',
+  TRUST_PARENT = 'trust_parent',
+  DO_NOT_TRUST = 'do_not_trust',
+}
+
+interface FolderTrustDialogProps {
+  onSelect: (choice: FolderTrustChoice) => void;
+}
+
+export const FolderTrustDialog: React.FC<FolderTrustDialogProps> = ({
+  onSelect,
+}) => {
+  useKeypress(
+    (key) => {
+      if (key.name === 'escape') {
+        onSelect(FolderTrustChoice.DO_NOT_TRUST);
+      }
+    },
+    { isActive: true },
+  );
+
+  const options: Array<RadioSelectItem<FolderTrustChoice>> = [
+    {
+      label: 'Trust folder',
+      value: FolderTrustChoice.TRUST_FOLDER,
+    },
+    {
+      label: 'Trust parent folder',
+      value: FolderTrustChoice.TRUST_PARENT,
+    },
+    {
+      label: "Don't trust (esc)",
+      value: FolderTrustChoice.DO_NOT_TRUST,
+    },
+  ];
+
+  return (
+    <Box
+      flexDirection="column"
+      borderStyle="round"
+      borderColor={Colors.AccentYellow}
+      padding={1}
+      width="100%"
+      marginLeft={1}
+    >
+      <Box flexDirection="column" marginBottom={1}>
+        <Text bold>Do you trust this folder?</Text>
+        <Text>
+          Trusting a folder allows Gemini to execute commands it suggests. This
+          is a security feature to prevent accidental execution in untrusted
+          directories.
+        </Text>
+      </Box>
+
+      <RadioButtonSelect items={options} onSelect={onSelect} isFocused />
+    </Box>
+  );
+};

package/dist/ui/components/Footer.test.tsx

@@ -0,0 +1,159 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { render } from 'ink-testing-library';
+import { describe, it, expect, vi } from 'vitest';
+import { Footer } from './Footer.js';
+import * as useTerminalSize from '../hooks/useTerminalSize.js';
+import { tildeifyPath } from 'fss-link-core';
+import path from 'node:path';
+
+vi.mock('../hooks/useTerminalSize.js');
+const useTerminalSizeMock = vi.mocked(useTerminalSize.useTerminalSize);
+
+vi.mock('fss-link-core', async (importOriginal) => {
+  const original =
+    await importOriginal<typeof import('fss-link-core')>();
+  return {
+    ...original,
+    shortenPath: (p: string, len: number) => {
+      if (p.length > len) {
+        return '...' + p.slice(p.length - len + 3);
+      }
+      return p;
+    },
+  };
+});
+
+const defaultProps = {
+  model: 'gemini-pro',
+  targetDir:
+    '/Users/test/project/foo/bar/and/some/more/directories/to/make/it/long',
+  branchName: 'main',
+  debugMode: false,
+  debugMessage: '',
+  corgiMode: false,
+  errorCount: 0,
+  showErrorDetails: false,
+  showMemoryUsage: false,
+  promptTokenCount: 100,
+  nightly: false,
+};
+
+const renderWithWidth = (width: number, props = defaultProps) => {
+  useTerminalSizeMock.mockReturnValue({ columns: width, rows: 24 });
+  return render(<Footer {...props} />);
+};
+
+describe('<Footer />', () => {
+  it('renders the component', () => {
+    const { lastFrame } = renderWithWidth(120);
+    expect(lastFrame()).toBeDefined();
+  });
+
+  describe('path display', () => {
+    it('should display shortened path on a wide terminal', () => {
+      const { lastFrame } = renderWithWidth(120);
+      const tildePath = tildeifyPath(defaultProps.targetDir);
+      const expectedPath = '...' + tildePath.slice(tildePath.length - 48 + 3);
+      expect(lastFrame()).toContain(expectedPath);
+    });
+
+    it('should display only the base directory name on a narrow terminal', () => {
+      const { lastFrame } = renderWithWidth(79);
+      const expectedPath = path.basename(defaultProps.targetDir);
+      expect(lastFrame()).toContain(expectedPath);
+    });
+
+    it('should use wide layout at 80 columns', () => {
+      const { lastFrame } = renderWithWidth(80);
+      const tildePath = tildeifyPath(defaultProps.targetDir);
+      const expectedPath = '...' + tildePath.slice(tildePath.length - 32 + 3);
+      expect(lastFrame()).toContain(expectedPath);
+    });
+
+    it('should use narrow layout at 79 columns', () => {
+      const { lastFrame } = renderWithWidth(79);
+      const expectedPath = path.basename(defaultProps.targetDir);
+      expect(lastFrame()).toContain(expectedPath);
+      const tildePath = tildeifyPath(defaultProps.targetDir);
+      const unexpectedPath = '...' + tildePath.slice(tildePath.length - 31 + 3);
+      expect(lastFrame()).not.toContain(unexpectedPath);
+    });
+  });
+
+  it('displays the branch name when provided', () => {
+    const { lastFrame } = renderWithWidth(120);
+    expect(lastFrame()).toContain(`(${defaultProps.branchName}*)`);
+  });
+
+  it('does not display the branch name when not provided', () => {
+    const { lastFrame } = renderWithWidth(120, {
+      ...defaultProps,
+      branchName: undefined,
+    });
+    expect(lastFrame()).not.toContain(`(${defaultProps.branchName}*)`);
+  });
+
+  it('displays the model name and context percentage', () => {
+    const { lastFrame } = renderWithWidth(120);
+    expect(lastFrame()).toContain(defaultProps.model);
+    expect(lastFrame()).toMatch(/\(\d+% context[\s\S]*left\)/);
+  });
+
+  describe('sandbox and trust info', () => {
+    it('should display untrusted when isTrustedFolder is false', () => {
+      const { lastFrame } = renderWithWidth(120, {
+        ...defaultProps,
+        isTrustedFolder: false,
+      });
+      expect(lastFrame()).toContain('untrusted');
+    });
+
+    it('should display custom sandbox info when SANDBOX env is set', () => {
+      vi.stubEnv('SANDBOX', 'gemini-cli-test-sandbox');
+      const { lastFrame } = renderWithWidth(120, {
+        ...defaultProps,
+        isTrustedFolder: undefined,
+      });
+      expect(lastFrame()).toContain('test');
+      vi.unstubAllEnvs();
+    });
+
+    it('should display macOS Seatbelt info when SANDBOX is sandbox-exec', () => {
+      vi.stubEnv('SANDBOX', 'sandbox-exec');
+      vi.stubEnv('SEATBELT_PROFILE', 'test-profile');
+      const { lastFrame } = renderWithWidth(120, {
+        ...defaultProps,
+        isTrustedFolder: true,
+      });
+      expect(lastFrame()).toMatch(/macOS Seatbelt.*\(test-profile\)/s);
+      vi.unstubAllEnvs();
+    });
+
+    it('should display "no sandbox" when SANDBOX is not set and folder is trusted', () => {
+      // Clear any SANDBOX env var that might be set.
+      vi.stubEnv('SANDBOX', '');
+      const { lastFrame } = renderWithWidth(120, {
+        ...defaultProps,
+        isTrustedFolder: true,
+      });
+      expect(lastFrame()).toContain('no sandbox');
+      vi.unstubAllEnvs();
+    });
+
+    it('should prioritize untrusted message over sandbox info', () => {
+      vi.stubEnv('SANDBOX', 'gemini-cli-test-sandbox');
+      const { lastFrame } = renderWithWidth(120, {
+        ...defaultProps,
+        isTrustedFolder: false,
+      });
+      expect(lastFrame()).toContain('untrusted');
+      expect(lastFrame()).not.toMatch(/test-sandbox/s);
+      vi.unstubAllEnvs();
+    });
+  });
+});

package/dist/ui/components/Footer.tsx

@@ -0,0 +1,158 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { Box, Text } from 'ink';
+import { theme } from '../semantic-colors.js';
+import { shortenPath, tildeifyPath } from 'fss-link-core';
+import { ConsoleSummaryDisplay } from './ConsoleSummaryDisplay.js';
+import process from 'node:process';
+import path from 'node:path';
+import Gradient from 'ink-gradient';
+import { MemoryUsageDisplay } from './MemoryUsageDisplay.js';
+import { ContextUsageDisplay } from './ContextUsageDisplay.js';
+import { DebugProfiler } from './DebugProfiler.js';
+
+import { useTerminalSize } from '../hooks/useTerminalSize.js';
+import { isNarrowWidth } from '../utils/isNarrowWidth.js';
+
+interface FooterProps {
+  model: string;
+  targetDir: string;
+  branchName?: string;
+  debugMode: boolean;
+  debugMessage: string;
+  corgiMode: boolean;
+  errorCount: number;
+  showErrorDetails: boolean;
+  showMemoryUsage?: boolean;
+  promptTokenCount: number;
+  nightly: boolean;
+  vimMode?: string;
+  isTrustedFolder?: boolean;
+  config?: import('fss-link-core').Config | null;
+}
+
+export const Footer: React.FC<FooterProps> = ({
+  model,
+  targetDir,
+  branchName,
+  debugMode,
+  debugMessage,
+  corgiMode,
+  errorCount,
+  showErrorDetails,
+  showMemoryUsage,
+  promptTokenCount,
+  nightly,
+  vimMode,
+  isTrustedFolder,
+  config,
+}) => {
+  const { columns: terminalWidth } = useTerminalSize();
+
+  const isNarrow = isNarrowWidth(terminalWidth);
+
+  // Adjust path length based on terminal width
+  const pathLength = Math.max(20, Math.floor(terminalWidth * 0.4));
+  const displayPath = isNarrow
+    ? path.basename(tildeifyPath(targetDir))
+    : shortenPath(tildeifyPath(targetDir), pathLength);
+
+  return (
+    <Box
+      justifyContent="space-between"
+      width="100%"
+      flexDirection={isNarrow ? 'column' : 'row'}
+      alignItems={isNarrow ? 'flex-start' : 'center'}
+    >
+      <Box>
+        {debugMode && <DebugProfiler />}
+        {vimMode && <Text color={theme.text.secondary}>[{vimMode}] </Text>}
+        {nightly ? (
+          <Gradient colors={theme.ui.gradient}>
+            <Text>
+              {displayPath}
+              {branchName && <Text> ({branchName}*)</Text>}
+            </Text>
+          </Gradient>
+        ) : (
+          <Text color={theme.text.link}>
+            {displayPath}
+            {branchName && (
+              <Text color={theme.text.secondary}> ({branchName}*)</Text>
+            )}
+          </Text>
+        )}
+        {debugMode && (
+          <Text color={theme.status.error}>
+            {' ' + (debugMessage || '--debug')}
+          </Text>
+        )}
+      </Box>
+
+      {/* Middle Section: Centered Trust/Sandbox Info */}
+      <Box
+        flexGrow={isNarrow ? 0 : 1}
+        alignItems="center"
+        justifyContent={isNarrow ? 'flex-start' : 'center'}
+        display="flex"
+        paddingX={isNarrow ? 0 : 1}
+        paddingTop={isNarrow ? 1 : 0}
+      >
+        {isTrustedFolder === false ? (
+          <Text color={theme.status.warning}>untrusted</Text>
+        ) : process.env['SANDBOX'] &&
+          process.env['SANDBOX'] !== 'sandbox-exec' ? (
+          <Text color="green">
+            {process.env['SANDBOX'].replace(/^gemini-(?:cli-)?/, '')}
+          </Text>
+        ) : process.env['SANDBOX'] === 'sandbox-exec' ? (
+          <Text color={theme.status.warning}>
+            macOS Seatbelt{' '}
+            <Text color={theme.text.secondary}>
+              ({process.env['SEATBELT_PROFILE']})
+            </Text>
+          </Text>
+        ) : (
+          <Text color={theme.status.error}>
+            no sandbox <Text color={theme.text.secondary}>(see /docs)</Text>
+          </Text>
+        )}
+      </Box>
+
+      {/* Right Section: Gemini Label and Console Summary */}
+      <Box alignItems="center" paddingTop={isNarrow ? 1 : 0}>
+        <Text color={theme.text.accent}>
+          {isNarrow ? '' : ' '}
+          {model}{' '}
+          <ContextUsageDisplay
+            promptTokenCount={promptTokenCount}
+            model={model}
+            config={config}
+          />
+        </Text>
+        {corgiMode && (
+          <Text>
+            <Text color={theme.ui.symbol}>| </Text>
+            <Text color={theme.status.error}>▼</Text>
+            <Text color={theme.text.primary}>(´</Text>
+            <Text color={theme.status.error}>ᴥ</Text>
+            <Text color={theme.text.primary}>`)</Text>
+            <Text color={theme.status.error}>▼ </Text>
+          </Text>
+        )}
+        {!showErrorDetails && errorCount > 0 && (
+          <Box>
+            <Text color={theme.ui.symbol}>| </Text>
+            <ConsoleSummaryDisplay errorCount={errorCount} />
+          </Box>
+        )}
+        {showMemoryUsage && <MemoryUsageDisplay />}
+      </Box>
+    </Box>
+  );
+};

package/dist/ui/components/GeminiKeyDialog.tsx

@@ -0,0 +1,252 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { useState, useEffect } from 'react';
+import { Box, Text } from 'ink';
+import { Colors } from '../colors.js';
+import { useKeypress } from '../hooks/useKeypress.js';
+import { RadioButtonSelect } from './shared/RadioButtonSelect.js';
+import { TextInput } from './shared/TextInput.js';
+import { ProviderManager } from '../../config/providerManager.js';
+import { AuthType } from 'fss-link-core';
+
+interface SavedGeminiKey {
+  id: number;
+  name: string;
+  keyPreview: string; // First/last few characters for identification
+  lastUsed?: Date;
+  isDefault: boolean;
+}
+
+interface GeminiKeyDialogProps {
+  onSelect: (apiKey: string) => void;
+  onCancel: () => void;
+}
+
+export function GeminiKeyDialog({ onSelect, onCancel }: GeminiKeyDialogProps) {
+  const [savedKeys, setSavedKeys] = useState<SavedGeminiKey[]>([]);
+  const [isLoading, setIsLoading] = useState(true);
+  const [mode, setMode] = useState<'select' | 'add'>('select');
+  const [newKey, setNewKey] = useState({ name: '', key: '' });
+  const [selectedIndex, setSelectedIndex] = useState(0);
+  const [inputField, setInputField] = useState<'name' | 'key'>('name');
+
+  useEffect(() => {
+    const loadSavedKeys = async () => {
+      try {
+        const providerManager = ProviderManager.getInstance();
+        const geminiProviders = await providerManager.getProvidersByType(AuthType.USE_GEMINI);
+        
+        const keys: SavedGeminiKey[] = geminiProviders
+          .filter(p => p.apiKey)
+          .map(p => ({
+            id: p.id!,
+            name: p.displayName || `Gemini Key ${p.id}`,
+            keyPreview: maskApiKey(p.apiKey!),
+            lastUsed: p.lastUsed,
+            isDefault: p.isFavorite
+          }));
+
+        setSavedKeys(keys);
+      } catch (error) {
+        console.error('Failed to load saved Gemini keys:', error);
+      } finally {
+        setIsLoading(false);
+      }
+    };
+
+    loadSavedKeys();
+  }, []);
+
+  const maskApiKey = (key: string): string => {
+    if (key.length < 8) return key;
+    const start = key.slice(0, 4);
+    const end = key.slice(-4);
+    return `${start}...${end}`;
+  };
+
+  useKeypress((input, key) => {
+    if (mode === 'select') {
+      const totalOptions = savedKeys.length + 1; // +1 for "Add New" option
+      
+      if (key?.upArrow) {
+        setSelectedIndex(Math.max(0, selectedIndex - 1));
+      } else if (key?.downArrow) {
+        setSelectedIndex(Math.min(totalOptions - 1, selectedIndex + 1));
+      } else if (key?.return) {
+        if (selectedIndex === savedKeys.length) {
+          // Add new key option selected
+          setMode('add');
+        } else {
+          // Existing key selected
+          handleKeySelection(savedKeys[selectedIndex]);
+        }
+      } else if (key?.escape || input === 'q') {
+        onCancel();
+      }
+    } else if (mode === 'add') {
+      if (key?.escape) {
+        setMode('select');
+        setNewKey({ name: '', key: '' });
+      } else if (key?.tab) {
+        setInputField(inputField === 'name' ? 'key' : 'name');
+      } else if (key?.return && inputField === 'key') {
+        if (newKey.name && newKey.key) {
+          saveNewKey();
+        }
+      }
+    }
+  });
+
+  const handleKeySelection = async (savedKey: SavedGeminiKey) => {
+    try {
+      const providerManager = ProviderManager.getInstance();
+      const providers = await providerManager.getAllProviders();
+      const provider = providers.find(p => p.id === savedKey.id);
+      
+      if (provider?.apiKey) {
+        // Update usage tracking
+        await providerManager.recordUsage(savedKey.id, 0, 0);
+        onSelect(provider.apiKey);
+      }
+    } catch (error) {
+      console.error('Failed to select API key:', error);
+    }
+  };
+
+  const saveNewKey = async () => {
+    try {
+      const providerManager = ProviderManager.getInstance();
+      
+      const providerId = await providerManager.autoConfigureFromSuccess(
+        AuthType.USE_GEMINI,
+        'gemini-2.0-flash', // Default model
+        undefined, // Use default Gemini endpoint
+        newKey.key,
+        { keyName: newKey.name }
+      );
+
+      // Mark as favorite if it's the first one
+      if (savedKeys.length === 0) {
+        await providerManager.setFavoriteProvider(providerId, true);
+      }
+
+      onSelect(newKey.key);
+    } catch (error) {
+      console.error('Failed to save new API key:', error);
+    }
+  };
+
+  if (isLoading) {
+    return (
+      <Box flexDirection="column" padding={1}>
+        <Text color={Colors.AccentBlue}>Loading saved Gemini API keys...</Text>
+      </Box>
+    );
+  }
+
+  if (mode === 'add') {
+    return (
+      <Box flexDirection="column" padding={1}>
+        <Text color={Colors.AccentBlue} bold>
+          Add Gemini API Key
+        </Text>
+        <Text color={Colors.Gray} marginBottom={1}>
+          Tab to switch fields, Enter to save, Escape to cancel
+        </Text>
+
+        <Box marginBottom={1}>
+          <Text color={inputField === 'name' ? Colors.AccentGreen : Colors.Gray}>
+            Name: 
+          </Text>
+          <TextInput
+            value={newKey.name}
+            onChange={(value) => setNewKey(prev => ({ ...prev, name: value }))}
+            isActive={inputField === 'name'}
+            placeholder="e.g., Personal Gemini Key"
+          />
+        </Box>
+
+        <Box marginBottom={1}>
+          <Text color={inputField === 'key' ? Colors.AccentGreen : Colors.Gray}>
+            API Key: 
+          </Text>
+          <TextInput
+            value={newKey.key}
+            onChange={(value) => setNewKey(prev => ({ ...prev, key: value }))}
+            isActive={inputField === 'key'}
+            placeholder="AIza..."
+            mask="*"
+          />
+        </Box>
+
+        <Text color={Colors.Gray} fontSize={0.8}>
+          {newKey.name && newKey.key 
+            ? "Press Enter to save API key" 
+            : "Both name and API key are required"}
+        </Text>
+
+        <Box marginTop={1}>
+          <Text color={Colors.Comment} fontSize={0.8}>
+            Get your API key from: https://aistudio.google.com/app/apikey
+          </Text>
+        </Box>
+      </Box>
+    );
+  }
+
+  const options = [
+    ...savedKeys.map(key => ({
+      label: key.name,
+      description: `${key.keyPreview}${key.isDefault ? ' (Default)' : ''}${key.lastUsed ? ` - Last used: ${key.lastUsed.toLocaleDateString()}` : ''}`,
+      value: key
+    })),
+    {
+      label: '+ Add New API Key',
+      description: 'Save a new Gemini API key',
+      value: 'add'
+    }
+  ];
+
+  return (
+    <Box flexDirection="column" padding={1}>
+      <Text color={Colors.AccentBlue} bold marginBottom={1}>
+        Select Gemini API Key
+      </Text>
+      
+      {savedKeys.length === 0 ? (
+        <Text color={Colors.Gray} marginBottom={1}>
+          No saved API keys found. Add your first Gemini API key.
+        </Text>
+      ) : (
+        <Text color={Colors.Gray} marginBottom={1}>
+          Choose from saved API keys or add a new one
+        </Text>
+      )}
+
+      <RadioButtonSelect
+        options={options}
+        selectedIndex={selectedIndex}
+        onSelect={(option) => {
+          if (option.value === 'add') {
+            setMode('add');
+          } else {
+            handleKeySelection(option.value as SavedGeminiKey);
+          }
+        }}
+        colors={{
+          selected: Colors.AccentGreen,
+          unselected: Colors.Gray,
+          description: Colors.Comment
+        }}
+      />
+
+      <Text color={Colors.Gray} marginTop={1} fontSize={0.8}>
+        ↑/↓ navigate, Enter select, q/Escape cancel
+      </Text>
+    </Box>
+  );
+}

package/dist/ui/components/GeminiRespondingSpinner.tsx

@@ -0,0 +1,34 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { Text } from 'ink';
+import Spinner from 'ink-spinner';
+import type { SpinnerName } from 'cli-spinners';
+import { useStreamingContext } from '../contexts/StreamingContext.js';
+import { StreamingState } from '../types.js';
+
+interface GeminiRespondingSpinnerProps {
+  /**
+   * Optional string to display when not in Responding state.
+   * If not provided and not Responding, renders null.
+   */
+  nonRespondingDisplay?: string;
+  spinnerType?: SpinnerName;
+}
+
+export const GeminiRespondingSpinner: React.FC<
+  GeminiRespondingSpinnerProps
+> = ({ nonRespondingDisplay, spinnerType = 'dots' }) => {
+  const streamingState = useStreamingContext();
+
+  if (streamingState === StreamingState.Responding) {
+    return <Spinner type={spinnerType} />;
+  } else if (nonRespondingDisplay) {
+    return <Text>{nonRespondingDisplay}</Text>;
+  }
+  return null;
+};