fleetlens 0.4.0 → 0.6.0

package/app/apps/web/app/parallelism/page.tsx

@@ -1,286 +1,16 @@
-/**
- * Timeline Gantt chart — visualize how sessions overlap per day.
- *
- * Shows one row per session, with colored segments for active periods
- * and gaps for idle time. Time axis is 24 hours. Date picker to
- * navigate between days.
- */
-
-import { listSessions, getSession } from "@/lib/data";
-import {
-  buildGanttDay,
-  computeParallelismBursts,
-  computeBurstsFromSessions,
-  dailyActivity,
-  type GanttDay,
-  type ParallelismBurst,
-} from "@claude-lens/parser";
-import { GanttChart } from "./gantt-chart";
-import { DateNav, type DayInfo } from "./date-nav";
-import { toLocalDay } from "@claude-lens/parser";
+import { redirect } from "next/navigation";
+import { todayLocal } from "@/lib/entries";
 
 export const dynamic = "force-dynamic";
 
-export default async function TimelinePage({
+export default async function LegacyTimelineRedirect({
   searchParams,
 }: {
-  searchParams: Promise<{ date?: string; range?: string }>;
+  searchParams: Promise<{ date?: string }>;
 }) {
   const { date: dateParam } = await searchParams;
-
-  // Default to today.
-  const today = toLocalDay(Date.now());
-  const date = dateParam && /^\d{4}-\d{2}-\d{2}$/.test(dateParam) ? dateParam : today;
-
-  // Load all sessions, then load details for sessions that overlap
-  // the target day. We use file mtime as a fast filter — only load
-  // details for sessions whose mtime falls on the target day ± 1 day.
-  const [y, m, d] = date.split("-").map(Number) as [number, number, number];
-  const dayStartMs = new Date(y, m - 1, d).getTime();
-  const dayEndMs = new Date(y, m - 1, d + 1).getTime();
-  // Widen the window by 1 day on each side to catch sessions that
-  // started the day before and carried into the target day.
-  const filterStartMs = dayStartMs - 24 * 60 * 60 * 1000;
-  const filterEndMs = dayEndMs + 24 * 60 * 60 * 1000;
-
-  const allSessions = await listSessions();
-  const candidates = allSessions.filter((s) => {
-    if (!s.firstTimestamp) return false;
-    const startMs = Date.parse(s.firstTimestamp);
-    if (Number.isNaN(startMs)) return false;
-    const endMs = s.lastTimestamp ? Date.parse(s.lastTimestamp) : startMs;
-    // Session overlaps the ±1 day window.
-    return endMs >= filterStartMs && startMs <= filterEndMs;
-  });
-
-  // Load full details for candidates (to get events for segment computation).
-  // Cap at 80 sessions to avoid extremely slow loads.
-  const details = (
-    await Promise.all(candidates.slice(0, 80).map((s) => getSession(s.id)))
-  ).filter((d): d is NonNullable<typeof d> => !!d);
-
-  const gantt: GanttDay = buildGanttDay(details, date);
-  const bursts: ParallelismBurst[] = computeParallelismBursts(gantt);
-
-  // Per-day activity (reuses dailyActivity which gives us both session
-  // count and airTimeMs bucketed by day).
-  const activityBuckets = dailyActivity(allSessions);
-  const activityByDay = new Map(activityBuckets.map((b) => [b.date, b]));
-
-  // Bursts across all history, bucketed by start day, so the picker can
-  // show "this day had parallel work" without us recomputing per day.
-  const allBursts = computeBurstsFromSessions(allSessions);
-  type DayBurstAgg = { totalMs: number; count: number; peak: number };
-  const burstsByDay = new Map<string, DayBurstAgg>();
-  for (const b of allBursts) {
-    const day = toLocalDay(b.startMs);
-    const entry = burstsByDay.get(day) ?? { totalMs: 0, count: 0, peak: 0 };
-    entry.totalMs += b.endMs - b.startMs;
-    entry.count += 1;
-    if (b.peak > entry.peak) entry.peak = b.peak;
-    burstsByDay.set(day, entry);
-  }
-
-  // Union of days that have any activity OR any parallelism.
-  const dayKeys = new Set<string>();
-  for (const b of activityBuckets) if (b.sessions > 0) dayKeys.add(b.date);
-  for (const d of burstsByDay.keys()) dayKeys.add(d);
-
-  const dayStats: DayInfo[] = Array.from(dayKeys)
-    .map((date) => {
-      const activity = activityByDay.get(date);
-      const burst = burstsByDay.get(date);
-      return {
-        date,
-        sessions: activity?.sessions ?? 0,
-        airTimeMs: activity?.airTimeMs ?? 0,
-        parallelMs: burst?.totalMs ?? 0,
-        burstCount: burst?.count ?? 0,
-        peakConcurrency: burst?.peak ?? 0,
-      };
-    })
-    .sort((a, b) => a.date.localeCompare(b.date));
-  const sortedDays = dayStats.map((d) => d.date);
-  const currentIdx = sortedDays.indexOf(date);
-  const prevDay = currentIdx > 0 ? sortedDays[currentIdx - 1] : undefined;
-  const nextDay =
-    currentIdx >= 0 && currentIdx < sortedDays.length - 1
-      ? sortedDays[currentIdx + 1]
-      : undefined;
-
-  // Day-level totals for the header tile row. Active time comes from
-  // the per-day split in the Gantt (same as the calendar intensity —
-  // consistent numbers everywhere).
-  const dayActiveMs = gantt.sessions.reduce(
-    (sum, s) => sum + s.activeMs,
-    0,
-  );
-  const peakConcurrent = gantt.peakActiveParallelism;
-  const totalParallelMs = bursts.reduce(
-    (sum, b) => sum + (b.endMs - b.startMs),
-    0,
-  );
-  const crossProjectBursts = bursts.filter((b) => b.crossProject).length;
-
-  return (
-    <div style={{ padding: "32px 40px", maxWidth: 1400 }}>
-      <header
-        style={{
-          display: "flex",
-          alignItems: "flex-start",
-          justifyContent: "space-between",
-          marginBottom: 20,
-          flexWrap: "wrap",
-          gap: 14,
-        }}
-      >
-        <div>
-          <h1 style={{ fontSize: 26, fontWeight: 700, letterSpacing: "-0.02em", margin: 0 }}>
-            Timeline
-          </h1>
-          <p style={{ fontSize: 13, color: "var(--af-text-secondary)", marginTop: 4 }}>
-            {date === today ? "Today" : "Activity on"}{" "}
-            <strong>{date}</strong>
-          </p>
-        </div>
-
-        <DateNav date={date} today={today} prevDay={prevDay} nextDay={nextDay} dayStats={dayStats} />
-      </header>
-
-      {gantt.sessions.length === 0 ? (
-        <div className="af-empty">
-          No active sessions on {date}. Try a different date.
-        </div>
-      ) : (
-        <>
-          <DayMetricRow
-            sessionCount={gantt.sessions.length}
-            activeMs={dayActiveMs}
-            peakConcurrent={peakConcurrent}
-            parallelMs={totalParallelMs}
-            burstCount={bursts.length}
-            crossProjectBursts={crossProjectBursts}
-          />
-          <GanttChart gantt={gantt} bursts={bursts} />
-        </>
-      )}
-    </div>
-  );
-}
-
-function DayMetricRow({
-  sessionCount,
-  activeMs,
-  peakConcurrent,
-  parallelMs,
-  burstCount,
-  crossProjectBursts,
-}: {
-  sessionCount: number;
-  activeMs: number;
-  peakConcurrent: number;
-  parallelMs: number;
-  burstCount: number;
-  crossProjectBursts: number;
-}) {
-  const fmtDur = (ms: number) => {
-    if (ms <= 0) return "—";
-    const totalMin = Math.round(ms / 60_000);
-    if (totalMin < 60) return `${totalMin}m`;
-    const h = Math.floor(totalMin / 60);
-    const m = totalMin % 60;
-    return m ? `${h}h ${m}m` : `${h}h`;
-  };
-
-  const tiles: Array<{
-    label: string;
-    value: string;
-    sub?: string;
-    color?: string;
-  }> = [
-    {
-      label: "Sessions active",
-      value: String(sessionCount),
-      sub: "at least one segment today",
-    },
-    {
-      label: "Agent time",
-      value: fmtDur(activeMs),
-      sub: "actively working",
-    },
-  ];
-
-  if (burstCount > 0) {
-    tiles.push({
-      label: "Peak concurrency",
-      value: `×${peakConcurrent}`,
-      sub: "max agents at once",
-      color: "rgba(167, 139, 250, 1)",
-    });
-    tiles.push({
-      label: "Parallel time",
-      value: fmtDur(parallelMs),
-      sub: `${burstCount} burst${burstCount === 1 ? "" : "s"}${crossProjectBursts > 0 ? ` · ${crossProjectBursts} cross-project` : ""}`,
-    });
-  } else {
-    tiles.push({
-      label: "Peak concurrency",
-      value: peakConcurrent > 1 ? `×${peakConcurrent}` : "—",
-      sub: "no sustained bursts",
-    });
-  }
-
-  return (
-    <section
-      style={{
-        display: "grid",
-        gridTemplateColumns: `repeat(${tiles.length}, 1fr)`,
-        gap: 12,
-        marginBottom: 16,
-      }}
-    >
-      {tiles.map((t) => (
-        <div
-          key={t.label}
-          className="af-panel"
-          style={{ padding: "14px 18px" }}
-        >
-          <div
-            style={{
-              fontSize: 9,
-              fontWeight: 600,
-              letterSpacing: "0.05em",
-              textTransform: "uppercase",
-              color: "var(--af-text-tertiary)",
-              marginBottom: 4,
-            }}
-          >
-            {t.label}
-          </div>
-          <div
-            style={{
-              fontSize: 22,
-              fontWeight: 700,
-              letterSpacing: "-0.01em",
-              fontVariantNumeric: "tabular-nums",
-              color: t.color ?? "var(--af-text)",
-            }}
-          >
-            {t.value}
-          </div>
-          {t.sub && (
-            <div
-              style={{
-                fontSize: 10,
-                color: "var(--af-text-tertiary)",
-                marginTop: 3,
-              }}
-            >
-              {t.sub}
-            </div>
-          )}
-        </div>
-      ))}
-    </section>
-  );
+  const date = dateParam && /^\d{4}-\d{2}-\d{2}$/.test(dateParam) ? dateParam : todayLocal();
+  // Hash fragment for the timeline tab is best-effort — most browsers
+  // preserve it across server redirects.
+  redirect(`/day/${date}#timeline`);
 }

package/app/apps/web/app/projects/[slug]/page.tsx

@@ -6,12 +6,34 @@ import {
   detectPrMarkers,
   sessionAirTimeMs,
 } from "@claude-lens/parser";
+import type { DayOutcome, DayHelpfulness } from "@claude-lens/entries";
 import { DashboardView } from "@/components/dashboard-view";
 import { LiveBadge } from "@/components/live-badge";
 import { TeamBadge } from "@/components/team-badge";
+import { OutcomePill, OUTCOME_STYLES } from "@/components/outcome-pill";
+import { HelpfulnessSparkline } from "@/components/helpfulness-sparkline";
+import { buildEntriesIndex, listCachedDayDigests } from "@/lib/entries-index";
 import { formatDuration, formatRelative, prettyProjectName } from "@/lib/format";
 import { ArrowLeft } from "lucide-react";
 
+function lastNDays(n: number): string[] {
+  const out: string[] = [];
+  const now = new Date();
+  for (let i = n - 1; i >= 0; i--) {
+    const d = new Date(now);
+    d.setDate(d.getDate() - i);
+    const y = d.getFullYear();
+    const m = String(d.getMonth() + 1).padStart(2, "0");
+    const day = String(d.getDate()).padStart(2, "0");
+    out.push(`${y}-${m}-${day}`);
+  }
+  return out;
+}
+
+const OUTCOME_PRI: Record<DayOutcome, number> = {
+  shipped: 6, partial: 5, blocked: 4, exploratory: 3, trivial: 2, idle: 1,
+};
+
 export const dynamic = "force-dynamic";
 
 export default async function ProjectDetail({ params }: { params: Promise<{ slug: string }> }) {
@@ -49,6 +71,50 @@ export default async function ProjectDetail({ params }: { params: Promise<{ slug
   const recentSessions = projectSessions.slice(0, 12);
   const hasPrs = prMarkers.length > 0;
 
+  // Build the recent-7-days strip + helpfulness sparkline.
+  const days = lastNDays(7);
+  const [entriesIndex, cachedDigests] = await Promise.all([
+    buildEntriesIndex(),
+    listCachedDayDigests(),
+  ]);
+  const projectEntries = entriesIndex.byProject.get(decodedCanonical) ?? [];
+  const entriesByDay = new Map<string, typeof projectEntries>();
+  for (const e of projectEntries) {
+    const arr = entriesByDay.get(e.local_day);
+    if (arr) arr.push(e); else entriesByDay.set(e.local_day, [e]);
+  }
+  const recentDays: Array<{
+    date: string;
+    outcome: DayOutcome | null;
+    activeMin: number;
+    prCount: number;
+  }> = days.map((d) => {
+    const list = entriesByDay.get(d) ?? [];
+    let best: DayOutcome | null = null;
+    let bestPri = 0;
+    for (const e of list) {
+      const o = e.enrichment.outcome as DayOutcome | null;
+      if (!o) continue;
+      if ((OUTCOME_PRI[o] ?? 0) > bestPri) {
+        bestPri = OUTCOME_PRI[o] ?? 0;
+        best = o;
+      }
+    }
+    const activeMin = list.reduce((a, e) => a + (e.numbers.active_min ?? 0), 0);
+    const prCount = list.reduce((a, e) => a + e.pr_titles.length, 0);
+    return { date: d, outcome: best, activeMin, prCount };
+  });
+  const helpfulnessDays: Array<{ date: string; helpfulness: DayHelpfulness; cached: boolean }> =
+    days.map((d) => {
+      const dig = cachedDigests.get(d);
+      return {
+        date: d,
+        helpfulness: dig?.helpfulness_day ?? null,
+        cached: !!dig,
+      };
+    });
+  const hasAnyOutcome = recentDays.some((d) => d.outcome !== null);
+
   return (
     <div
       style={{
@@ -96,6 +162,93 @@ export default async function ProjectDetail({ params }: { params: Promise<{ slug
         override={{ activeTimeMs: refinedAirMs || undefined }}
       />
 
+      {hasAnyOutcome && (
+        <section className="af-panel">
+          <div className="af-panel-header">
+            <span>Recent days</span>
+            <span style={{ fontSize: 11, color: "var(--af-text-tertiary)", fontWeight: 400 }}>
+              last 7 local days
+            </span>
+          </div>
+          <div
+            style={{
+              display: "grid",
+              gridTemplateColumns: "repeat(7, 1fr)",
+              gap: 8,
+              padding: 14,
+            }}
+          >
+            {recentDays.map((d) => {
+              const dt = new Date(`${d.date}T12:00:00`);
+              const dow = dt.toLocaleDateString("en-US", { weekday: "short" });
+              const md = dt.toLocaleDateString("en-US", { month: "short", day: "numeric" });
+              return (
+                <Link
+                  key={d.date}
+                  href={`/digest/${d.date}`}
+                  style={{
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: 6,
+                    alignItems: "center",
+                    padding: "10px 8px",
+                    border: "1px solid var(--af-border-subtle)",
+                    borderRadius: 8,
+                    background: "var(--af-surface)",
+                    textDecoration: "none",
+                    color: "var(--af-text)",
+                    fontSize: 11,
+                  }}
+                >
+                  <span style={{ fontWeight: 600 }}>{dow}</span>
+                  <span
+                    style={{
+                      fontSize: 10,
+                      color: "var(--af-text-tertiary)",
+                      fontFamily: "var(--font-mono)",
+                    }}
+                  >
+                    {md}
+                  </span>
+                  {d.outcome ? (
+                    <span style={{ fontSize: 16, lineHeight: 1 }} aria-hidden>
+                      {OUTCOME_STYLES[d.outcome]?.icon ?? ""}
+                    </span>
+                  ) : (
+                    <span style={{ fontSize: 14, color: "var(--af-text-tertiary)" }}>—</span>
+                  )}
+                  <span
+                    style={{
+                      fontFamily: "var(--font-mono)",
+                      fontSize: 10,
+                      color: "var(--af-text-secondary)",
+                    }}
+                  >
+                    {d.activeMin > 0 ? `${Math.round(d.activeMin)}m` : "—"}
+                  </span>
+                  <span
+                    style={{
+                      fontSize: 9,
+                      color: "var(--af-text-tertiary)",
+                    }}
+                  >
+                    {d.prCount > 0 ? `${d.prCount} PR` : "—"}
+                  </span>
+                </Link>
+              );
+            })}
+          </div>
+          <div
+            style={{
+              padding: "12px 16px",
+              borderTop: "1px solid var(--af-border-subtle)",
+            }}
+          >
+            <HelpfulnessSparkline days={helpfulnessDays} />
+          </div>
+        </section>
+      )}
+
       {/* Pull requests shipped + Recent sessions — two columns (or one if no PRs) */}
       <section
         style={{

package/app/apps/web/app/projects/page.tsx

@@ -1,12 +1,57 @@
 import { listSessions } from "@/lib/data";
-import { groupByProject } from "@claude-lens/parser";
-import { ProjectsView } from "./projects-view";
+import { canonicalProjectName, groupByProject } from "@claude-lens/parser";
+import type { DayOutcome } from "@claude-lens/entries";
+import { ProjectsView, type ProjectRow } from "./projects-view";
+import { buildEntriesIndex } from "@/lib/entries-index";
 
 export const dynamic = "force-dynamic";
 
+function lastNDays(n: number): string[] {
+  const out: string[] = [];
+  const now = new Date();
+  for (let i = n - 1; i >= 0; i--) {
+    const d = new Date(now);
+    d.setDate(d.getDate() - i);
+    const y = d.getFullYear();
+    const m = String(d.getMonth() + 1).padStart(2, "0");
+    const day = String(d.getDate()).padStart(2, "0");
+    out.push(`${y}-${m}-${day}`);
+  }
+  return out;
+}
+
 export default async function ProjectsPage() {
-  const sessions = await listSessions();
+  const [sessions, index] = await Promise.all([listSessions(), buildEntriesIndex()]);
   const projects = groupByProject(sessions);
+  const days = lastNDays(7);
+
+  const rows: ProjectRow[] = projects.map((p) => {
+    const canonical = canonicalProjectName(p.projectName);
+    const projectEntries = index.byProject.get(canonical) ?? [];
+    const byDay = new Map<string, typeof projectEntries>();
+    for (const e of projectEntries) {
+      const arr = byDay.get(e.local_day);
+      if (arr) arr.push(e); else byDay.set(e.local_day, [e]);
+    }
+    const recent: Array<{ date: string; outcome: DayOutcome | null }> = days.map((d) => {
+      const list = byDay.get(d) ?? [];
+      let best: DayOutcome | null = null;
+      let bestPri = 0;
+      const pri: Record<string, number> = {
+        shipped: 6, partial: 5, blocked: 4, exploratory: 3, trivial: 2, idle: 1,
+      };
+      for (const e of list) {
+        const o = e.enrichment.outcome;
+        if (!o) continue;
+        if ((pri[o] ?? 0) > bestPri) {
+          bestPri = pri[o] ?? 0;
+          best = o as DayOutcome;
+        }
+      }
+      return { date: d, outcome: best };
+    });
+    return { project: p, recentDays: recent };
+  });
 
   return (
     <div style={{ maxWidth: 1280, padding: "32px 40px" }}>
@@ -23,7 +68,7 @@ export default async function ProjectsPage() {
       {projects.length === 0 ? (
         <div className="af-empty">No projects found.</div>
       ) : (
-        <ProjectsView projects={projects} />
+        <ProjectsView rows={rows} />
       )}
     </div>
   );