towards multi-user

site/src/components/ActivityFeed.svelte

@@ -28,6 +28,13 @@
       .join(' ');
   }
 
+  /** Base URL of the site (passed from Astro). */
+  export let base: string = '/';
+  /** When set, load this index URL instead of the root (for per-user profile pages). */
+  export let profileIndexUrl: string = '';
+  /** When set, only show activities from this handle. */
+  export let filterHandle: string = '';
+
   const PAGE_SIZE = 60;
 
   let all: ActivitySummary[] = [];
@@ -54,8 +61,13 @@
     sport = (new URLSearchParams(window.location.search).get('sport') as Sport | 'all') ?? 'all';
     mounted = true;
     try {
-      const index = await loadIndex(import.meta.env.BASE_URL);
-      all = index.activities.filter(a => a.privacy !== 'private');
+      const indexUrl = profileIndexUrl
+        ? `${base}data/${profileIndexUrl}`
+        : `${base}data/index.json`;
+      const index = await loadIndex(base, indexUrl);
+      let activities = index.activities.filter(a => a.privacy !== 'private');
+      if (filterHandle) activities = activities.filter(a => a.handle === filterHandle);
+      all = activities;
     } catch (e: any) {
       error = e.message;
     } finally {
@@ -117,7 +129,9 @@
         <!-- header -->
         <div class="flex items-start justify-between gap-2 mb-3">
           <div class="flex-1 min-w-0">
-            <p class="text-xs text-zinc-500 mb-0.5">{formatDate(a.started_at)}</p>
+            <p class="text-xs text-zinc-500 mb-0.5">
+              {formatDate(a.started_at)}{#if a.handle} · <a href={`${import.meta.env.BASE_URL}${a.handle}/`} class="hover:text-zinc-300 transition-colors" on:click|stopPropagation>@{a.handle}</a>{/if}
+            </p>
             <h3 class="font-semibold text-white truncate group-hover:text-[--accent] transition-colors">
               {a.title}
             </h3>