chadtmiller.com/knotless

<script lang="ts">
	import { date, plural, repoHref, subject } from '#lib/format.ts';
	import CommitAuthor from '#lib/molecules/CommitAuthor.svelte';
	import Sha from '#lib/atoms/Sha.svelte';
	import DiffFile from '#lib/organisms/DiffFile.svelte';
	import RepoPage from '#lib/templates/RepoPage.svelte';
	let { data } = $props();
	const ch = $derived(data.change);
	const r = $derived(ch.repo);
	const c = $derived(ch.commit);
	const cut = $derived(c.message.indexOf('\n'));
	const title = $derived(cut < 0 ? c.message : c.message.slice(0, cut));
	const rest = $derived(cut < 0 ? '' : c.message.slice(cut + 1).trim());
	const added = $derived(ch.files.reduce((n, f) => n + f.added, 0));
	const removed = $derived(ch.files.reduce((n, f) => n + f.removed, 0));
</script>

<RepoPage repo={r} tab="commits" title="{subject(c.message)} · {r.name}">
	<div class="box">
		<div class="commit-msg">
			<h2>{title}</h2>
			{#if rest}<pre>{rest}</pre>{/if}
		</div>
		<div class="boxhead" style="border-top:1px solid var(--line);border-bottom:0">
			<CommitAuthor commit={c} />
			<span class="mute">committed on {date(c.date)}</span>
			<span class="end mute">{#each c.parents as p, i (p)}{i ? ' parent ' : 'parent '}<Sha sha={p} href={repoHref(r.authority, r.name, `/commit/${p}`)} />{/each}{c.parents.length ? ' commit ' : 'commit '}<Sha sha={c.sha} /></span>
		</div>
	</div>
	<div class="summary">Showing <b>{plural(ch.files.length, 'changed file', 'changed files')}</b> with <b class="add">{plural(added, 'addition', 'additions')}</b> and <b class="rem">{plural(removed, 'deletion', 'deletions')}</b></div>
	{#each ch.files as f, i (i)}<DiffFile file={f} />{/each}
</RepoPage>