claude-session-dashboard 0.1.3 → 0.3.0

package/dist/server/assets/project-analytics.server-BkWSd6a8.js

@@ -0,0 +1,61 @@
+import { c as createServerRpc } from "./createServerRpc-Bd3B-Ah9.js";
+import { s as scanAllSessions } from "./session-scanner-CLfls9u-.js";
+import { c as createServerFn } from "../server.js";
+import "node:fs";
+import "node:path";
+import "./claude-path-BdwflgZ1.js";
+import "node:os";
+import "./session-parser-CAEXxF1D.js";
+import "node:readline";
+import "@tanstack/history";
+import "@tanstack/router-core/ssr/client";
+import "@tanstack/router-core";
+import "node:async_hooks";
+import "@tanstack/router-core/ssr/server";
+import "h3-v2";
+import "tiny-invariant";
+import "seroval";
+import "react/jsx-runtime";
+import "@tanstack/react-router/ssr/server";
+import "@tanstack/react-router";
+function aggregateProjectAnalytics(allSessions) {
+  const projectMap = /* @__PURE__ */ new Map();
+  for (const session of allSessions) {
+    const existing = projectMap.get(session.projectPath) ?? [];
+    existing.push(session);
+    projectMap.set(session.projectPath, existing);
+  }
+  const projects = [];
+  for (const [projectPath, sessions] of projectMap) {
+    if (sessions.length === 0) continue;
+    const firstSession = sessions[0];
+    projects.push({
+      projectPath,
+      projectName: firstSession.projectName ?? projectPath.split("/").pop() ?? "Unknown",
+      totalSessions: sessions.length,
+      activeSessions: sessions.filter((s) => s.isActive).length,
+      totalMessages: sessions.reduce((sum, s) => sum + s.messageCount, 0),
+      totalDurationMs: sessions.reduce((sum, s) => sum + s.durationMs, 0),
+      firstSessionAt: sessions.reduce((min, s) => s.startedAt < min ? s.startedAt : min, firstSession.startedAt),
+      lastSessionAt: sessions.reduce((max, s) => s.lastActiveAt > max ? s.lastActiveAt : max, firstSession.lastActiveAt)
+    });
+  }
+  projects.sort((a, b) => b.lastSessionAt.localeCompare(a.lastSessionAt));
+  return {
+    projects
+  };
+}
+const getProjectAnalytics_createServerFn_handler = createServerRpc({
+  id: "64052f224a1d6696436e5d3deeee2b798f0742e1292ffabd038c3a7bf75e6fcb",
+  name: "getProjectAnalytics",
+  filename: "src/features/project-analytics/project-analytics.server.ts"
+}, (opts) => getProjectAnalytics.__executeServer(opts));
+const getProjectAnalytics = createServerFn({
+  method: "GET"
+}).handler(getProjectAnalytics_createServerFn_handler, async () => {
+  const allSessions = await scanAllSessions();
+  return aggregateProjectAnalytics(allSessions);
+});
+export {
+  getProjectAnalytics_createServerFn_handler
+};

package/dist/server/assets/{router-xTSe9UH_.js → router-Cb_hBXHI.js}

@@ -1,27 +1,31 @@
 import { createRootRoute, Outlet, HeadContent, Scripts, createFileRoute, lazyRouteComponent, redirect, createRouter } from "@tanstack/react-router";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { QueryClientProvider, QueryClient } from "@tanstack/react-query";
-import { useState, useRef, useEffect, useCallback, createContext, useContext } from "react";
+import { useState, useRef, useCallback, createContext, useContext } from "react";
 import { z } from "zod";
 const OS_USERNAME_PATTERN = /^(\/(?:Users|home))\/[^/]+/;
