johnandersen777.bsky.social/knotless

Switch repository

Loading…

<script lang="ts">
	import type { StackView } from '#lib/lexicons/dev/knotless/defs.ts';
	import { itemHref } from '#lib/format.ts';
	import Icon from '#lib/atoms/Icon.svelte';
	import Sha from '#lib/atoms/Sha.svelte';
	/** Above a stacked pull's files: what its diff leaves out, and the pulls either side of it to read next, on the repository at `base`. */
	let { stack, current, base }: { stack: StackView; current: string; base: string } = $props();
	const at = $derived(stack.pulls.findIndex((p) => p.item.uri === current));
	const above = $derived(at > 0 ? stack.pulls[at - 1] : undefined);
	const below = $derived(stack.pulls[at + 1]);
</script>

<div class="box stack-scope">
	{#if below}
		<div class="row">
			<Icon name="stack" />
			{#if below.merged}
				<p>
					<b>Only what this pull adds.</b>{` ${below.item.title} landed as `}<Sha
						sha={below.merged}
					/>{', so its changes do not show here again.'}
				</p>
			{:else}
				<p><b>Only what this pull adds.</b>{` It is built on ${below.item.title}.`}</p>
			{/if}
		</div>
	{/if}
	<nav class="stack-next" aria-label="Pulls in this stack">
		{#if below}<a href="{itemHref(base, below.item.uri)}/files"
				><span class="mute">Below</span><span class="title">{below.item.title}</span></a
			>{/if}
		{#if above}<a class="after" href="{itemHref(base, above.item.uri)}/files"
				><span class="mute">Above</span><span class="title">{above.item.title}</span></a
			>{/if}
	</nav>
</div>