feat(settings): Add support for local/project settings

jackall3n · jackall3n · commit 197bea1554f7 · 2025-08-28T12:38:30.000+01:00
diff --git a/.claude/ccstatusline.json b/.claude/ccstatusline.json
@@ -0,0 +1,56 @@
+{
+  "version": 3,
+  "lines": [
+    [
+      {
+        "id": "1",
+        "type": "model",
+        "color": "cyan"
+      },
+      {
+        "id": "2",
+        "type": "separator"
+      },
+      {
+        "id": "3",
+        "type": "context-length",
+        "color": "brightBlack"
+      },
+      {
+        "id": "4",
+        "type": "separator"
+      },
+      {
+        "id": "5",
+        "type": "git-branch",
+        "color": "magenta"
+      },
+      {
+        "id": "6",
+        "type": "separator"
+      },
+      {
+        "id": "7",
+        "type": "git-changes",
+        "color": "yellow"
+      }
+    ]
+  ],
+  "flexMode": "full-minus-40",
+  "compactThreshold": 60,
+  "colorLevel": 2,
+  "inheritSeparatorColors": false,
+  "globalBold": false,
+  "powerline": {
+    "enabled": false,
+    "separators": [
+      ""
+    ],
+    "separatorInvertBackground": [
+      false
+    ],
+    "startCaps": [],
+    "endCaps": [],
+    "autoAlign": false
+  }
+}
diff --git a/src/tui/components/MainMenu.tsx b/src/tui/components/MainMenu.tsx
@@ -6,6 +6,7 @@ import {
 import React, { useState } from 'react';
 
 import type { Settings } from '../../types/Settings';
+import { getSettingsConfiguration } from '../../utils/config';
 import { type PowerlineFontStatus } from '../../utils/powerline';
 
 export interface MainMenuProps {
@@ -18,19 +19,37 @@ export interface MainMenuProps {
     previewIsTruncated?: boolean;
 }
 
-export const MainMenu: React.FC<MainMenuProps> = ({ onSelect, isClaudeInstalled, hasChanges, initialSelection = 0, powerlineFontStatus, settings, previewIsTruncated }) => {
+export const MainMenu: React.FC<MainMenuProps> = ({
+    onSelect,
+    isClaudeInstalled,
+    hasChanges,
+    initialSelection = 0,
+    powerlineFontStatus,
+    settings,
+    previewIsTruncated
+}) => {
     const [selectedIndex, setSelectedIndex] = useState(initialSelection);
 
     // Build menu structure with visual gaps
     const menuItems = [
         { label: '📝 Edit Lines', value: 'lines', selectable: true },
         { label: '🎨 Edit Colors', value: 'colors', selectable: true },
         { label: '⚡ Powerline Setup', value: 'powerline', selectable: true },
-        { label: '', value: '_gap1', selectable: false },  // Visual gap
+        { label: '', value: '_gap1', selectable: false }, // Visual gap
         { label: '💻 Terminal Options', value: 'terminalConfig', selectable: true },
-        { label: '🌐 Global Overrides', value: 'globalOverrides', selectable: true },
-        { label: '', value: '_gap2', selectable: false },  // Visual gap
-        { label: isClaudeInstalled ? '🔌 Uninstall from Claude Code' : '📦 Install to Claude Code', value: 'install', selectable: true }
+        {
+            label: '🌐 Global Overrides',
+            value: 'globalOverrides',
+            selectable: true
+        },
+        { label: '', value: '_gap2', selectable: false }, // Visual gap
+        {
+            label: isClaudeInstalled
+                ? '🔌 Uninstall from Claude Code'
+                : '📦 Install to Claude Code',
+            value: 'install',
+            selectable: true
+        }
     ];
 
     if (hasChanges) {
@@ -61,14 +80,19 @@ export const MainMenu: React.FC<MainMenuProps> = ({ onSelect, isClaudeInstalled,
     // Get description for selected item
     const getDescription = (value: string): string => {
         const descriptions: Record<string, string> = {
-            lines: 'Configure up to 3 status lines with various widgets like model info, git status, and token usage',
-            colors: 'Customize colors for each widget including foreground, background, and bold styling',
-            powerline: 'Install Powerline fonts for enhanced visual separators and symbols in your status line',
-            globalOverrides: 'Set global padding, separators, and color overrides that apply to all widgets',
+            lines:
+        'Configure up to 3 status lines with various widgets like model info, git status, and token usage',
+            colors:
+        'Customize colors for each widget including foreground, background, and bold styling',
+            powerline:
+        'Install Powerline fonts for enhanced visual separators and symbols in your status line',
+            globalOverrides:
+        'Set global padding, separators, and color overrides that apply to all widgets',
             install: isClaudeInstalled
                 ? 'Remove ccstatusline from your Claude Code settings'
                 : 'Add ccstatusline to your Claude Code settings for automatic status line rendering',
-            terminalConfig: 'Configure terminal-specific settings for optimal display',
+            terminalConfig:
+        'Configure terminal-specific settings for optimal display',
             save: 'Save all changes and exit the configuration tool',
             exit: hasChanges
                 ? 'Exit without saving your changes'
@@ -81,16 +105,30 @@ export const MainMenu: React.FC<MainMenuProps> = ({ onSelect, isClaudeInstalled,
     const description = selectedItem ? getDescription(selectedItem.value) : '';
 
     // Check if we should show the truncation warning
-    const showTruncationWarning = previewIsTruncated && settings?.flexMode === 'full-minus-40';
+    const showTruncationWarning
+    = previewIsTruncated && settings?.flexMode === 'full-minus-40';
+
+    const { relativePath: settingsPath } = getSettingsConfiguration();
 
     return (
         <Box flexDirection='column'>
             {showTruncationWarning && (
                 <Box marginBottom={1}>
-                    <Text color='yellow'>⚠ Some lines are truncated, see Terminal Options → Terminal Width for info</Text>
+                    <Text color='yellow'>
+                        ⚠ Some lines are truncated, see Terminal Options → Terminal Width
+                        for info
+                    </Text>
                 </Box>
             )}
-            <Text bold>Main Menu</Text>
+            <Text>
+                <Text bold>Main Menu</Text>
+                <Text dimColor>
+                    {' '}
+                    (
+                    {settingsPath}
+                    )
+                </Text>
+            </Text>
             <Box marginTop={1} flexDirection='column'>
                 {menuItems.map((item, idx) => {
                     if (!item.selectable && item.value.startsWith('_gap')) {
@@ -100,10 +138,7 @@ export const MainMenu: React.FC<MainMenuProps> = ({ onSelect, isClaudeInstalled,
                     const isSelected = selectableIdx === selectedIndex;
 
                     return (
-                        <Text
-                            key={item.value}
-                            color={isSelected ? 'green' : undefined}
-                        >
+                        <Text key={item.value} color={isSelected ? 'green' : undefined}>
                             {isSelected ? '▶  ' : '   '}
                             {item.label}
                         </Text>
@@ -112,7 +147,9 @@ export const MainMenu: React.FC<MainMenuProps> = ({ onSelect, isClaudeInstalled,
             </Box>
             {description && (
                 <Box marginTop={1} paddingLeft={2}>
-                    <Text dimColor wrap='wrap'>{description}</Text>
+                    <Text dimColor wrap='wrap'>
+                        {description}
+                    </Text>
                 </Box>
             )}
         </Box>
diff --git a/src/utils/config.ts b/src/utils/config.ts
@@ -19,16 +19,39 @@ const readFile = fs.promises.readFile;
 const writeFile = fs.promises.writeFile;
 const mkdir = fs.promises.mkdir;
 
-const CONFIG_DIR = path.join(os.homedir(), '.config', 'ccstatusline');
-const SETTINGS_PATH = process.env.CCSTATUSLINE_CONFIG ?? path.join(CONFIG_DIR, 'settings.json');
-const SETTINGS_BACKUP_PATH = path.join(CONFIG_DIR, 'settings.bak');
+export function getSettingsConfiguration() {
+    const projectConfig = path.join(process.cwd(), '.claude', 'ccstatusline.json');
+
+    if (fs.existsSync(projectConfig)) {
+        return {
+            configDir: path.dirname(projectConfig),
+            path: projectConfig,
+            relativePath: path.relative(process.cwd(), projectConfig),
+            type: 'project'
+        };
+    }
+
+    const userConfigDir = path.join(os.homedir(), '.config', 'ccstatusline');
+    const userConfig = path.join(userConfigDir, 'settings.json');
+
+    // Fallback to global config
+    return {
+        configDir: userConfigDir,
+        path: userConfig,
+        relativePath: '~/' + path.relative(os.homedir(), userConfig),
+        type: 'global'
+    };
+}
 
 async function backupBadSettings(): Promise<void> {
     try {
-        if (fs.existsSync(SETTINGS_PATH)) {
-            const content = await readFile(SETTINGS_PATH, 'utf-8');
-            await writeFile(SETTINGS_BACKUP_PATH, content, 'utf-8');
-            console.error(`Bad settings backed up to ${SETTINGS_BACKUP_PATH}`);
+        const { path: settingsPath } = getSettingsConfiguration();
+        const settingsBackupPath = settingsPath.replace('.json', '.json.bak');
+
+        if (fs.existsSync(settingsPath)) {
+            const content = await readFile(settingsPath, 'utf-8');
+            await writeFile(settingsBackupPath, content, 'utf-8');
+            console.error(`Bad settings backed up to ${settingsBackupPath}`);
         }
     } catch (error) {
         console.error('Failed to backup bad settings:', error);
@@ -37,15 +60,10 @@ async function backupBadSettings(): Promise<void> {
 
 async function writeDefaultSettings(): Promise<Settings> {
     const defaults = SettingsSchema.parse({});
-    const settingsWithVersion = {
-        ...defaults,
-        version: CURRENT_VERSION
-    };
 
     try {
-        await mkdir(CONFIG_DIR, { recursive: true });
-        await writeFile(SETTINGS_PATH, JSON.stringify(settingsWithVersion, null, 2), 'utf-8');
-        console.error(`Default settings written to ${SETTINGS_PATH}`);
+        const { path: settingsPath } = await saveSettings(defaults);
+        console.error(`Default settings written to ${settingsPath}`);
     } catch (error) {
         console.error('Failed to write default settings:', error);
     }
@@ -55,11 +73,13 @@ async function writeDefaultSettings(): Promise<Settings> {
 
 export async function loadSettings(): Promise<Settings> {
     try {
+        const { path: settingsPath } = getSettingsConfiguration();
+
         // Check if settings file exists
-        if (!fs.existsSync(SETTINGS_PATH))
+        if (!fs.existsSync(settingsPath))
             return await writeDefaultSettings();
 
-        const content = await readFile(SETTINGS_PATH, 'utf-8');
+        const content = await readFile(settingsPath, 'utf-8');
         let rawData: unknown;
 
         try {
@@ -84,16 +104,17 @@ export async function loadSettings(): Promise<Settings> {
 
             // Migrate v1 to current version and save the migrated settings back to disk
             rawData = migrateConfig(rawData, CURRENT_VERSION);
-            await writeFile(SETTINGS_PATH, JSON.stringify(rawData, null, 2), 'utf-8');
+            await writeFile(settingsPath, JSON.stringify(rawData, null, 2), 'utf-8');
         } else if (needsMigration(rawData, CURRENT_VERSION)) {
             // Handle migrations for versioned configs (v2+) and save the migrated settings back to disk
             rawData = migrateConfig(rawData, CURRENT_VERSION);
-            await writeFile(SETTINGS_PATH, JSON.stringify(rawData, null, 2), 'utf-8');
+            await writeFile(settingsPath, JSON.stringify(rawData, null, 2), 'utf-8');
         }
 
         // At this point, data should be in current format with version field
         // Parse with main schema which will apply all defaults
         const result = SettingsSchema.safeParse(rawData);
+
         if (!result.success) {
             console.error('Failed to parse settings:', result.error);
             await backupBadSettings();
@@ -109,9 +130,11 @@ export async function loadSettings(): Promise<Settings> {
     }
 }
 
-export async function saveSettings(settings: Settings): Promise<void> {
+export async function saveSettings(settings: Settings) {
+    const { path, configDir } = getSettingsConfiguration();
+
     // Ensure config directory exists
-    await mkdir(CONFIG_DIR, { recursive: true });
+    await mkdir(configDir, { recursive: true });
 
     // Always include version when saving
     const settingsWithVersion = {
@@ -120,5 +143,10 @@ export async function saveSettings(settings: Settings): Promise<void> {
     };
 
     // Write settings using Node.js-compatible API
-    await writeFile(SETTINGS_PATH, JSON.stringify(settingsWithVersion, null, 2), 'utf-8');
+    await writeFile(path, JSON.stringify(settingsWithVersion, null, 2), 'utf-8');
+
+    return {
+        settings: settingsWithVersion,
+        path
+    };
 }