-function anonymizePath(path) {
+function anonymizePath(path, anonymizedProjectName) {
+  if (anonymizedProjectName) {
+    return `.../${anonymizedProjectName}`;
+  }
   return path.replace(OS_USERNAME_PATTERN, "$1/user");
 }
 const STORAGE_KEY = "claude-dashboard:privacy-mode";
+function readStoredPrivacyMode() {
+  if (typeof window === "undefined") return false;
+  try {
+    return localStorage.getItem(STORAGE_KEY) === "true";
+  } catch {
+    return false;
+  }
+}
 const PrivacyContext = createContext(null);
 function PrivacyProvider({ children }) {
-  const [privacyMode, setPrivacyMode] = useState(false);
+  const [privacyMode, setPrivacyMode] = useState(readStoredPrivacyMode);
   const projectNameMapRef = useRef(/* @__PURE__ */ new Map());
   const nextIndexRef = useRef(1);
-  useEffect(() => {
-    try {
-      const stored = localStorage.getItem(STORAGE_KEY);
-      if (stored === "true") {
-        setPrivacyMode(true);
-      }
-    } catch {
-    }
-  }, []);
+  const branchNameMapRef = useRef(/* @__PURE__ */ new Map());
+  const nextBranchIndexRef = useRef(1);
   const togglePrivacyMode = useCallback(() => {
     setPrivacyMode((prev) => {
       const next = !prev;
@@ -31,16 +35,11 @@ function PrivacyProvider({ children }) {
       }
       projectNameMapRef.current = /* @__PURE__ */ new Map();
       nextIndexRef.current = 1;
+      branchNameMapRef.current = /* @__PURE__ */ new Map();
+      nextBranchIndexRef.current = 1;
       return next;
     });
   }, []);
-  const anonymizePath$1 = useCallback(
-    (path) => {
-      if (!privacyMode) return path;
-      return anonymizePath(path);
-    },
-    [privacyMode]
-  );
   const anonymizeProjectName = useCallback(
     (name) => {
       if (!privacyMode) return name;
@@ -53,14 +52,38 @@ function PrivacyProvider({ children }) {
     },
     [privacyMode]
   );
+  const anonymizePathFn = useCallback(
+    (path, projectName) => {
+      if (!privacyMode) return path;
+      if (projectName) {
+        const anonName = anonymizeProjectName(projectName);
+        return anonymizePath(path, anonName);
+      }
+      return anonymizePath(path);
+    },
+    [privacyMode, anonymizeProjectName]
+  );
+  const anonymizeBranch = useCallback(
+    (branch) => {
+      if (!privacyMode) return branch;
+      const existing = branchNameMapRef.current.get(branch);
+      if (existing) return existing;
+      const anonymized = `branch-${nextBranchIndexRef.current}`;
+      nextBranchIndexRef.current += 1;
+      branchNameMapRef.current.set(branch, anonymized);
+      return anonymized;
+    },
+    [privacyMode]
+  );
   return /* @__PURE__ */ jsx(
     PrivacyContext.Provider,
     {
       value: {
         privacyMode,
         togglePrivacyMode,
-        anonymizePath: anonymizePath$1,
-        anonymizeProjectName
+        anonymizePath: anonymizePathFn,
+        anonymizeProjectName,
+        anonymizeBranch
       },
       children
     }
@@ -73,7 +96,7 @@ function usePrivacy() {
   }
   return ctx;
 }
-const appCss = "/assets/app-DhZyFob1.css";
+const appCss = "/assets/app-D7yorIIh.css";
 const queryClient = new QueryClient({
   defaultOptions: {
     queries: {
@@ -87,13 +110,16 @@ const Route$6 = createRootRoute({
     meta: [
       { charSet: "utf-8" },
       { name: "viewport", content: "width=device-width, initial-scale=1" },
-      { title: "Claude Session Dashboard" }
+      { title: "Claude Session Dashboard" },
+      { name: "theme-color", content: "#141413" },
+      { name: "description", content: "Local observability dashboard for Claude Code sessions" }
     ],
     links: [
       {
         rel: "stylesheet",
         href: appCss
-      }
+      },
+      { rel: "icon", type: "image/svg+xml", href: "/favicon.svg" }
     ]
   }),
   component: RootComponent
@@ -110,7 +136,7 @@ function RootDocument({ children }) {
     ] })
   ] });
 }
-const $$splitComponentImporter$4 = () => import("./_dashboard--ukhquwO.js");
+const $$splitComponentImporter$4 = () => import("./_dashboard-TUzgwLqB.js");
 const Route$5 = createFileRoute("/_dashboard")({
   component: lazyRouteComponent($$splitComponentImporter$4, "component")
 });
@@ -119,15 +145,19 @@ const Route$4 = createFileRoute("/")({
     throw redirect({ to: "/sessions" });
   }
 });
