@bahulam/code 0.1.6 → 0.1.7

package/pulse/app/sessions/[id]/page.tsx

@@ -1,243 +0,0 @@
-'use client'
-
-import { use } from 'react'
-import useSWR from 'swr'
-import { TopBar } from '@/components/layout/top-bar'
-import { SessionSidebar } from '@/components/sessions/replay/session-sidebar'
-import { UserTurnCard, AssistantTurnCard } from '@/components/sessions/replay/turn-cards'
-import { TokenAccumulationChart } from '@/components/sessions/replay/token-accumulation-chart'
-import { SessionBadges } from '@/components/sessions/session-badges'
-import { formatCost, formatTokens, formatDuration, projectDisplayName } from '@/lib/decode'
-import type { ReplayData, SessionWithFacet } from '@/types/claude'
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
-import { Skeleton } from '@/components/ui/skeleton'
-import { Alert, AlertDescription } from '@/components/ui/alert'
-import { AlertTriangle, MessageSquare, Coins, DollarSign, Clock, Zap } from 'lucide-react'
-
-const fetcher = (url: string) =>
-  fetch(url).then(r => { if (!r.ok) throw new Error(`API error ${r.status}`); return r.json() })
-
-type ReplayResponse = ReplayData
-
-export default function SessionDetailPage({ params }: { params: Promise<{ id: string }> }) {
-  const { id } = use(params)
-
-  const { data: replayData, error: replayError, isLoading: replayLoading } =
-    useSWR<ReplayResponse>(`/api/sessions/${id}/replay`, fetcher)
-
-  const { data: metaData } =
-    useSWR<{ session: SessionWithFacet }>(`/api/sessions/${id}`, fetcher)
-
-  const meta = metaData?.session
-
-  if (replayError) {
-    return (
-      <div className="flex flex-col min-h-screen">
-        <TopBar title="Session Replay" subtitle="Error" />
-        <div className="p-6">
-          <Alert variant="destructive">
-            <AlertTriangle className="h-4 w-4" />
-            <AlertDescription>Error loading session: {String(replayError)}</AlertDescription>
-          </Alert>
-        </div>
-      </div>
-    )
-  }
-
-  if (replayLoading || !replayData) {
-    return (
-      <div className="flex flex-col min-h-screen">
-        <TopBar title="Session Replay" subtitle="Loading…" />
-        <div className="p-6 space-y-4">
-          <div className="grid grid-cols-2 sm:grid-cols-4 gap-3">
-            {Array.from({ length: 4 }).map((_, i) => <Skeleton key={i} className="h-20 rounded-xl" />)}
-          </div>
-          <div className="space-y-4">
-            {Array.from({ length: 5 }).map((_, i) => (
-              <Skeleton key={i} className={`h-${i % 2 === 0 ? '16' : '28'} rounded-xl`} />
-            ))}
-          </div>
-        </div>
-      </div>
-    )
-  }
-
-  const replay = replayData
-  const projectName = meta ? projectDisplayName(meta.project_path ?? '') : id.slice(0, 8)
-
-  // Total token counts from replay
-  let totalInput = 0, totalOutput = 0, totalCacheRead = 0, totalCacheWrite = 0
-  for (const t of replay.turns) {
-    if (t.usage) {
-      totalInput      += t.usage.input_tokens ?? 0
-      totalOutput     += t.usage.output_tokens ?? 0
-      totalCacheWrite += t.usage.cache_creation_input_tokens ?? 0
-      totalCacheRead  += t.usage.cache_read_input_tokens ?? 0
-    }
-  }
-  const totalTokens = totalInput + totalOutput + totalCacheWrite + totalCacheRead
-
-  // Build tool results map: tool_use_id -> result (from user turns)
-  const toolResults = new Map<string, { content: string; is_error: boolean }>()
-  for (const t of replay.turns) {
-    if (t.type === 'user' && t.tool_results) {
-      for (const r of t.tool_results) {
-        toolResults.set(r.tool_use_id, { content: r.content, is_error: r.is_error })
-      }
-    }
-  }
-
-  // Build compaction map: index of turn before which a compaction occurred
-  const compactionByTurnIndex = new Map(replay.compactions.map(c => [c.turn_index, c]))
-
-  let assistantTurnNum = 0
-
-  return (
-    <div className="flex flex-col min-h-screen">
-      {/* Header */}
-      <TopBar
-        title={`${projectName} · ${replay.slug ?? id.slice(0, 8)}`}
-        subtitle={`${replay.git_branch ?? '?'} · v${replay.version ?? '?'} · ${formatCost(replay.total_cost ?? 0)}`}
-      />
-
-      {/* Stats cards — match project detail page */}
-      <div className="border-b border-border bg-muted/30 px-4 py-4 md:px-6">
-        <div
-          className={
-            3 + (meta ? 1 : 0) + (replay.compactions.length > 0 ? 1 : 0) >= 5
-              ? 'grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-5'
-              : 'grid grid-cols-2 gap-4 sm:grid-cols-4'
-          }
-        >
-          <Card className="gap-0">
-            <CardHeader className="pb-2">
-              <CardDescription className="flex items-center gap-2">
-                <MessageSquare className="h-4 w-4" /> Turns
-              </CardDescription>
-              <CardTitle className="text-3xl font-bold tabular-nums">
-                {replay.turns.filter(t => t.type === 'assistant').length}
-              </CardTitle>
-            </CardHeader>
-            <CardContent>
-              <p className="text-xs text-muted-foreground">Assistant messages</p>
-            </CardContent>
-          </Card>
-
-          <Card className="gap-0">
-            <CardHeader className="pb-2">
-              <CardDescription className="flex items-center gap-2">
-                <Coins className="h-4 w-4" /> Tokens
-              </CardDescription>
-              <CardTitle className="text-3xl font-bold tabular-nums text-blue-700 dark:text-[#60a5fa]">{formatTokens(totalTokens)}</CardTitle>
-            </CardHeader>
-            <CardContent>
-              <p className="text-xs text-muted-foreground">Input + output + cache</p>
-            </CardContent>
-          </Card>
-
-          <Card className="gap-0">
-            <CardHeader className="pb-2">
-              <CardDescription className="flex items-center gap-2">
-                <DollarSign className="h-4 w-4" /> Cost
-              </CardDescription>
-              <CardTitle className="text-3xl font-bold tabular-nums text-[#d97706]">
-                {formatCost(replay.total_cost ?? 0)}
-              </CardTitle>
-            </CardHeader>
-            <CardContent>
-              <p className="text-xs text-muted-foreground">Estimated spend</p>
-            </CardContent>
-          </Card>
-
-          {meta && (
-            <Card className="gap-0">
-              <CardHeader className="pb-2">
-                <CardDescription className="flex items-center gap-2">
-                  <Clock className="h-4 w-4" /> Duration
-                </CardDescription>
-                <CardTitle className="text-3xl font-bold tabular-nums">
-                  {formatDuration(meta.duration_minutes ?? 0)}
-                </CardTitle>
-              </CardHeader>
-              <CardContent>
-                <p className="text-xs text-muted-foreground">Session span</p>
-              </CardContent>
-            </Card>
-          )}
-
-          {replay.compactions.length > 0 && (
-            <Card className="gap-0 border-amber-500/25">
-              <CardHeader className="pb-2">
-                <CardDescription className="flex items-center gap-2">
-                  <Zap className="h-4 w-4 text-amber-500" /> Compactions
-                </CardDescription>
-                <CardTitle className="text-3xl font-bold tabular-nums text-amber-500">
-                  {replay.compactions.length}
-                </CardTitle>
-              </CardHeader>
-              <CardContent>
-                <p className="text-xs text-muted-foreground">Context window events</p>
-              </CardContent>
-            </Card>
-          )}
-        </div>
-
-        {meta && (
-          <div className="mt-4 flex flex-wrap gap-2">
-            <SessionBadges
-              has_compaction={replay.compactions.length > 0}
-              uses_task_agent={meta.uses_task_agent}
-              uses_mcp={meta.uses_mcp}
-              uses_web_search={meta.uses_web_search}
-              uses_web_fetch={meta.uses_web_fetch}
-              has_thinking={meta.has_thinking}
-            />
-          </div>
-        )}
-      </div>
-
-      {/* Two-column layout */}
-      <div className="flex flex-1 overflow-hidden">
-        {/* Conversation replay */}
-        <div className="flex-1 min-w-0 overflow-y-auto px-4 py-6 max-w-6xl">
-          {replay.turns.map((turn, i) => {
-            const compactionBefore = compactionByTurnIndex.get(i)
-
-            if (turn.type === 'user') {
-              return (
-                <UserTurnCard
-                  key={turn.uuid || i}
-                  turn={turn}
-                  turnNumber={i + 1}
-                  compactionBefore={compactionBefore}
-                  toolResults={toolResults}
-                />
-              )
-            }
-
-            assistantTurnNum++
-            return (
-              <AssistantTurnCard
-                key={turn.uuid || i}
-                turn={turn}
-                turnNumber={assistantTurnNum}
-                compactionBefore={compactionBefore}
-                toolResults={toolResults}
-              />
-            )
-          })}
-        </div>
-
-        {/* Sidebar */}
-        <div className="w-64 shrink-0 overflow-y-auto border-l border-border px-4 py-6">
-          <SessionSidebar replay={replay} meta={meta} />
-        </div>
-      </div>
-
-      {/* Token accumulation chart */}
-      <div className="border-t border-border px-4 py-4">
-        <TokenAccumulationChart turns={replay.turns} compactions={replay.compactions} />
-      </div>
-    </div>
-  )
-}

