From 85b5a20c7e05976134bf82228d72659642c68ec6 Mon Sep 17 00:00:00 2001
From: Scott Chacon <schacon@gmail.com>
Date: Wed, 22 Jan 2025 15:38:39 +0100
Subject: [PATCH] show reviewers group

---
 .../branches/BranchIndexCard.svelte           |  2 +-
 .../components/changes/ChangeIndexCard.svelte |  3 ++-
 .../review/PatchReviewersGroup.svelte         | 27 +++++++++++++++++++
 3 files changed, 30 insertions(+), 2 deletions(-)
 create mode 100644 apps/web/src/lib/components/review/PatchReviewersGroup.svelte

diff --git a/apps/web/src/lib/components/branches/BranchIndexCard.svelte b/apps/web/src/lib/components/branches/BranchIndexCard.svelte
index 80eba6a5e8..996d00a00a 100644
--- a/apps/web/src/lib/components/branches/BranchIndexCard.svelte
+++ b/apps/web/src/lib/components/branches/BranchIndexCard.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import BranchStatusBadge from '../review/BranchStatusBadge.svelte';
 	import CommitsGraph from '../review/CommitsGraph.svelte';
 	import { BranchService } from '@gitbutler/shared/branches/branchService';
 	import {
@@ -18,7 +19,6 @@
 	import AvatarGroup from '@gitbutler/ui/avatar/AvatarGroup.svelte';
 	import dayjs from 'dayjs';
 	import relativeTime from 'dayjs/plugin/relativeTime';
-	import BranchStatusBadge from '../review/BranchStatusBadge.svelte';
 
 	dayjs.extend(relativeTime);
 
diff --git a/apps/web/src/lib/components/changes/ChangeIndexCard.svelte b/apps/web/src/lib/components/changes/ChangeIndexCard.svelte
index a681bf9fc0..b0a07f9221 100644
--- a/apps/web/src/lib/components/changes/ChangeIndexCard.svelte
+++ b/apps/web/src/lib/components/changes/ChangeIndexCard.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import PatchReviewersGroup from '../review/PatchReviewersGroup.svelte';
 	import { PatchService } from '@gitbutler/shared/branches/patchService';
 	import { getPatch } from '@gitbutler/shared/branches/patchesPreview.svelte';
 	import {
@@ -73,7 +74,7 @@
 					{/await}
 				</div>
 			</td>
-			<td><div></div></td>
+			<td><div><PatchReviewersGroup {patch} /></div></td>
 			<td><div></div></td>
 		</tr>
 	{/snippet}
diff --git a/apps/web/src/lib/components/review/PatchReviewersGroup.svelte b/apps/web/src/lib/components/review/PatchReviewersGroup.svelte
new file mode 100644
index 0000000000..311aadf37e
--- /dev/null
+++ b/apps/web/src/lib/components/review/PatchReviewersGroup.svelte
@@ -0,0 +1,27 @@
+<script lang="ts">
+	import AvatarGroup from '@gitbutler/ui/avatar/AvatarGroup.svelte';
+	import { gravatarUrlFromEmail } from '@gitbutler/ui/avatar/gravatar';
+	import type { Patch } from '@gitbutler/shared/branches/types';
+
+	type Props = {
+		patch: Patch;
+	};
+
+	const { patch }: Props = $props();
+
+	async function getContributorsWithAvatars(patch: Patch) {
+		return await Promise.all(
+			patch.reviewAll.viewed.map(async (contributor) => {
+				return {
+					srcUrl: await gravatarUrlFromEmail(contributor),
+					name: contributor
+				};
+			})
+		);
+	}
+	const avatars = $derived(getContributorsWithAvatars(patch));
+</script>
+
+{#await avatars then avatars}
+	<div class="container"><AvatarGroup {avatars} /></div>
+{/await}