-const $$splitComponentImporter$3 = () => import("./stats-DItsFPp5.js");
+const $$splitComponentImporter$3 = () => import("./stats-BtgVene-.js");
+const statsSearchSchema = z.object({
+  tab: z.enum(["overview", "projects"]).default("overview").catch("overview")
+});
 const Route$3 = createFileRoute("/_dashboard/stats")({
+  validateSearch: statsSearchSchema,
   component: lazyRouteComponent($$splitComponentImporter$3, "component")
 });
-const $$splitComponentImporter$2 = () => import("./settings-ko61yfVs.js");
+const $$splitComponentImporter$2 = () => import("./settings-C0_KyVQQ.js");
 const Route$2 = createFileRoute("/_dashboard/settings")({
   component: lazyRouteComponent($$splitComponentImporter$2, "component")
 });
-const $$splitComponentImporter$1 = () => import("./index-D4VWrt2z.js");
+const $$splitComponentImporter$1 = () => import("./index-CKfH7HpA.js");
 const sessionsSearchSchema = z.object({
   page: z.number().int().min(1).default(1).catch(1),
   pageSize: z.number().int().min(5).max(100).default(5).catch(5),
@@ -139,7 +169,7 @@ const Route$1 = createFileRoute("/_dashboard/sessions/")({
   validateSearch: sessionsSearchSchema,
   component: lazyRouteComponent($$splitComponentImporter$1, "component")
 });
-const $$splitComponentImporter = () => import("./_sessionId-BwZK4Ezz.js");
+const $$splitComponentImporter = () => import("./_sessionId-C-XZIPqn.js");
 const searchSchema = z.object({
   project: z.string().optional()
 });
@@ -202,8 +232,9 @@ const router = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProper
   getRouter
 }, Symbol.toStringTag, { value: "Module" }));
 export {
-  Route$1 as R,
-  Route as a,
+  Route$3 as R,
+  Route$1 as a,
+  Route as b,
   router as r,
   usePrivacy as u
 };

package/dist/server/assets/{session-detail.server-azkRfON2.js → session-detail.server-DLXl-Pn-.js}

@@ -1,7 +1,7 @@
 import { c as createServerRpc } from "./createServerRpc-Bd3B-Ah9.js";
 import * as path from "node:path";
 import * as fs from "node:fs";
-import { e as extractProjectName, g as getProjectsDir, d as decodeProjectDirName } from "./claude-path-CkuljM34.js";
+import { e as extractProjectName, a as getProjectsDir, d as decodeProjectDirName } from "./claude-path-BdwflgZ1.js";
 import { p as parseDetail } from "./session-parser-CAEXxF1D.js";
 import { c as createServerFn } from "../server.js";
 import "node:os";

package/dist/server/assets/session-scanner-CLfls9u-.js

