<script lang="ts">
	import { resolve } from "$app/paths";
	import type { DiffFile, DiffStat } from "$lib/api/diff";
	import type { CommitDetail } from "$lib/api/repo";
	import { FULL_HASH_RE } from "$lib/api/repo";
	import CommitHeader from "./CommitHeader.svelte";
	import DiffView from "./DiffView.svelte";
	import type { DiffStyle } from "./pierre";
	import TabPanel from "$lib/components/ui/TabPanel.svelte";

	interface Props {
		ownerHandle: string;
		repoName: string;
		// the ref the page was loaded with. raw downloads only work for full hashes
		ref: string;
		commit: CommitDetail;
		// hex of the first parent, empty for a root commit
		parent?: string;
		changeId?: string;
		files: DiffFile[];
		stat?: DiffStat;
		// side-by-side or stacked
		diffStyle?: DiffStyle;
		// server-prerendered shadow dom per row key, only for the initial ssr
		prerendered?: Record<string, string>;
	}

	let {
		ownerHandle,
		repoName,
		ref,
		commit,
		parent = "",
		changeId = "",
		files,
		stat,
		diffStyle = "unified",
		prerendered
	}: Props = $props();

	const base = $derived(`/${ownerHandle}/${repoName}`);

	// the raw commit route only accepts full sha1/sha256 hex, anything shorter 404s
	const downloadUrls = $derived(
		FULL_HASH_RE.test(ref)
			? {
					patch: resolve(`${base}/commit/${ref}.patch` as "/"),
					diff: resolve(`${base}/commit/${ref}.diff` as "/")
				}
			: undefined
	);
	const blobBase = $derived(resolve(`${base}/blob/${encodeURIComponent(ref)}` as "/"));
</script>

<div class="flex flex-col gap-4">
	<TabPanel>
		<CommitHeader {ownerHandle} {repoName} {commit} {parent} {changeId} />
	</TabPanel>
	<DiffView {files} {stat} {diffStyle} {downloadUrls} {blobBase} {prerendered} />
</div>
