feat: make commit list items clickable, link to Tangled commit pages

33 	import type { RefUpdateView } from '$lib/generated/views.js';
44 	import { resolveHandle } from '$lib/api/handle.js';
55 
6-	let { refUpdates }: { refUpdates: RefUpdateView[] } = $props();
6+	let {
7+		refUpdates,
8+		commitUrlBase = ''
9+	}: {
10+		refUpdates: RefUpdateView[];
11+		commitUrlBase?: string;
12+	} = $props();
713 
814 	let handles = $state<Record<string, string>>({});
915 

3238 			year: 'numeric'
3339 		});
3440 	}
41+
42+	function commitUrl(hash: string): string | undefined {
43+		if (!commitUrlBase || !hash) return undefined;
44+		return `${commitUrlBase}/${hash}`;
45+	}
46+
47+	let isExternal = $derived(commitUrlBase.startsWith('http'));
3548 </script>
3649 
3750 {#if refUpdates.length === 0}

3952 {:else}
4053 	<ul class="divide-y divide-border">
4154 		{#each refUpdates as update (update.rkey)}
42-			<li class="flex items-center justify-between gap-4 py-3">
43-				<div class="min-w-0 flex-1">
44-					<div class="flex items-center gap-2">
45-						<span class="rounded bg-surface-2 px-1.5 py-0.5 font-mono text-xs text-accent">
46-							{(update.refName ?? '').replace('refs/heads/', '') || 'unknown'}
47-						</span>
48-						<code class="font-mono text-xs text-text-secondary">
49-							{truncateHash(update.newTarget)}
50-						</code>
55+			{@const url = commitUrl(update.newTarget)}
56+			<li>
57+				{#if url}
58+					<a
59+						href={url}
60+						class="flex items-center justify-between gap-4 py-3 -mx-2 px-2 rounded transition-colors hover:bg-surface-2"
61+						target={isExternal ? '_blank' : undefined}
62+						rel={isExternal ? 'noopener noreferrer' : undefined}
63+					>
64+						{@render commitContent(update)}
65+					</a>
66+				{:else}
67+					<div class="flex items-center justify-between gap-4 py-3">
68+						{@render commitContent(update)}
5169 					</div>
52-					{#if update.committerDid}
53-						<p class="mt-0.5 text-xs text-text-secondary">
54-							{displayName(update.committerDid)}
55-						</p>
56-					{/if}
57-				</div>
58-				<div class="flex shrink-0 items-center gap-3 text-xs text-text-secondary">
59-					{#if update.breakingChangeCount > 0}
60-						<span class="font-medium text-breaking">
61-							{update.breakingChangeCount} breaking
62-						</span>
63-					{/if}
64-					{#if update.lensQuality != null && typeof update.lensQuality === 'number'}
65-						<span title="Lens quality">
66-							lens {(update.lensQuality * 100).toFixed(0)}%
67-						</span>
68-					{/if}
69-					<time datetime={update.createdAt}>
70-						{formatTimestamp(update.createdAt)}
71-					</time>
72-				</div>
70+				{/if}
7371 			</li>
7472 		{/each}
7573 	</ul>
7674 {/if}
75+
76+{#snippet commitContent(update: RefUpdateView)}
77+	<div class="min-w-0 flex-1">
78+		<div class="flex items-center gap-2">
79+			<span class="rounded bg-surface-2 px-1.5 py-0.5 font-mono text-xs text-accent">
80+				{(update.refName ?? '').replace('refs/heads/', '').replace('refs/tags/', '') || 'unknown'}
81+			</span>
82+			<code class="font-mono text-xs text-text-secondary">
83+				{truncateHash(update.newTarget)}
84+			</code>
85+		</div>
86+		{#if update.committerDid}
87+			<p class="mt-0.5 text-xs text-text-secondary">
88+				{displayName(update.committerDid)}
89+			</p>
90+		{/if}
91+	</div>
92+	<div class="flex shrink-0 items-center gap-3 text-xs text-text-secondary">
93+		{#if update.breakingChangeCount > 0}
94+			<span class="font-medium text-breaking">
95+				{update.breakingChangeCount} breaking
96+			</span>
97+		{/if}
98+		{#if update.lensQuality != null && typeof update.lensQuality === 'number'}
99+			<span title="Lens quality">
100+				lens {(update.lensQuality * 100).toFixed(0)}%
101+			</span>
102+		{/if}
103+		<time datetime={update.createdAt}>
104+			{formatTimestamp(update.createdAt)}
105+		</time>
106+	</div>
107+{/snippet}

149149 
150150 	<div class="rounded-lg border border-border bg-surface-1 p-4">
151151 		<h2 class="mb-3 text-sm font-medium text-text-primary">Recent Activity</h2>
152-		<CommitList refUpdates={data.refUpdates.items} />
152+		<CommitList
153+			refUpdates={data.refUpdates.items}
154+			commitUrlBase={isTangled
155+				? `https://tangled.sh/${ownerLabel}/${data.repo.name}/commit`
156+				: `${basePath}/commit`}
157+		/>
153158 	</div>
154159 {:else}
155160 	<div class="mb-6">