package/pulse/app/sessions/page.tsx

@@ -1,39 +0,0 @@
-'use client'
-
-import useSWR from 'swr'
-import { TopBar } from '@/components/layout/top-bar'
-import { SessionTable } from '@/components/sessions/session-table'
-import type { SessionWithFacet } from '@/types/claude'
-
-const fetcher = (url: string) =>
-  fetch(url).then(r => { if (!r.ok) throw new Error(`API error ${r.status}`); return r.json() })
-
-export default function SessionsPage() {
-  const { data, error, isLoading } = useSWR<{ sessions: SessionWithFacet[]; total: number }>(
-    '/api/sessions',
-    fetcher,
-    { refreshInterval: 5_000 }
-  )
-
-  return (
-    <div className="flex flex-col min-h-screen">
-      <TopBar
-        title="Bahulam Pulse · Sessions"
-        subtitle={data ? `${data.total} total sessions` : 'loading...'}
-      />
-      <div className="p-6">
-        {error && (
-          <p className="text-[#f87171] text-sm font-mono">Error: {String(error)}</p>
-        )}
-        {isLoading && (
-          <div className="space-y-2">
-            {Array.from({ length: 8 }).map((_, i) => (
-              <div key={i} className="h-10 bg-muted rounded animate-pulse" />
-            ))}
-          </div>
-        )}
-        {data && <SessionTable sessions={data.sessions} />}
-      </div>
-    </div>
-  )
-}

