From c5cc6cded66f912833085d6849d89a174c2bd792 Mon Sep 17 00:00:00 2001
From: eti <eti@eti.tf>
Date: Fri, 18 Sep 2026 15:52:04 +0200
Subject: [PATCH] web/repo: resolve CommitSignOff emails to avatars

Signed-off-by: eti <eti@eti.tf>
---
 .../lib/components/repo/CommitSignOff.svelte  | 38 ++++++++++++++-----
 1 file changed, 28 insertions(+), 10 deletions(-)

diff --git a/web/src/lib/components/repo/CommitSignOff.svelte b/web/src/lib/components/repo/CommitSignOff.svelte
index 7b2001cac..cbc9512b3 100644
--- a/web/src/lib/components/repo/CommitSignOff.svelte
+++ b/web/src/lib/components/repo/CommitSignOff.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
 	import UserRoundCheck from "$icon/user-round-check";
 	import type { SignOff } from "$lib/api/repo";
+	import { resolveEmailToDid } from "$lib/api/emailDid";
 	import Avatar from "$lib/components/ui/Avatar.svelte";
 	import Hovercard from "$lib/components/ui/Hovercard.svelte";
 
@@ -11,6 +12,14 @@
 	}
 
 	let { signOffs, class: className, size = "regular" }: Props = $props();
+	let opened = $state(false);
+	const emailDids = $derived(
+		opened
+			? resolveEmailToDid(fetch, [
+					...new Set(signOffs.flatMap((s) => (s.did ? [] : [s.email])))
+				])
+			: undefined
+	);
 
 	const sizeClass = $derived(
 		{ small: "size-3.5 -mt-px", regular: "size-4", large: "size-4.5" }[size]
@@ -22,6 +31,7 @@
 	cardClass="px-2.5 py-2 select-text"
 	openDelay={50}
 	closeDelay={300}
+	onOpen={() => (opened = true)}
 >
 	<UserRoundCheck
 		class="{sizeClass} shrink-0 cursor-pointer text-foreground-muted transition-colors duration-150 hover:text-foreground-default"
@@ -29,15 +39,23 @@
 		aria-label={signOffs.length > 1 ? "Signed off by several people" : "Signed off"}
 	/>
 	{#snippet content()}
-		<div class="flex flex-col gap-2">
-			{#each signOffs as signOff (signOff.line)}
-				<div class="flex items-center gap-2">
-					<Avatar did={signOff.did} handle={signOff.name} />
-					<span class="typography-monospace-regular whitespace-nowrap">
-						{signOff.line}
-					</span>
-				</div>
-			{/each}
-		</div>
+		{#await emailDids}
+			{@render signers()}
+		{:then dids}
+			{@render signers(dids)}
+		{/await}
 	{/snippet}
 </Hovercard>
+
+{#snippet signers(dids?: Map<string, string>)}
+	<div class="flex flex-col gap-2">
+		{#each signOffs as signOff (signOff.line)}
+			<div class="flex items-center gap-2">
+				<Avatar did={signOff.did ?? dids?.get(signOff.email)} handle={signOff.name} />
+				<span class="typography-monospace-regular whitespace-nowrap">
+					{signOff.line}
+				</span>
+			</div>
+		{/each}
+	</div>
+{/snippet}
-- 
2.51.2