alice.pds.demo.boltless.dev
This repository has no description
1<script lang="ts">
2 import { resolve } from "$app/paths";
3 import type { CommitDetail } from "$lib/api/repo";
4 import Avatar from "$lib/components/ui/Avatar.svelte";
5 import TimeAgo from "$lib/components/ui/TimeAgo.svelte";
6 import { formatDateTime } from "$lib/format";
7
8 interface Props {
9 ownerHandle: string;
10 repoName: string;
11 commit: CommitDetail;
12 // empty for a root commit
13 parent?: string;
14 changeId?: string;
15 }
16
17 let { ownerHandle, repoName, commit, parent = "", changeId = "" }: Props = $props();
18
19 const base = $derived(`/${ownerHandle}/${repoName}`);
20
21 const showCommitter = $derived(
22 commit.committerEmail !== "" && commit.committerEmail !== commit.authorEmail
23 );
24 const parentShort = $derived(parent.slice(0, 8));
25 const changeIdShort = $derived(changeId.slice(0, 8));
26
27 const absoluteTime = $derived(formatDateTime(commit.committerWhen));
28</script>
29
30<section class="text-foreground-default">
31 <div>
32 <p class="pb-2 typography-paragraph-large">{commit.subject}</p>
33 {#if commit.body}
34 <p class="mt-1 cursor-text pb-2 typography-paragraph-regular whitespace-pre-wrap">
35 {commit.body}
36 </p>
37 {/if}
38 </div>
39
40 {#snippet attribution(label: string, name: string, email: string)}
41 <span class="inline-flex flex-wrap items-center">
42 <span class="w-24 text-foreground-subtle select-none">{label}</span>
43 <!-- no email -> did mapping here, always the fallback form -->
44 <span class="flex items-center gap-1">
45 <Avatar size="size-6" />
46 {#if email}
47 <a href="mailto:{email}" class="no-underline hover:underline">{name}</a>
48 {:else}
49 <span>{name}</span>
50 {/if}
51 </span>
52 </span>
53 {/snippet}
54
55 <div class="flex flex-col gap-2 pt-4 typography-paragraph-regular">
56 <div class="flex flex-col gap-1 font-mono text-foreground-muted">
57 {@render attribution("author", commit.authorName, commit.authorEmail)}
58
59 {#each commit.coAuthors as coAuthor (coAuthor.email)}
60 {@render attribution("co-author", coAuthor.name, coAuthor.email)}
61 {/each}
62
63 {#if showCommitter}
64 {@render attribution("committer", commit.committerName, commit.committerEmail)}
65 {/if}
66
67 {#if commit.committerWhen}
68 <span class="inline-flex flex-wrap items-center">
69 <span class="w-24 text-foreground-subtle select-none">date</span>
70 <span class="inline-flex flex-wrap items-center gap-1">
71 <TimeAgo value={commit.committerWhen} variant="full" />
72 {#if absoluteTime}
73 <span>({absoluteTime})</span>
74 {/if}
75 </span>
76 </span>
77 {/if}
78
79 {#if commit.hash}
80 <span class="inline-flex flex-wrap items-center">
81 <span class="w-24 text-foreground-subtle select-none">commit</span>
82 <a
83 href={resolve(`${base}/commit/${commit.hash}` as "/")}
84 class="break-all no-underline hover:underline"
85 >
86 <span class="md:hidden">{commit.shortHash}</span>
87 <span class="hidden md:inline">{commit.hash}</span>
88 </a>
89 </span>
90 {/if}
91
92 {#if parent}
93 <span class="inline-flex flex-wrap items-center">
94 <span class="w-24 text-foreground-subtle select-none">parent</span>
95 <a
96 href={resolve(`${base}/commit/${parent}` as "/")}
97 class="break-all no-underline hover:underline"
98 >
99 <span class="md:hidden">{parentShort}</span>
100 <span class="hidden md:inline">{parent}</span>
101 </a>
102 </span>
103 {/if}
104
105 {#if changeId}
106 <span class="inline-flex flex-wrap items-center">
107 <span class="w-24 text-foreground-subtle select-none">change-id</span>
108 <span class="break-all">
109 <span class="md:hidden">{changeIdShort}</span>
110 <span class="hidden md:inline">{changeId}</span>
111 </span>
112 </span>
113 {/if}
114 </div>
115 </div>
116</section>