alice.pds.demo.boltless.dev
This repository has no description
1<script lang="ts">
2 import { resolve } from "$app/paths";
3 import TimeAgo from "$lib/components/ui/TimeAgo.svelte";
4 import User from "$lib/components/ui/User.svelte";
5 import PullStatePill, { type PullStatePillVariants } from "./PullStatePill.svelte";
6
7 interface Props {
8 state: PullStatePillVariants["state"];
9 authorHandle: string;
10 authorDid: string;
11 // absent on the mock loader for now, the separator hides with it
12 createdAt?: string;
13 ownerHandle: string;
14 repoName: string;
15 targetBranch: string;
16 // missing on patch-based pulls, which have no branch to point at
17 sourceBranch?: string;
18 // set only when the source branch lives in a fork, as `owner/repo` or a did
19 sourceRepo?: string;
20 }
21
22 let {
23 state,
24 authorHandle,
25 authorDid,
26 createdAt,
27 ownerHandle,
28 repoName,
29 targetBranch,
30 sourceBranch,
31 sourceRepo
32 }: Props = $props();
33
34 const treeHref = (repo: string, ref: string) =>
35 resolve(`/${repo}/tree/${encodeURIComponent(ref)}` as "/");
36 const target = $derived(`${ownerHandle}/${repoName}`);
37 const chip =
38 "inline-flex items-center gap-0.5 rounded-sm bg-background-inset px-2 typography-monospace-small";
39</script>
40
41<div
42 class="flex flex-wrap items-center gap-x-1 gap-y-1.5 typography-paragraph-small text-foreground-subtle"
43>
44 <PullStatePill {state} />
45
46 <span class="ml-1 flex items-center gap-1">
47 opened by
48 <User handle={authorHandle} did={authorDid} />
49 </span>
50
51 {#if createdAt}
52 <span class="before:mr-1 before:content-['·']">
53 <TimeAgo value={createdAt} />
54 </span>
55 {/if}
56
57 <span class="flex items-center gap-1 before:mr-1 before:content-['·']">
58 targeting
59 <span class={chip}>
60 <a href={treeHref(target, targetBranch)} class="no-underline hover:underline"
61 >{targetBranch}</a
62 >
63 </span>
64 </span>
65
66 {#if sourceBranch}
67 <span class="flex items-center gap-1">
68 from
69 <span class={chip}>
70 {#if sourceRepo}
71 <a href={resolve(`/${sourceRepo}` as "/")} class="no-underline hover:underline">fork</a>:
72 {/if}
73 <a href={treeHref(sourceRepo ?? target, sourceBranch)} class="no-underline hover:underline"
74 >{sourceBranch}</a
75 >
76 </span>
77 </span>
78 {/if}
79</div>