@@ -0,0 +1,93 @@
+import * as fs from "node:fs";
+import * as path from "node:path";
+import { a as getProjectsDir, d as decodeProjectDirName, e as extractProjectName, b as extractSessionId } from "./claude-path-BdwflgZ1.js";
+import { a as parseSummary } from "./session-parser-CAEXxF1D.js";
+async function scanProjects() {
+  const projectsDir = getProjectsDir();
+  let entries;
+  try {
+    entries = await fs.promises.readdir(projectsDir);
+  } catch {
+    return [];
+  }
+  const projects = [];
+  for (const dirName of entries) {
+    const dirPath = path.join(projectsDir, dirName);
+    const stat = await fs.promises.stat(dirPath).catch(() => null);
+    if (!stat?.isDirectory()) continue;
+    const files = await fs.promises.readdir(dirPath).catch(() => []);
+    const sessionFiles = files.filter((f) => f.endsWith(".jsonl"));
+    if (sessionFiles.length === 0) continue;
+    const decodedPath = decodeProjectDirName(dirName);
+    projects.push({
+      dirName,
+      decodedPath,
+      projectName: extractProjectName(decodedPath),
+      sessionFiles
+    });
+  }
+  return projects;
+}
+const ACTIVE_THRESHOLD_MS = 12e4;
+async function isSessionActive(projectDirName, sessionId) {
+  const projectsDir = getProjectsDir();
+  const jsonlPath = path.join(projectsDir, projectDirName, `${sessionId}.jsonl`);
+  const lockDirPath = path.join(projectsDir, projectDirName, sessionId);
+  const stat = await fs.promises.stat(jsonlPath).catch(() => null);
+  if (!stat) return false;
+  const age = Date.now() - stat.mtimeMs;
+  if (age > ACTIVE_THRESHOLD_MS) return false;
+  const lockStat = await fs.promises.stat(lockDirPath).catch(() => null);
+  return lockStat?.isDirectory() ?? false;
+}
+const summaryCache = /* @__PURE__ */ new Map();
+async function scanAllSessions() {
+  const projects = await scanProjects();
+  const summaries = [];
+  for (const project of projects) {
+    for (const file of project.sessionFiles) {
+      const sessionId = extractSessionId(file);
+      const filePath = path.join(
+        getProjectsDir(),
+        project.dirName,
+        file
+      );
+      const stat = await fs.promises.stat(filePath).catch(() => null);
+      if (!stat) continue;
+      const cached = summaryCache.get(sessionId);
+      if (cached && cached.mtimeMs === stat.mtimeMs) {
+        const active = await isSessionActive(project.dirName, sessionId);
+        summaries.push({ ...cached.summary, isActive: active });
+        continue;
+      }
+      const summary = await parseSummary(
+        filePath,
+        sessionId,
+        project.decodedPath,
+        project.projectName,
+        stat.size
+      );
+      if (summary) {
+        const active = await isSessionActive(project.dirName, sessionId);
+        summary.isActive = active;
+        summaryCache.set(sessionId, {
+          mtimeMs: stat.mtimeMs,
+          summary
+        });
+        summaries.push(summary);
+      }
+    }
+  }
+  summaries.sort(
+    (a, b) => new Date(b.lastActiveAt).getTime() - new Date(a.lastActiveAt).getTime()
+  );
+  return summaries;
+}
+async function getActiveSessions() {
+  const all = await scanAllSessions();
+  return all.filter((s) => s.isActive);
+}
+export {
+  getActiveSessions as g,
+  scanAllSessions as s
+};

package/dist/server/assets/sessions.queries-B5ZBiVJy.js

@@ -0,0 +1,42 @@
+import { queryOptions, keepPreviousData } from "@tanstack/react-query";
+import { c as createSsrRpc } from "./createSsrRpc-CVg2UDl0.js";
+import { z } from "zod";
+import { c as createServerFn } from "../server.js";
+const getSessionList = createServerFn({
+  method: "GET"
+}).handler(createSsrRpc("bf8e4a7901f1843bdc9c46be1ad5ad59c615b8bbe611b73eb3ff28f20e43ee0d"));
+const getActiveSessionList = createServerFn({
+  method: "GET"
+}).handler(createSsrRpc("839d29fe93dfa2a6d506af7b48ca25197190a5ff4c796e970ddfdc6e8c98827f"));
+const paginatedSessionsInputSchema = z.object({
+  page: z.number().int().min(1),
+  pageSize: z.number().int().min(5).max(100),
+  search: z.string(),
+  status: z.enum(["all", "active", "completed"]),
+  project: z.string()
+});
+const getPaginatedSessions = createServerFn({
+  method: "GET"
+}).inputValidator((input) => paginatedSessionsInputSchema.parse(input)).handler(createSsrRpc("a3f42f9012fd83586787da8f7cb90649da739dd947d867eb67572f68735ff495"));
+queryOptions({
+  queryKey: ["sessions", "list"],
+  queryFn: () => getSessionList(),
+  refetchInterval: 3e4
+});
+const activeSessionsQuery = queryOptions({
+  queryKey: ["sessions", "active"],
+  queryFn: () => getActiveSessionList(),
+  refetchInterval: 3e3
+});
+function paginatedSessionListQuery(params) {
+  return queryOptions({
+    queryKey: ["sessions", "paginated", params],
+    queryFn: () => getPaginatedSessions({ data: params }),
+    placeholderData: keepPreviousData,
+    refetchInterval: 3e4
+  });
+}
+export {
+  activeSessionsQuery as a,
+  paginatedSessionListQuery as p
+};