package/pulse/app/settings/page.tsx

@@ -1,188 +0,0 @@
-'use client'
-
-import useSWR from 'swr'
-import { TopBar } from '@/components/layout/top-bar'
-import type { SkillInfo, PluginInfo } from '@/lib/claude-reader'
-
-const fetcher = (url: string) =>
-  fetch(url).then(r => { if (!r.ok) throw new Error(`API error ${r.status}`); return r.json() })
-
-function formatBytes(b: number) {
-  if (b >= 1_073_741_824) return (b / 1_073_741_824).toFixed(2) + ' GB'
-  if (b >= 1_048_576) return (b / 1_048_576).toFixed(1) + ' MB'
-  if (b >= 1_024) return (b / 1_024).toFixed(1) + ' KB'
-  return b + ' B'
-}
-
-function JsonValue({ value, depth = 0 }: { value: unknown; depth?: number }) {
-  if (value === null) return <span className="text-muted-foreground">null</span>
-  if (typeof value === 'boolean')
-    return <span className="text-amber-700 dark:text-[#fbbf24]">{String(value)}</span>
-  if (typeof value === 'number')
-    return <span className="text-emerald-700 dark:text-[#6ee7b7]">{value}</span>
-  if (typeof value === 'string')
-    return <span className="text-orange-400 dark:text-[#f9a875]">&quot;{value}&quot;</span>
-  if (Array.isArray(value)) {
-    if (value.length === 0) return <span className="text-muted-foreground">[]</span>
-    return (
-      <span>
-        <span className="text-muted-foreground">[</span>
-        <div className="pl-4">
-          {value.map((v, i) => (
-            <div key={i}>
-              <JsonValue value={v} depth={depth + 1} />
-              {i < value.length - 1 && <span className="text-muted-foreground/60">,</span>}
-            </div>
-          ))}
-        </div>
-        <span className="text-muted-foreground">]</span>
-      </span>
-    )
-  }
-  if (typeof value === 'object') {
-    const entries = Object.entries(value as Record<string, unknown>)
-    if (entries.length === 0) return <span className="text-muted-foreground">{'{}'}</span>
-    return (
-      <span>
-        <span className="text-muted-foreground">{'{'}</span>
-        <div className="pl-4">
-          {entries.map(([k, v], i) => (
-            <div key={k}>
-              <span className="text-muted-foreground">&quot;</span>
-              <span className="text-blue-700 dark:text-[#93c5fd]">{k}</span>
-              <span className="text-muted-foreground">&quot;</span>
-              <span className="text-muted-foreground/60">: </span>
-              <JsonValue value={v} depth={depth + 1} />
-              {i < entries.length - 1 && <span className="text-muted-foreground/60">,</span>}
-            </div>
-          ))}
-        </div>
-        <span className="text-muted-foreground">{'}'}</span>
-      </span>
-    )
-  }
-  return <span className="text-foreground">{String(value)}</span>
-}
-
-function Section({ title, children }: { title: string; children: React.ReactNode }) {
-  return (
-    <div className="border border-border rounded bg-card p-4">
-      <h2 className="text-[13px] font-bold text-muted-foreground uppercase tracking-widest mb-4">{title}</h2>
-      {children}
-    </div>
-  )
-}
-
-export default function SettingsPage() {
-  const { data, error, isLoading } = useSWR<{
-    settings: Record<string, unknown>
-    storageBytes: number
-    skills: SkillInfo[]
-    plugins: PluginInfo[]
-  }>('/api/settings', fetcher, { refreshInterval: 30_000 })
-
-  return (
-    <div className="flex flex-col min-h-screen">
-      <TopBar title="Bahulam Pulse · settings" subtitle="~/.bahulam/settings.json" />
-      <div className="p-4 md:p-6 space-y-6">
-        {error && <p className="text-[#f87171] text-sm font-mono">Error: {String(error)}</p>}
-        {isLoading && (
-          <div className="space-y-4">
-            {Array.from({ length: 3 }).map((_, i) => (
-              <div key={i} className="h-32 bg-muted rounded animate-pulse" />
-            ))}
-          </div>
-        )}
-        {data && (
-          <>
-            <Section title="Storage">
-              <div className="flex items-center gap-3">
-                <span className="text-primary text-2xl font-mono font-bold">
-                  {formatBytes(data.storageBytes)}
-                </span>
-                <span className="text-muted-foreground text-sm font-mono">used by ~/.bahulam/</span>
-              </div>
-            </Section>
-
-            <Section title="Settings">
-              {Object.keys(data.settings).length === 0 ? (
-                <p className="text-muted-foreground/60 text-sm font-mono">No settings found in ~/.bahulam/settings.json</p>
-              ) : (
-                <div className="font-mono text-sm leading-relaxed overflow-x-auto">
-                  <JsonValue value={data.settings} />
-                </div>
-              )}
-            </Section>
-
-            {data.settings.env && (
-              <Section title="Environment Variables">
-                <div className="font-mono text-sm leading-relaxed overflow-x-auto">
-                  <JsonValue value={data.settings.env} />
-                </div>
-              </Section>
-            )}
-
-            {data.settings.mcpServers && (
-              <Section title="MCP Servers">
-                <div className="space-y-3">
-                  {Object.entries(data.settings.mcpServers as Record<string, unknown>).map(([name, cfg]) => (
-                    <div key={name} className="border border-border rounded p-3">
-                      <p className="text-primary font-mono text-sm font-bold mb-2">{name}</p>
-                      <div className="font-mono text-xs text-muted-foreground overflow-x-auto">
-                        <JsonValue value={cfg} />
-                      </div>
-                    </div>
-                  ))}
-                </div>
-              </Section>
-            )}
-
-            <Section title={`Skills (${data.skills.length})`}>
-              {data.skills.length === 0 ? (
-                <p className="text-muted-foreground/60 text-sm font-mono">No skills found in ~/.bahulam/skills/</p>
-              ) : (
-                <div className="grid gap-2">
-                  {data.skills.map(skill => (
-                    <div key={skill.name} className="border border-border rounded p-3 flex items-start gap-3">
-                      <span className="shrink-0 w-2 h-2 mt-1.5 rounded-full bg-primary" />
-                      <div className="min-w-0">
-                        <p className="text-primary font-mono text-sm font-bold">{skill.name}</p>
-                        {skill.description && (
-                          <p className="text-foreground text-xs mt-0.5">{skill.description}</p>
-                        )}
-                        {skill.triggers && (
-                          <p className="text-muted-foreground text-xs mt-1 leading-relaxed line-clamp-2">{skill.triggers}</p>
-                        )}
-                      </div>
-                    </div>
-                  ))}
-                </div>
-              )}
-            </Section>
-
-            {data.plugins.length > 0 && (
-              <Section title={`Plugins (${data.plugins.length})`}>
-                <div className="grid gap-2">
-                  {data.plugins.map((plugin, i) => (
-                    <div key={i} className="border border-border rounded p-3 flex items-center justify-between gap-4">
-                      <div className="min-w-0">
-                        <p className="text-primary font-mono text-sm font-bold">{plugin.id}</p>
-                        <p className="text-muted-foreground text-xs mt-0.5">scope: {plugin.scope}</p>
-                      </div>
-                      <div className="text-right shrink-0">
-                        <span className="text-emerald-700 dark:text-[#6ee7b7] font-mono text-xs">v{plugin.version}</span>
-                        <p className="text-muted-foreground text-xs mt-0.5">
-                          {new Date(plugin.installedAt).toLocaleDateString()}
-                        </p>
-                      </div>
-                    </div>
-                  ))}
-                </div>
-              </Section>
-            )}
-          </>
-        )}
-      </div>
-    </div>
-  )
-}

