Merge main into massive-terminal-upgrade

Resolves merge conflicts:
- apps/server/src/routes/terminal/common.ts: Keep randomBytes import, use @automaker/utils for createLogger
- apps/ui/eslint.config.mjs: Use main's explicit globals list with XMLHttpRequest and MediaQueryListEvent additions
- apps/ui/src/components/views/terminal-view.tsx: Keep our terminal improvements (killAllSessions, beforeunload, better error handling)
- apps/ui/src/config/terminal-themes.ts: Keep our search highlight colors for all themes
- apps/ui/src/store/app-store.ts: Keep our terminal settings persistence improvements (merge function)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

apps/ui/src/components/views/settings-view.tsx

@@ -1,27 +1,24 @@
+import { useState } from 'react';
+import { useAppStore } from '@/store/app-store';
 
-import { useState } from "react";
-import { useAppStore } from "@/store/app-store";
-
-import { useCliStatus, useSettingsView } from "./settings-view/hooks";
-import { NAV_ITEMS } from "./settings-view/config/navigation";
-import { SettingsHeader } from "./settings-view/components/settings-header";
-import { KeyboardMapDialog } from "./settings-view/components/keyboard-map-dialog";
-import { DeleteProjectDialog } from "./settings-view/components/delete-project-dialog";
-import { SettingsNavigation } from "./settings-view/components/settings-navigation";
-import { ApiKeysSection } from "./settings-view/api-keys/api-keys-section";
-import { ClaudeCliStatus } from "./settings-view/cli-status/claude-cli-status";
-import { AIEnhancementSection } from "./settings-view/ai-enhancement";
-import { AppearanceSection } from "./settings-view/appearance/appearance-section";
-import { TerminalSection } from "./settings-view/terminal/terminal-section";
-import { AudioSection } from "./settings-view/audio/audio-section";
-import { KeyboardShortcutsSection } from "./settings-view/keyboard-shortcuts/keyboard-shortcuts-section";
-import { FeatureDefaultsSection } from "./settings-view/feature-defaults/feature-defaults-section";
-import { DangerZoneSection } from "./settings-view/danger-zone/danger-zone-section";
-import type {
-  Project as SettingsProject,
-  Theme,
-} from "./settings-view/shared/types";
-import type { Project as ElectronProject } from "@/lib/electron";
+import { useCliStatus, useSettingsView } from './settings-view/hooks';
+import { NAV_ITEMS } from './settings-view/config/navigation';
+import { SettingsHeader } from './settings-view/components/settings-header';
+import { KeyboardMapDialog } from './settings-view/components/keyboard-map-dialog';
+import { DeleteProjectDialog } from './settings-view/components/delete-project-dialog';
+import { SettingsNavigation } from './settings-view/components/settings-navigation';
+import { ApiKeysSection } from './settings-view/api-keys/api-keys-section';
+import { ClaudeUsageSection } from './settings-view/api-keys/claude-usage-section';
+import { ClaudeCliStatus } from './settings-view/cli-status/claude-cli-status';
+import { AIEnhancementSection } from './settings-view/ai-enhancement';
+import { AppearanceSection } from './settings-view/appearance/appearance-section';
+import { TerminalSection } from './settings-view/terminal/terminal-section';
+import { AudioSection } from './settings-view/audio/audio-section';
+import { KeyboardShortcutsSection } from './settings-view/keyboard-shortcuts/keyboard-shortcuts-section';
+import { FeatureDefaultsSection } from './settings-view/feature-defaults/feature-defaults-section';
+import { DangerZoneSection } from './settings-view/danger-zone/danger-zone-section';
+import type { Project as SettingsProject, Theme } from './settings-view/shared/types';
+import type { Project as ElectronProject } from '@/lib/electron';
 
 export function SettingsView() {
   const {
@@ -47,12 +44,17 @@ export function SettingsView() {
     defaultAIProfileId,
     setDefaultAIProfileId,
     aiProfiles,
+    apiKeys,
   } = useAppStore();
 
+  // Hide usage tracking when using API key (only show for Claude Code CLI users)
+  // Also hide on Windows for now (CLI usage command not supported)
+  const isWindows =
+    typeof navigator !== 'undefined' && navigator.platform?.toLowerCase().includes('win');
+  const showUsageTracking = !apiKeys.anthropic && !isWindows;
+
   // Convert electron Project to settings-view Project type
-  const convertProject = (
-    project: ElectronProject | null
-  ): SettingsProject | null => {
+  const convertProject = (project: ElectronProject | null): SettingsProject | null => {
     if (!project) return null;
     return {
       id: project.id,
@@ -79,8 +81,7 @@ export function SettingsView() {
   };
 
   // Use CLI status hook
-  const { claudeCliStatus, isCheckingClaudeCli, handleRefreshClaudeCli } =
-    useCliStatus();
+  const { claudeCliStatus, isCheckingClaudeCli, handleRefreshClaudeCli } = useCliStatus();
 
   // Use settings view navigation hook
   const { activeView, navigateTo } = useSettingsView();
@@ -91,17 +92,20 @@ export function SettingsView() {
   // Render the active section based on current view
   const renderActiveSection = () => {
     switch (activeView) {
-      case "claude":
+      case 'claude':
         return (
-          <ClaudeCliStatus
-            status={claudeCliStatus}
-            isChecking={isCheckingClaudeCli}
-            onRefresh={handleRefreshClaudeCli}
-          />
+          <div className="space-y-6">
+            <ClaudeCliStatus
+              status={claudeCliStatus}
+              isChecking={isCheckingClaudeCli}
+              onRefresh={handleRefreshClaudeCli}
+            />
+            {showUsageTracking && <ClaudeUsageSection />}
+          </div>
         );
-      case "ai-enhancement":
+      case 'ai-enhancement':
         return <AIEnhancementSection />;
-      case "appearance":
+      case 'appearance':
         return (
           <AppearanceSection
             effectiveTheme={effectiveTheme}
@@ -109,22 +113,17 @@ export function SettingsView() {
             onThemeChange={handleSetTheme}
           />
         );
-      case "terminal":
+      case 'terminal':
         return <TerminalSection />;
-      case "keyboard":
+      case 'keyboard':
         return (
-          <KeyboardShortcutsSection
-            onOpenKeyboardMap={() => setShowKeyboardMapDialog(true)}
-          />
+          <KeyboardShortcutsSection onOpenKeyboardMap={() => setShowKeyboardMapDialog(true)} />
         );
-      case "audio":
+      case 'audio':
         return (
-          <AudioSection
-            muteDoneSound={muteDoneSound}
-            onMuteDoneSoundChange={setMuteDoneSound}
-          />
+          <AudioSection muteDoneSound={muteDoneSound} onMuteDoneSoundChange={setMuteDoneSound} />
         );
-      case "defaults":
+      case 'defaults':
         return (
           <FeatureDefaultsSection
             showProfilesOnly={showProfilesOnly}
@@ -144,7 +143,7 @@ export function SettingsView() {
             onDefaultAIProfileIdChange={setDefaultAIProfileId}
           />
         );
-      case "danger":
+      case 'danger':
         return (
           <DangerZoneSection
             project={settingsProject}
@@ -157,10 +156,7 @@ export function SettingsView() {
   };
 
   return (
-    <div
-      className="flex-1 flex flex-col overflow-hidden content-bg"
-      data-testid="settings-view"
-    >
+    <div className="flex-1 flex flex-col overflow-hidden content-bg" data-testid="settings-view">
       {/* Header Section */}
       <SettingsHeader />
 
@@ -181,10 +177,7 @@ export function SettingsView() {
       </div>
 
       {/* Keyboard Map Dialog */}
-      <KeyboardMapDialog
-        open={showKeyboardMapDialog}
-        onOpenChange={setShowKeyboardMapDialog}
-      />
+      <KeyboardMapDialog open={showKeyboardMapDialog} onOpenChange={setShowKeyboardMapDialog} />
 
       {/* Delete Project Confirmation Dialog */}
       <DeleteProjectDialog