package/dist/server/assets/{sessions.server-B8zbmvSM.js → sessions.server-CUhasKW2.js}

@@ -1,11 +1,12 @@
 import { c as createServerRpc } from "./createServerRpc-Bd3B-Ah9.js";
 import { z } from "zod";
-import * as fs from "node:fs";
-import * as path from "node:path";
-import { g as getProjectsDir, d as decodeProjectDirName, e as extractProjectName, b as extractSessionId } from "./claude-path-CkuljM34.js";
-import { a as parseSummary } from "./session-parser-CAEXxF1D.js";
+import { s as scanAllSessions, g as getActiveSessions } from "./session-scanner-CLfls9u-.js";
 import { c as createServerFn } from "../server.js";
+import "node:fs";
+import "node:path";
+import "./claude-path-BdwflgZ1.js";
 import "node:os";
+import "./session-parser-CAEXxF1D.js";
 import "node:readline";
 import "@tanstack/history";
 import "@tanstack/router-core/ssr/client";
@@ -18,91 +19,6 @@ import "seroval";
 import "react/jsx-runtime";
 import "@tanstack/react-router/ssr/server";
 import "@tanstack/react-router";
-async function scanProjects() {
-  const projectsDir = getProjectsDir();
-  let entries;
-  try {
-    entries = await fs.promises.readdir(projectsDir);
-  } catch {
-    return [];
-  }
-  const projects = [];
-  for (const dirName of entries) {
-    const dirPath = path.join(projectsDir, dirName);
-    const stat = await fs.promises.stat(dirPath).catch(() => null);
-    if (!stat?.isDirectory()) continue;
-    const files = await fs.promises.readdir(dirPath).catch(() => []);
-    const sessionFiles = files.filter((f) => f.endsWith(".jsonl"));
-    if (sessionFiles.length === 0) continue;
-    const decodedPath = decodeProjectDirName(dirName);
-    projects.push({
-      dirName,
-      decodedPath,
-      projectName: extractProjectName(decodedPath),
-      sessionFiles
-    });
-  }
-  return projects;
-}
-const ACTIVE_THRESHOLD_MS = 12e4;
-async function isSessionActive(projectDirName, sessionId) {
-  const projectsDir = getProjectsDir();
-  const jsonlPath = path.join(projectsDir, projectDirName, `${sessionId}.jsonl`);
-  const lockDirPath = path.join(projectsDir, projectDirName, sessionId);
-  const stat = await fs.promises.stat(jsonlPath).catch(() => null);
-  if (!stat) return false;
-  const age = Date.now() - stat.mtimeMs;
-  if (age > ACTIVE_THRESHOLD_MS) return false;
-  const lockStat = await fs.promises.stat(lockDirPath).catch(() => null);
-  return lockStat?.isDirectory() ?? false;
-}
-const summaryCache = /* @__PURE__ */ new Map();
-async function scanAllSessions() {
-  const projects = await scanProjects();
-  const summaries = [];
-  for (const project of projects) {
-    for (const file of project.sessionFiles) {
-      const sessionId = extractSessionId(file);
-      const filePath = path.join(
-        getProjectsDir(),
-        project.dirName,
-        file
-      );
-      const stat = await fs.promises.stat(filePath).catch(() => null);
-      if (!stat) continue;
-      const cached = summaryCache.get(sessionId);
-      if (cached && cached.mtimeMs === stat.mtimeMs) {
-        const active = await isSessionActive(project.dirName, sessionId);
-        summaries.push({ ...cached.summary, isActive: active });
-        continue;
-      }
-      const summary = await parseSummary(
-        filePath,
-        sessionId,
-        project.decodedPath,
-        project.projectName,
-        stat.size
-      );
-      if (summary) {
-        const active = await isSessionActive(project.dirName, sessionId);
-        summary.isActive = active;
-        summaryCache.set(sessionId, {
-          mtimeMs: stat.mtimeMs,
-          summary
-        });
-        summaries.push(summary);
-      }
-    }
-  }
-  summaries.sort(
-    (a, b) => new Date(b.lastActiveAt).getTime() - new Date(a.lastActiveAt).getTime()
-  );
-  return summaries;
-}
-async function getActiveSessions() {
-  const all = await scanAllSessions();
-  return all.filter((s) => s.isActive);
-}
 const getSessionList_createServerFn_handler = createServerRpc({
   id: "bf8e4a7901f1843bdc9c46be1ad5ad59c615b8bbe611b73eb3ff28f20e43ee0d",
   name: "getSessionList",

package/dist/server/assets/{settings-ko61yfVs.js → settings-C0_KyVQQ.js}

@@ -1,8 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
+import { useState } from "react";
 import { useQuery } from "@tanstack/react-query";
 import { s as settingsQuery, u as useSettingsMutation } from "./settings.queries-DSQd324O.js";
 import { a as SUBSCRIPTION_TIERS, b as DEFAULT_PRICING, D as DEFAULT_SETTINGS } from "./settings.types-DntadCHo.js";
+import { u as usePrivacy } from "./router-Cb_hBXHI.js";
 import "./createSsrRpc-CVg2UDl0.js";
 import "../server.js";
 import "@tanstack/history";
@@ -24,7 +25,7 @@ function TierSelector({ value, onChange }) {
       {
         type: "button",
         onClick: () => onChange(tier.id),
-        className: `rounded-lg border px-3 py-2 text-left transition-colors ${isSelected ? "border-blue-500 bg-blue-500/10 text-white" : "border-gray-800 bg-gray-900/50 text-gray-400 hover:border-gray-700 hover:text-gray-300"}`,
+        className: `rounded-lg border px-3 py-2 text-left transition-colors ${isSelected ? "border-brand-500 bg-brand-500/10 text-white" : "border-gray-800 bg-gray-900/50 text-gray-400 hover:border-gray-700 hover:text-gray-300"}`,
         children: [
           /* @__PURE__ */ jsx("div", { className: "text-sm font-medium", children: tier.displayName }),
           /* @__PURE__ */ jsx("div", { className: "mt-0.5 font-mono text-[10px] text-gray-500", children: tier.monthlyUSD !== null ? `$${tier.monthlyUSD}/mo` : "Custom" })
@@ -92,28 +93,31 @@ function PricingTableEditor({ overrides, onChange }) {
               min: "0",
               value,
               onChange: (e) => handleCellChange(model.modelId, f.key, e.target.value),
-              className: `w-20 rounded border px-2 py-1 text-right font-mono text-xs ${changed ? "border-blue-500/50 bg-blue-500/10 text-blue-400" : "border-gray-700 bg-gray-800 text-gray-300"} focus:border-blue-500 focus:outline-none`
+              className: `w-20 rounded border px-2 py-1 text-right font-mono text-xs ${changed ? "border-brand-500/50 bg-brand-500/10 text-brand-400" : "border-gray-700 bg-gray-800 text-gray-300"} focus:border-brand-500 focus:outline-none`
             }
           ) }, f.key);
         })
       ] }, model.modelId)) })
     ] }),