package/pulse/app/todos/page.tsx

@@ -1,211 +0,0 @@
-'use client'
-
-import { useState } from 'react'
-import useSWR from 'swr'
-import { TopBar } from '@/components/layout/top-bar'
-import { Input } from '@/components/ui/input'
-import { Badge } from '@/components/ui/badge'
-import { Card, CardContent } from '@/components/ui/card'
-import { Skeleton } from '@/components/ui/skeleton'
-import { Alert, AlertDescription } from '@/components/ui/alert'
-import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs'
-import { Search, AlertTriangle, Circle, CircleDot, CircleCheck } from 'lucide-react'
-
-const fetcher = (url: string) =>
-  fetch(url).then(r => { if (!r.ok) throw new Error(`API error ${r.status}`); return r.json() })
-
-interface TodoItem {
-  id?: string
-  content?: string
-  status?: string
-  priority?: string
-  [key: string]: unknown
-}
-
-interface TodoFile {
-  name: string
-  data: unknown
-  mtime: string
-}
-
-type FilterType = 'all' | 'pending' | 'in_progress' | 'completed'
-
-function parseTodos(data: unknown): TodoItem[] {
-  if (Array.isArray(data)) return data as TodoItem[]
-  if (data && typeof data === 'object' && 'todos' in data)
-    return parseTodos((data as { todos: unknown }).todos)
-  return []
-}
-
-function formatDate(iso: string) {
-  return new Date(iso).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })
-}
-
-function normalizeStatus(s?: string): string {
-  return s ?? 'pending'
-}
-
-const PRIORITY_STYLES: Record<string, string> = {
-  high:   'bg-red-500/10 text-red-400 border-red-500/30',
-  medium: 'bg-amber-500/10 text-amber-400 border-amber-500/30',
-  low:    'bg-muted text-muted-foreground border-border',
-}
-
-const STATUS_META: Record<string, { icon: React.ElementType; color: string; label: string }> = {
-  pending:     { icon: Circle,      color: 'text-muted-foreground',  label: 'Pending'     },
-  in_progress: { icon: CircleDot,   color: 'text-amber-400',         label: 'In Progress' },
-  completed:   { icon: CircleCheck, color: 'text-emerald-400',        label: 'Completed'  },
-}
-
-function TodoRow({ item, file }: { item: TodoItem; file: TodoFile }) {
-  const status = normalizeStatus(item.status)
-  const meta = STATUS_META[status] ?? STATUS_META.pending
-  const Icon = meta.icon
-  const isCompleted = status === 'completed'
-
-  return (
-    <Card className="py-0">
-      <CardContent className="px-4 py-3.5 flex items-start gap-3">
-        <Icon className={`w-4 h-4 mt-0.5 shrink-0 ${meta.color}`} />
-        <div className="flex-1 min-w-0">
-          <p className={`text-sm leading-relaxed ${isCompleted ? 'line-through text-muted-foreground/50' : 'text-foreground'}`}>
-            {String(item.content ?? JSON.stringify(item))}
-          </p>
-          <div className="flex flex-wrap items-center gap-2 mt-2">
-            <Badge
-              variant="outline"
-              className={`text-[10px] font-mono uppercase tracking-wider ${meta.color}`}
-            >
-              {meta.label}
-            </Badge>
-            {item.priority && (
-              <Badge
-                variant="outline"
-                className={`text-[10px] font-mono uppercase tracking-wider ${PRIORITY_STYLES[item.priority] ?? PRIORITY_STYLES.low}`}
-              >
-                {item.priority}
-              </Badge>
-            )}
-            <Badge variant="secondary" className="text-[10px] font-mono">
-              {file.name}
-            </Badge>
-            <span className="text-[10px] text-muted-foreground/60">
-              {formatDate(file.mtime)}
-            </span>
-          </div>
-        </div>
-      </CardContent>
-    </Card>
-  )
-}
-
-export default function TodosPage() {
-  const { data, error, isLoading } = useSWR<{ todos: TodoFile[] }>(
-    '/api/todos', fetcher, { refreshInterval: 10_000 }
-  )
-  const [search, setSearch] = useState('')
-  const [filter, setFilter] = useState<FilterType>('all')
-
-  const todos = data?.todos ?? []
-  const allItems: Array<{ file: TodoFile; item: TodoItem }> = todos.flatMap(file =>
-    parseTodos(file.data).map(item => ({ file, item }))
-  )
-
-  const counts = {
-    all:         allItems.length,
-    pending:     allItems.filter(x => normalizeStatus(x.item.status) === 'pending').length,
-    in_progress: allItems.filter(x => normalizeStatus(x.item.status) === 'in_progress').length,
-    completed:   allItems.filter(x => normalizeStatus(x.item.status) === 'completed').length,
-  }
-
-  const filtered = allItems.filter(({ item }) => {
-    if (filter !== 'all' && normalizeStatus(item.status) !== filter) return false
-    if (search && !String(item.content ?? '').toLowerCase().includes(search.toLowerCase())) return false
-    return true
-  })
-
-  return (
-    <div className="flex flex-col min-h-screen">
-      <TopBar title="Todos" subtitle="~/.bahulam/todos/" />
-      <div className="p-4 md:p-6 space-y-5">
-
-        {error && (
-          <Alert variant="destructive">
-            <AlertTriangle className="h-4 w-4" />
-            <AlertDescription>Error loading data: {String(error)}</AlertDescription>
-          </Alert>
-        )}
-
-        {isLoading && (
-          <div className="space-y-3">
-            <Skeleton className="h-10 w-full rounded-lg" />
-            {Array.from({ length: 5 }).map((_, i) => <Skeleton key={i} className="h-16 rounded-xl" />)}
-          </div>
-        )}
-
-        {data && (
-          <>
-            {/* Filter tabs */}
-            <Tabs value={filter} onValueChange={v => setFilter(v as FilterType)}>
-              <TabsList className="w-full sm:w-auto">
-                <TabsTrigger value="all" className="gap-2">
-                  All
-                  <Badge variant="secondary" className="text-xs tabular-nums">{counts.all}</Badge>
-                </TabsTrigger>
-                <TabsTrigger value="pending" className="gap-2">
-                  <Circle className="w-3.5 h-3.5" />
-                  Pending
-                  <Badge variant="secondary" className="text-xs tabular-nums">{counts.pending}</Badge>
-                </TabsTrigger>
-                <TabsTrigger value="in_progress" className="gap-2">
-                  <CircleDot className="w-3.5 h-3.5 text-amber-400" />
-                  In Progress
-                  <Badge variant="secondary" className="text-xs tabular-nums">{counts.in_progress}</Badge>
-                </TabsTrigger>
-                <TabsTrigger value="completed" className="gap-2">
-                  <CircleCheck className="w-3.5 h-3.5 text-emerald-400" />
-                  Done
-                  <Badge variant="secondary" className="text-xs tabular-nums">{counts.completed}</Badge>
-                </TabsTrigger>
-              </TabsList>
-            </Tabs>
-
-            {/* Search */}
-            <div className="relative">
-              <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground" />
-              <Input
-                placeholder="Search todos…"
-                value={search}
-                onChange={e => setSearch(e.target.value)}
-                className="pl-9"
-              />
-            </div>
-
-            {(search || filter !== 'all') && (
-              <p className="text-xs text-muted-foreground">
-                Showing <span className="text-amber-400 font-medium">{filtered.length}</span> of {allItems.length} todos
-              </p>
-            )}
-
-            {filtered.length === 0 ? (
-              <div className="text-center py-16">
-                <CircleCheck className="w-8 h-8 mx-auto mb-3 text-muted-foreground/40" />
-                <p className="text-muted-foreground text-sm">
-                  {allItems.length === 0
-                    ? 'No todos found in ~/.bahulam/todos/'
-                    : 'No todos match your filter.'}
-                </p>
-              </div>
-            ) : (
-              <div className="space-y-2">
-                {filtered.map(({ file, item }, i) => (
-                  <TodoRow key={i} item={item} file={file} />
-                ))}
-              </div>
-            )}
-          </>
-        )}
-      </div>
-    </div>
-  )
-}