Something went wrong. Try again.
Monorepo for Tangled
Something went wrong. Try again.
Svelte
at icy/tmrrpn
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091<script lang="ts"> import Ellipsis from "$icon/ellipsis"; import MessageSquare from "$icon/message-square"; import type { CommitStatuses } from "$lib/api/commitStatuses"; import Link from "$lib/components/ui/Link.svelte"; import Tag from "$lib/components/ui/Tag.svelte"; import PipelineWorkflows from "../pipelines/PipelineWorkflows.svelte"; import type { CommitSummary } from "../types";
interface Props { commit: CommitSummary; pipelineStatuses?: Promise<CommitStatuses>; highlight?: boolean; onclick?: () => void; onpointerenter?: () => void; onpointerleave?: () => void; }
let { commit, pipelineStatuses, highlight = false, onclick, onpointerenter, onpointerleave }: Props = $props();
let expanded = $state(false);
const short = (id: string) => id.slice(0, 8);</script>
<div class="flex min-h-10 flex-1 px-3"> <div class="min-h-10 flex-1"> <div class="flex items-center gap-1"> <div class="flex w-39 gap-2"> <Tag class="py-1 typography-monospace-small" color={highlight ? "highlight" : "default"} > {commit.shortHash} </Tag> {#if commit.changeId} <Tag class="py-1 typography-monospace-small">{short(commit.changeId)}</Tag> {/if} </div> <div role="none" {onpointerenter} {onpointerleave} class="flex h-10 items-center"> <Link {onclick}>{commit.subject}</Link> </div> {#if commit.body} <button type="button" class="shrink-0 cursor-pointer rounded-sm bg-background-inset px-1 hover:bg-background-muted" aria-expanded={expanded} aria-label="Toggle commit body" onclick={() => (expanded = !expanded)} > <Ellipsis class="size-3" aria-hidden="true" /> </button> {/if} </div>
{#if commit.body && expanded} <pre class="mb-2 rounded-sm bg-background-subtle px-2 py-1 typography-monospace-regular whitespace-pre-wrap">{commit.body}</pre> {/if} </div> <div class="flex h-10 items-center gap-2"> {#if pipelineStatuses} {#await pipelineStatuses then statuses} {#if statuses[commit.hash]} <PipelineWorkflows ownerHandle="tangled.org" repoName="core" size="mini" variant="symbol" pipeline={statuses[commit.hash]} /> {/if} {/await} <span class="after:text-foreground-muted after:content-['·']"></span> {/if} {#if commit.commentCount !== undefined} <div class="flex items-center gap-2 px-1 text-foreground-muted"> <span>{commit.commentCount}</span> <MessageSquare class="size-4" /> </div> {/if} </div></div>