-    /* @__PURE__ */ jsx("p", { className: "mt-2 text-[10px] text-gray-600", children: "Prices in USD per million tokens. Overridden values shown in blue." })
+    /* @__PURE__ */ jsx("p", { className: "mt-2 text-[10px] text-gray-600", children: "Prices in USD per million tokens. Overridden values are highlighted." })
   ] });
 }
 function SettingsPage() {
   const { data: settings, isLoading } = useQuery(settingsQuery);
+  if (isLoading || !settings) {
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx("div", { className: "h-8 w-48 animate-pulse rounded bg-gray-800" }),
+      /* @__PURE__ */ jsx("div", { className: "h-64 animate-pulse rounded-xl bg-gray-900/50" })
+    ] });
+  }
+  return /* @__PURE__ */ jsx(SettingsForm, { settings });
+}
+function SettingsForm({ settings }) {
   const mutation = useSettingsMutation();
-  const [tier, setTier] = useState("pro");
-  const [overrides, setOverrides] = useState({});
+  const { privacyMode, togglePrivacyMode } = usePrivacy();
+  const [tier, setTier] = useState(settings.subscriptionTier);
+  const [overrides, setOverrides] = useState(settings.pricingOverrides);
   const [isDirty, setIsDirty] = useState(false);
-  useEffect(() => {
-    if (settings) {
-      setTier(settings.subscriptionTier);
-      setOverrides(settings.pricingOverrides);
-      setIsDirty(false);
-    }
-  }, [settings]);
   function handleTierChange(newTier) {
     setTier(newTier);
     setIsDirty(true);
@@ -139,15 +143,57 @@ function SettingsPage() {
       }
     });
   }
