claudeye 0.2.2 → 0.3.0

package/.next/standalone/app/components/log-viewer/entry-row.tsx

@@ -7,9 +7,12 @@ import { ENTRY_BORDER_COLORS } from "./constants";
 import { TypeBadge } from "./type-badge";
 import { ToolInputOutput } from "./tool-input-output";
 import { StatsBar } from "./stats-bar";
+import EvalResultsPanel from "@/app/components/eval-results-panel";
+import EnrichmentResultsPanel from "@/app/components/enrichment-results-panel";
 import { QueueDivider } from "./queue-divider";
 import { UserContent, AssistantContent, GenericContent } from "./content-block-view";
-import { formatLocalTimestamp } from "@/lib/log-format";
+import { formatLocalTimestamp, getEntryTextContent } from "@/lib/log-format";
+import { CopyButton } from "@/app/components/copy-button";
 
 // ── Subagent Tool Card ──
 
@@ -108,7 +111,25 @@ export function SubagentToolCard({ block, projectName, sessionId }: SubagentTool
             <div className="text-xs text-muted-foreground py-2">No entries found in subagent log.</div>
           )}
           {entries && entries.length > 0 && (
-            <StatsBar entries={entries} compact />
+            <>
+              <StatsBar entries={entries} compact />
+              <EvalResultsPanel
+                projectName={projectName}
+                sessionId={sessionId}
+                agentId={block.subagentId}
+                subagentType={block.subagentType}
+                subagentDescription={block.subagentDescription}
+                compact
+              />
+              <EnrichmentResultsPanel
+                projectName={projectName}
+                sessionId={sessionId}
+                agentId={block.subagentId}
+                subagentType={block.subagentType}
+                subagentDescription={block.subagentDescription}
+                compact
+              />
+            </>
           )}
           {entries && entries.map((entry) =>
             entry.type === "queue-operation" ? (
@@ -142,27 +163,35 @@ interface EntryRowProps {
   sessionId: string;
 }
 
+function EntryContent({ entry, projectName, sessionId }: EntryRowProps): React.ReactNode {
+  switch (entry.type) {
+    case "user":
+      return <UserContent entry={entry} />;
+    case "assistant":
+      return <AssistantContent entry={entry} projectName={projectName} sessionId={sessionId} />;
+    case "file-history-snapshot":
+    case "progress":
+    case "system":
+      return <GenericContent entry={entry} />;
+  }
+}
+
 export const EntryRow = React.memo(function EntryRow({ entry, projectName, sessionId }: EntryRowProps) {
   return (
     <div
       className={`border-l-4 ${ENTRY_BORDER_COLORS[entry.type]} bg-card/50 rounded-r-lg mb-2 hover:bg-muted/30 transition-colors`}
     >
-      {/* Header row */}
       <div className="flex items-center gap-2 px-4 py-2 border-b border-border/30">
         <TypeBadge type={entry.type} />
-        <span className="text-xs font-mono text-muted-foreground ml-auto whitespace-nowrap">
-          {formatLocalTimestamp(entry.timestampMs)}
-        </span>
+        <div className="flex items-center gap-1 ml-auto">
+          <CopyButton text={getEntryTextContent(entry)} />
+          <span className="text-xs font-mono text-muted-foreground whitespace-nowrap">
+            {formatLocalTimestamp(entry.timestampMs)}
+          </span>
+        </div>
       </div>
-      {/* Content area */}
       <div className="px-4 py-3">
-        {entry.type === "user" && <UserContent entry={entry} />}
-        {entry.type === "assistant" && (
-          <AssistantContent entry={entry} projectName={projectName} sessionId={sessionId} />
-        )}
-        {(entry.type === "file-history-snapshot" ||
-          entry.type === "progress" ||
-          entry.type === "system") && <GenericContent entry={entry} />}
+        <EntryContent entry={entry} projectName={projectName} sessionId={sessionId} />
       </div>
     </div>
   );

package/.next/standalone/app/components/log-viewer/queue-divider.tsx

@@ -1,17 +1,60 @@
 import React from "react";
-import { Play } from "lucide-react";
+import { Play, ChevronRight } from "lucide-react";
 import type { QueueOperationEntry } from "@/lib/log-entries";
 import { formatLocalTimestamp } from "@/lib/log-format";
 
-export const QueueDivider = React.memo(function QueueDivider({ entry }: { entry: QueueOperationEntry }) {
+interface QueueDividerProps {
+  entry: QueueOperationEntry;
+  isCollapsed?: boolean;
+  entryCount?: number;
+  onToggle?: () => void;
+}
+
+export const QueueDivider = React.memo(function QueueDivider({
+  entry,
+  isCollapsed,
+  entryCount,
+  onToggle,
+}: QueueDividerProps) {
+  const interactive = typeof onToggle === "function";
+
+  const pill = (
+    <div className={`flex items-center gap-2 px-3 py-1 rounded-full bg-primary/10 border border-primary/20 text-primary text-xs font-medium${interactive ? " group-hover:bg-primary/20 transition-colors" : ""}`}>
+      {interactive ? (
+        <ChevronRight
+          className={`w-3 h-3 transition-transform ${isCollapsed ? "" : "rotate-90"}`}
+        />
+      ) : (
+        <Play className="w-3 h-3" />
+      )}
+      <span>{entry.label}</span>
+      <span className="text-muted-foreground">{formatLocalTimestamp(entry.timestampMs)}</span>
+      {interactive && isCollapsed && typeof entryCount === "number" && (
+        <span className="ml-1 px-1.5 py-0.5 rounded bg-primary/20 text-[10px] leading-none">
+          {entryCount} {entryCount === 1 ? "entry" : "entries"}
+        </span>
+      )}
+    </div>
+  );
+
+  if (interactive) {
+    return (
+      <button
+        type="button"
+        onClick={onToggle}
+        className="group flex items-center gap-3 py-3 px-4 w-full cursor-pointer"
+      >
+        <div className="flex-1 h-px bg-primary/30" />
+        {pill}
+        <div className="flex-1 h-px bg-primary/30" />
+      </button>
+    );
+  }
+
   return (
     <div className="flex items-center gap-3 py-3 px-4">
       <div className="flex-1 h-px bg-primary/30" />
-      <div className="flex items-center gap-2 px-3 py-1 rounded-full bg-primary/10 border border-primary/20 text-primary text-xs font-medium">
-        <Play className="w-3 h-3" />
-        <span>{entry.label}</span>
-        <span className="text-muted-foreground">{formatLocalTimestamp(entry.timestampMs)}</span>
-      </div>
+      {pill}
       <div className="flex-1 h-px bg-primary/30" />
     </div>
   );

package/.next/standalone/app/components/log-viewer/tool-input-output.tsx

@@ -1,15 +1,22 @@
+import { useMemo } from "react";
 import type { ToolUseBlock } from "@/lib/log-entries";
 import { formatInput, formatLocalTimestamp } from "@/lib/log-format";
+import { CopyButton } from "@/app/components/copy-button";
 
 export function ToolInputOutput({ block }: { block: ToolUseBlock }) {
+  const inputText = useMemo(() => formatInput(block), [block]);
+
   return (
     <div className="space-y-2">
       <details open>
         <summary className="text-xs text-muted-foreground cursor-pointer hover:text-foreground transition-colors">
-          Input
+          <span className="inline-flex items-center gap-1">
+            Input
+            <CopyButton text={inputText} />
+          </span>
         </summary>
         <pre className="mt-1 p-2 bg-muted/50 rounded text-xs whitespace-pre-wrap break-words max-h-64 overflow-y-auto">
-          {formatInput(block)}
+          {inputText}
         </pre>
       </details>
       {block.result ? (
@@ -25,7 +32,10 @@ export function ToolInputOutput({ block }: { block: ToolUseBlock }) {
           {block.result.content && (
             <details open>
               <summary className="text-xs text-muted-foreground cursor-pointer hover:text-foreground transition-colors">
-                Output
+                <span className="inline-flex items-center gap-1">
+                  Output
+                  <CopyButton text={block.result.content} />
+                </span>
               </summary>
               <pre className="mt-1 p-2 bg-muted/50 rounded text-xs whitespace-pre-wrap break-words max-h-48 overflow-y-auto">
                 {block.result.content}

package/.next/standalone/app/components/project-list.tsx

@@ -20,6 +20,7 @@ import Link from "next/link";
 import PaginationControls from "./pagination-controls";
 import DatePickerInput from "./date-picker-input";
 
+
 interface ProjectListProps {
   folders: ProjectFolder[];
 }
@@ -93,7 +94,7 @@ export default function ProjectList({ folders }: ProjectListProps) {
       {/* Filter Bar */}
       <div className="bg-card border border-border rounded-lg p-4">
         <div className="flex flex-col gap-4">
-          {/* Preset Filters */}
+          {/* Preset Filters + Refresh */}
           <div className="flex flex-wrap items-center gap-2">
             <span className="text-sm font-medium text-foreground">Filter by:</span>
             {FILTER_PRESETS.map((preset) => (
@@ -109,6 +110,7 @@ export default function ProjectList({ folders }: ProjectListProps) {
                 {preset.label}
               </button>
             ))}
+
           </div>
 
           {/* Keyword Search */}
@@ -160,15 +162,13 @@ export default function ProjectList({ folders }: ProjectListProps) {
                       </button>
                     </div>
                   ))}
-                  {keywords.length > 0 && (
-                    <button
-                      onClick={clearKeywords}
-                      className="px-2 py-1.5 text-xs bg-muted text-muted-foreground hover:bg-muted/80 rounded-md transition-colors"
-                      aria-label="Clear all keywords"
-                    >
-                      Clear all
-                    </button>
-                  )}
+                  <button
+                    onClick={clearKeywords}
+                    className="px-2 py-1.5 text-xs bg-muted text-muted-foreground hover:bg-muted/80 rounded-md transition-colors"
+                    aria-label="Clear all keywords"
+                  >
+                    Clear all
+                  </button>
                 </div>
               )}
             </div>
@@ -192,7 +192,7 @@ export default function ProjectList({ folders }: ProjectListProps) {
                 aria-label="Filter to date"
               />
             </div>
-            {(filterPreset !== "all" || dateRange.from || dateRange.to || keywords.length > 0) && (
+            {(filterPreset !== "all" || dateRange.from !== null || dateRange.to !== null || keywords.length > 0) && (
               <button
                 onClick={clearFilters}
                 className="px-3 py-2 text-sm bg-muted text-muted-foreground hover:bg-muted/80 rounded-md transition-colors"

package/.next/standalone/app/components/raw-log-viewer.tsx

@@ -5,7 +5,7 @@
  */
 "use client";
 
-import React, { useRef } from "react";
+import React, { useCallback, useMemo, useRef, useState } from "react";
 import { useWindowVirtualizer } from "@tanstack/react-virtual";
 import type { LogEntry } from "@/lib/log-entries";
 import { StatsBar } from "@/app/components/log-viewer/stats-bar";
@@ -14,6 +14,7 @@ import { EntryRow } from "@/app/components/log-viewer/entry-row";
 import EvalResultsPanel from "@/app/components/eval-results-panel";
 import EnrichmentResultsPanel from "@/app/components/enrichment-results-panel";
 
+
 // ── Virtualized Entry List ──
 
 interface VirtualizedEntryListProps {
@@ -27,20 +28,83 @@ interface VirtualizedEntryListProps {
 // after render and self-corrects, so these just need to be close enough to
 // avoid large layout jumps on first paint.
 function estimateSize(entry: LogEntry): number {
-  if (entry.type === "queue-operation") return 48;
-  if (entry.type === "user") return 90;
-  if (entry.type === "assistant") {
-    return 80 + entry.message.content.length * 120;
+  switch (entry.type) {
+    case "queue-operation":
+      return 48;
+    case "user":
+      return 90;
+    case "assistant":
+      return 80 + entry.message.content.length * 120;
+    default:
+      return 100;
+  }
+}
+
+type QueueOperationEntry = Extract<LogEntry, { type: "queue-operation" }>;
+
+function getSegmentId(entry: QueueOperationEntry): string {
+  return `${entry.uuid}-${entry.timestampMs}`;
+}
+
+/**
+ * Walks the entries array and returns a Map from each queue-operation segment
+ * to the count of non-queue-operation entries in its segment (entries after
+ * it until the next queue-operation or end of list).
+ */
+function computeSegments(entries: LogEntry[]): Map<string, number> {
+  const segments = new Map<string, number>();
+  let currentId: string | null = null;
+  let count = 0;
+
+  for (const entry of entries) {
+    if (entry.type === "queue-operation") {
+      if (currentId !== null) {
+        segments.set(currentId, count);
+      }
+      currentId = getSegmentId(entry);
+      count = 0;
+    } else if (currentId !== null) {
+      count++;
+    }
   }
-  return 100;
+  if (currentId !== null) {
+    segments.set(currentId, count);
+  }
+  return segments;
 }
 
 function VirtualizedEntryList({ entries, projectName, sessionId }: VirtualizedEntryListProps) {
   const listRef = useRef<HTMLDivElement>(null);
+  const [collapsedSessions, setCollapsedSessions] = useState<Set<string>>(new Set());
+
+  const segments = useMemo(() => computeSegments(entries), [entries]);
+
+  const visibleEntries = useMemo(() => {
+    let currentCollapsed = false;
+    return entries.filter((entry) => {
+      if (entry.type === "queue-operation") {
+        currentCollapsed = collapsedSessions.has(getSegmentId(entry));
+        return true; // dividers are always visible
+      }
+      return !currentCollapsed;
+    });
+  }, [entries, collapsedSessions]);
+
+  const handleToggleSegment = useCallback((uuid: string) => {
+    setCollapsedSessions((prev) => {
+      const next = new Set(prev);
+      if (next.has(uuid)) {
+        next.delete(uuid);
+      } else {
+        next.add(uuid);
+      }
+      return next;
+    });
+  }, []);
 
   const virtualizer = useWindowVirtualizer({
-    count: entries.length,
-    estimateSize: (index) => estimateSize(entries[index]),
+    count: visibleEntries.length,
+    estimateSize: (index) => estimateSize(visibleEntries[index]),
     overscan: 5,
     scrollMargin: listRef.current?.offsetTop ?? 0,
   });
@@ -55,10 +119,10 @@ function VirtualizedEntryList({ entries, projectName, sessionId }: VirtualizedEn
         }}
       >
         {virtualizer.getVirtualItems().map((virtualRow) => {
-          const entry = entries[virtualRow.index];
+          const entry = visibleEntries[virtualRow.index];
           return (
             <div
-              key={entry.uuid || entry.timestamp}
+              key={entry.type === "queue-operation" ? getSegmentId(entry) : (entry.uuid || entry.timestamp)}
               data-index={virtualRow.index}
               ref={virtualizer.measureElement}
               style={{
@@ -70,7 +134,12 @@ function VirtualizedEntryList({ entries, projectName, sessionId }: VirtualizedEn
               }}
             >
               {entry.type === "queue-operation" ? (
-                <QueueDivider entry={entry} />
+                <QueueDivider
+                  entry={entry}
+                  isCollapsed={collapsedSessions.has(getSegmentId(entry))}
+                  entryCount={segments.get(getSegmentId(entry)) ?? 0}
+                  onToggle={() => handleToggleSegment(getSegmentId(entry))}
+                />
               ) : (
                 <EntryRow
                   entry={entry}

package/.next/standalone/app/components/refresh-button.tsx

@@ -0,0 +1,79 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useState, useEffect, useTransition } from "react";
+import { RefreshCw } from "lucide-react";
+import { cn } from "@/lib/utils";
+
+const AUTO_REFRESH_OPTIONS = [
+  { label: "Off", value: 0 },
+  { label: "5s", value: 5 },
+  { label: "10s", value: 10 },
+  { label: "30s", value: 30 },
+] as const;
+
+interface RefreshButtonProps {
+  className?: string;
+}
+
+export function RefreshButton({ className }: RefreshButtonProps) {
+  const router = useRouter();
+  const [isPending, startTransition] = useTransition();
+  const [autoInterval, setAutoInterval] = useState(0);
+
+  function handleRefresh(): void {
+    startTransition(() => router.refresh());
+  }
+
+  useEffect(() => {
+    if (autoInterval <= 0) return;
+    const id = setInterval(handleRefresh, autoInterval * 1000);
+    return () => clearInterval(id);
+  }, [autoInterval, router]);
+
+  const isAutoActive = autoInterval > 0;
+
+  return (
+    <div
+      className={cn(
+        "inline-flex items-center rounded-lg border border-border bg-muted/50 p-0.5 gap-0.5",
+        className,
+      )}
+    >
+      <button
+        onClick={handleRefresh}
+        title="Refresh"
+        className={cn(
+          "inline-flex items-center justify-center rounded-md p-1.5 transition-colors",
+          isAutoActive
+            ? "text-primary hover:bg-primary/10"
+            : "text-muted-foreground hover:text-foreground hover:bg-muted",
+        )}
+      >
+        <RefreshCw
+          className={cn("w-3.5 h-3.5", isPending && "animate-spin")}
+        />
+      </button>
+
+      <div className="w-px h-4 bg-border" />
+
+      <div className="inline-flex items-center gap-0.5" role="group" aria-label="Auto-refresh interval">
+        {AUTO_REFRESH_OPTIONS.map((opt) => (
+          <button
+            key={opt.value}
+            onClick={() => setAutoInterval(opt.value)}
+            aria-pressed={autoInterval === opt.value}
+            className={cn(
+              "px-2 py-1 text-[11px] font-medium rounded-md transition-colors",
+              autoInterval === opt.value
+                ? "bg-background text-foreground shadow-sm"
+                : "text-muted-foreground hover:text-foreground hover:bg-muted",
+            )}
+          >
+            {opt.label}
+          </button>
+        ))}
+      </div>
+    </div>
+  );
+}

package/.next/standalone/app/components/sessions-list.tsx

@@ -18,6 +18,8 @@ import { File, Search } from "lucide-react";
 import Link from "next/link";
 import PaginationControls from "./pagination-controls";
 import DatePickerInput from "./date-picker-input";
+import { CopyButton } from "./copy-button";
+
 
 interface SessionsListProps {
   files: SessionFile[];
@@ -56,13 +58,14 @@ export default function SessionsList({ files, projectName }: SessionsListProps)
   const endIndex = Math.min(startIndex + ITEMS_PER_PAGE, filteredFiles.length);
   const paginatedFiles = filteredFiles.slice(startIndex, endIndex);
 
-  const hasActiveFilters = filterPreset !== "all" || dateRange.from || dateRange.to || sessionIdFilter;
+  const hasActiveFilters =
+    filterPreset !== "all" || dateRange.from !== null || dateRange.to !== null || sessionIdFilter !== "";
 
   return (
     <div className="space-y-4">
       {/* Filters */}
       <div className="bg-card border border-border rounded-lg p-4 flex flex-col gap-4">
-        {/* Preset Filters */}
+        {/* Preset Filters + Refresh */}
         <div className="flex flex-wrap items-center gap-2">
           <span className="text-sm font-medium text-foreground">Filter by:</span>
           {FILTER_PRESETS.map((preset) => (
@@ -78,6 +81,7 @@ export default function SessionsList({ files, projectName }: SessionsListProps)
               {preset.label}
             </button>
           ))}
+
         </div>
 
         {/* Custom Date Range */}
@@ -154,18 +158,23 @@ export default function SessionsList({ files, projectName }: SessionsListProps)
                       <File className="w-5 h-5 text-primary" />
                     </td>
                     <td className="px-4 py-3 max-w-md">
-                      {file.sessionId ? (
-                        <Link
-                          href={`/project/${encodeURIComponent(projectName)}/session/${encodeURIComponent(file.sessionId)}`}
-                          className="font-semibold text-foreground hover:text-primary transition-colors break-words break-all inline-block max-w-full"
-                        >
-                          {file.name.replace(/\.jsonl$/, "")}
-                        </Link>
-                      ) : (
-                        <span className="font-semibold text-foreground break-words break-all inline-block max-w-full">
-                          {file.name.replace(/\.jsonl$/, "")}
-                        </span>
-                      )}
+                      <div className="flex items-center gap-1">
+                        {file.sessionId ? (
+                          <>
+                            <Link
+                              href={`/project/${encodeURIComponent(projectName)}/session/${encodeURIComponent(file.sessionId)}`}
+                              className="font-semibold text-foreground hover:text-primary transition-colors break-words break-all inline-block max-w-full"
+                            >
+                              {file.name.replace(/\.jsonl$/, "")}
+                            </Link>
+                            <CopyButton text={file.sessionId} />
+                          </>
+                        ) : (
+                          <span className="font-semibold text-foreground break-words break-all inline-block max-w-full">
+                            {file.name.replace(/\.jsonl$/, "")}
+                          </span>
+                        )}
+                      </div>
                     </td>
                     <td className="px-4 py-3 text-sm text-muted-foreground">
                       {file.lastModifiedFormatted || formatDate(file.lastModified)}

package/.next/standalone/app/project/[name]/session/[sessionId]/page.tsx

@@ -1,9 +1,10 @@
 /** Session page — parses and displays a single session's JSONL log via the Raw Log Viewer. */
 import Link from "next/link";
-import { ArrowLeft } from "lucide-react";
+import { ArrowLeft, Download } from "lucide-react";
 import { getCachedSessionLog } from "@/lib/log-entries";
 import { decodeFolderName } from "@/lib/paths";
 import LazyLogViewer from "@/app/components/lazy-log-viewer";
+import { CopyButton } from "@/app/components/copy-button";
 
 export const dynamic = "force-dynamic";
 
@@ -25,10 +26,8 @@ export default async function SessionPage({ params }: SessionPageProps) {
   try {
     entries = await getCachedSessionLog(decodedName, decodedSessionId);
   } catch (e) {
-    error =
-      e instanceof Error && "code" in e && (e as NodeJS.ErrnoException).code === "ENOENT"
-        ? "Session log file not found."
-        : "Failed to read session log.";
+    const isNotFound = (e as NodeJS.ErrnoException).code === "ENOENT";
+    error = isNotFound ? "Session log file not found." : "Failed to read session log.";
   }
 
   return (
@@ -51,24 +50,36 @@ export default async function SessionPage({ params }: SessionPageProps) {
               <span className="font-medium">Project:</span>{" "}
               {decodeFolderName(decodedName)}
             </p>
-            <p className="text-muted-foreground break-words break-all">
+            <p className="text-muted-foreground break-words break-all inline-flex items-center gap-1">
               <span className="font-medium">Session:</span> {decodedSessionId}
+              <CopyButton text={decodedSessionId} />
             </p>
             {entries && (
-              <p className="text-muted-foreground">
-                <span className="font-medium">{entries.length}</span> log entries
-              </p>
+              <div className="flex items-center gap-4">
+                <p className="text-muted-foreground">
+                  <span className="font-medium">{entries.length}</span> log entries
+                </p>
+                <a
+                  href={`/api/download/${encodeURIComponent(decodedName)}/${encodeURIComponent(decodedSessionId)}`}
+                  download
+                  className="inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-md bg-muted text-muted-foreground hover:bg-muted/80 hover:text-foreground transition-colors"
+                >
+                  <Download className="w-4 h-4" />
+                  Download JSONL
+                </a>
+              </div>
             )}
           </div>
         </div>
 
-        {error ? (
+        {error && (
           <div className="bg-card text-card-foreground rounded-lg border border-destructive/50 p-6 shadow-sm">
             <p className="text-destructive text-center py-8">{error}</p>
           </div>
-        ) : entries ? (
+        )}
+        {!error && entries && (
           <LazyLogViewer entries={entries} projectName={decodedName} sessionId={decodedSessionId} />
-        ) : null}
+        )}
       </div>
     </main>
   );