Update source

src/lib/TraceViewer.svelte

@@ -6,9 +6,35 @@
   let spinnerFrame = $state(0);
   let spinnerInterval;
 
-  let url = $state(
-    'https://huggingface.co/datasets/mishig/traces/blob/main/36c3db7c-71e3-4ee6-b528-e2a64c9cad77.jsonl'
-  );
+  const examples = [
+    {
+      label: '3D browser game',
+      url: 'https://huggingface.co/datasets/0xSero/pi-sessions/blob/main/2026-01-28T17-49-25-023Z_cc5bb68b-049d-49c7-84b1-004b47ae7cdc.jsonl',
+    },
+    {
+      label: 'Explain repo',
+      url: 'https://huggingface.co/datasets/0xSero/pi-sessions/blob/main/2026-01-13T13-24-19-611Z_6622d195-0787-41ac-b9d0-9ea1118a1c6c.jsonl',
+    },
+    {
+      label: 'Fix Swift errors',
+      url: 'https://huggingface.co/datasets/0xSero/pi-sessions/blob/main/2026-01-30T19-41-29-858Z_16007873-1d9f-4efd-b222-161a55e0183f.jsonl',
+    },
+    {
+      label: 'Triage issue',
+      url: 'https://huggingface.co/datasets/badlogicgames/pi-mono/blob/main/2026-01-16T02-37-34-075Z_4293a326-81ca-4327-b450-85275e1ca645.jsonl',
+    },
+    {
+      label: 'Release audit',
+      url: 'https://huggingface.co/datasets/badlogicgames/pi-mono/blob/main/2026-01-16T03-32-51-416Z_cf56c275-9716-42a7-b79e-c3225fe7f6d2.jsonl',
+    },
+  ];
+
+  let url = $state(examples[0].url);
+
+  function pickExample(ex) {
+    url = ex.url;
+    load();
+  }
   let loading = $state(false);
   let loadedCount = $state(0);
   let error = $state('');
@@ -208,9 +234,15 @@
       <span class="w-3 h-3 rounded-full bg-[#d7d7d3]"></span>
       <span class="w-3 h-3 rounded-full bg-[#d7d7d3]"></span>
       <span class="w-3 h-3 rounded-full bg-[#d7d7d3]"></span>
-      <span class="ml-auto text-[12px] text-[#6a6a66] select-none"
-        >🤗 traces</span
+      <a
+        href="https://huggingface.co/datasets?format=format%3Aagent-traces"
+        target="_blank"
+        rel="noopener noreferrer"
+        class="ml-auto text-[12px] text-[#6a6a66] hover:text-[#222220] hover:underline select-none transition-colors"
+        title="Browse agent-trace datasets on Hugging Face"
       >
+        🤗 traces
+      </a>
     </div>
 
     <!-- url prompt -->
@@ -237,6 +269,23 @@
       </button>
     </div>
 
+    <!-- examples -->
+    <div
+      class="flex flex-wrap items-center gap-2 px-5 py-2 border-b border-[#eeeae0] shrink-0"
+    >
+      <span class="text-[11px] text-[#888] select-none">examples:</span>
+      {#each examples as ex}
+        <button
+          type="button"
+          onclick={() => pickExample(ex)}
+          disabled={loading || playing}
+          class="text-[11px] px-2 py-1 bg-[#fffbe6] border border-[#ffedb0] rounded hover:bg-[#ffd21e] hover:border-[#ffbb1a] disabled:opacity-50 disabled:hover:bg-[#fffbe6] disabled:hover:border-[#ffedb0] transition-colors cursor-pointer"
+        >
+          {ex.label}
+        </button>
+      {/each}
+    </div>
+
     <!-- messages / log -->
     <div bind:this={listEl} class="flex-1 overflow-y-auto px-5 py-3">
       {#if loading}