-  if (isLoading) {
-    return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ jsx("div", { className: "h-8 w-48 animate-pulse rounded bg-gray-800" }),
-      /* @__PURE__ */ jsx("div", { className: "h-64 animate-pulse rounded-xl bg-gray-900/50" })
-    ] });
-  }
   return /* @__PURE__ */ jsxs("div", { children: [
     /* @__PURE__ */ jsx("h1", { className: "text-xl font-bold text-white", children: "Settings" }),
     /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-gray-500", children: "Configure your subscription tier and API pricing for cost estimation." }),
+    /* @__PURE__ */ jsxs("div", { className: "mt-6", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-sm font-semibold text-gray-300", children: "Privacy Mode" }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-[10px] text-gray-500", children: "Hide project names, file paths, and branch names across the dashboard. Useful when screen-sharing or recording demos." }),
+      /* @__PURE__ */ jsxs("div", { className: "mt-3 rounded-xl border border-gray-800 bg-gray-900/50 p-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-300", children: "Enable privacy mode" }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-500", children: privacyMode ? "On" : "Off" }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                role: "switch",
+                "aria-checked": privacyMode,
+                onClick: togglePrivacyMode,
+                className: `relative inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full transition-colors ${privacyMode ? "bg-brand-600" : "bg-gray-800"}`,
+                children: /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: `inline-block h-3.5 w-3.5 rounded-full bg-white transition-transform ${privacyMode ? "translate-x-[18px]" : "translate-x-[3px]"}`
+                  }
+                )
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "mt-3 border-t border-gray-800 pt-3", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-[10px] font-medium text-gray-400", children: "What gets hidden:" }),
+          /* @__PURE__ */ jsxs("ul", { className: "mt-1.5 space-y-1 text-[10px] text-gray-500", children: [
+            /* @__PURE__ */ jsxs("li", { children: [
+              /* @__PURE__ */ jsx("span", { className: "text-gray-400", children: "Project names" }),
+              " ",
+              /* @__PURE__ */ jsx("span", { className: "font-mono text-gray-600", children: "→ project-1, project-2, ..." })
+            ] }),
+            /* @__PURE__ */ jsxs("li", { children: [
+              /* @__PURE__ */ jsx("span", { className: "text-gray-400", children: "File paths" }),
+              " ",
+              /* @__PURE__ */ jsx("span", { className: "font-mono text-gray-600", children: "→ .../project-1" })
+            ] }),
+            /* @__PURE__ */ jsxs("li", { children: [
+              /* @__PURE__ */ jsx("span", { className: "text-gray-400", children: "Branch names" }),
+              " ",
+              /* @__PURE__ */ jsx("span", { className: "font-mono text-gray-600", children: "→ branch-1, branch-2, ..." })
+            ] })
+          ] })
+        ] })
+      ] })
+    ] }),
     /* @__PURE__ */ jsxs("div", { className: "mt-6", children: [
       /* @__PURE__ */ jsx("h2", { className: "text-sm font-semibold text-gray-300", children: "Subscription Tier" }),
       /* @__PURE__ */ jsx("p", { className: "mt-1 text-[10px] text-gray-500", children: "Select your Claude subscription plan. This is informational only and does not affect cost calculations." }),
@@ -186,7 +232,7 @@ function SettingsPage() {
             type: "button",
             onClick: handleSave,
             disabled: !isDirty || mutation.isPending,
-            className: `rounded-lg px-4 py-1.5 text-xs font-medium transition-colors ${isDirty && !mutation.isPending ? "bg-blue-600 text-white hover:bg-blue-500" : "cursor-not-allowed bg-gray-800 text-gray-500"}`,
+            className: `rounded-lg px-4 py-1.5 text-xs font-medium transition-colors ${isDirty && !mutation.isPending ? "bg-brand-600 text-white hover:bg-brand-500" : "cursor-not-allowed bg-gray-800 text-gray-500"}`,
             children: mutation.isPending ? "Saving..." : "Save"
           }
         )