johnandersen777.bsky.social/knotless

Switch repository

Loading…

<script lang="ts">
	import type { ReleaseView } from '#lib/lexicons/dev/knotless/defs.ts';
	import { page } from '$app/state';
	import { ago, plural, repoHref, size } from '#lib/format.ts';
	import { cargoUse, downloadHref, pullCommand, releaseAnchor } from '#lib/releases.ts';
	import Sha from '#lib/atoms/Sha.svelte';
	import Time from '#lib/atoms/Time.svelte';
	import Command from '#lib/molecules/Command.svelte';
	import ReleaseName from '#lib/molecules/ReleaseName.svelte';
	import Icon from '#lib/atoms/Icon.svelte';
	import { stepHref, stepOf } from '#lib/steps.ts';
	/**
	 * One release of `owner`'s repository `name`: which, when, from which
	 * commit, its notes, and its files, each with its size and SHA-256 and
	 * linked to download;
	 * or, for an image, the
	 * command that pulls it rather than its blobs, and for a crate, how
	 * Cargo adds it. A shared step's links to the step's page.
	 */
	let { owner, name, release: r }: { owner: string; name: string; release: ReleaseView } = $props();
	const step = $derived(stepOf(r.package));
	const bytes = $derived(r.files.reduce((n, f) => n + f.size, 0));
	const cargo = $derived(
		r.crate ? cargoUse(page.url.origin, r.uri, name, r.package, r.version) : undefined
	);
</script>

<article class="box release" id={releaseAnchor(r)}>
	<div class="boxhead">
		<ReleaseName release={r} />
		<span class="release-when mute"
			><Time at={r.createdAt} show={ago} />{#if r.commit}<Sha
					sha={r.commit}
					href={repoHref(owner, name, `/commit/${r.commit}`)}
				/>{/if}</span
		>
		{#if step}<a class="release-step" href={stepHref(owner, name, step)}
				><Icon name="workflow" />Shared step</a
			>{/if}
	</div>
	{#if r.html}<div class="prose">{@html r.html}</div>{/if}
	{#if r.image}
		<div class="release-pull">
			<Command text={pullCommand(page.url.host, owner, name, r.package, r.version)} />
			<p class="mute">
				An image: {plural(r.files.length - 1, 'blob', 'blobs')} and its index, {size(bytes)} in all.
			</p>
		</div>
	{:else if cargo}
		<div class="release-pull">
			<Command text={cargo.config} />
			<Command text={cargo.add} />
			<p class="mute">
				A crate. Add the registry to <code>.cargo/config.toml</code>, then add the crate with Cargo.
			</p>
		</div>
	{:else}
		<ul class="list release-files" aria-label="Files">
			{#each r.files as f (f.name)}
				<li>
					<a
						class="file-name"
						href={downloadHref(owner, name, r.package, r.version, f.name)}
						download>{f.name}</a
					>
					<span class="mute">{size(f.size)}</span>
					<code class="digest" title={f.sha256}>{`sha256:${f.sha256.slice(0, 12)}`}</code>
				</li>
			{/each}
		</ul>
	{/if}
</article>