This repository has no description
1<script lang="ts">
2 import { resolve } from "$app/paths";
3 import GitBranch from "$icon/git-branch";
4 import GitCommitHorizontal from "$icon/git-commit-horizontal";
5 import SearchCode from "$icon/search-code";
6 import Tags from "$icon/tags";
7 import Input from "$lib/components/ui/Input.svelte";
8 import CloneDropdown from "./CloneDropdown.svelte";
9 import RefSelector from "./RefSelector.svelte";
10 import type { RepoInfo } from "./types";
11
12 interface Props {
13 repo: RepoInfo;
14 ref: string;
15 refs: { branches: string[]; tags: string[] };
16 totalCommits: number;
17 totalBranches: number;
18 totalTags: number;
19 bobbinUrl: string;
20 }
21
22 let { repo, ref, refs, totalCommits, totalBranches, totalTags, bobbinUrl }: Props = $props();
23
24 const base = $derived(`/${repo.ownerHandle}/${repo.name}`);
25 const encodedRef = $derived(encodeURIComponent(ref));
26</script>
27
28<div class="flex flex-wrap items-center justify-between gap-3 pb-5">
29 <RefSelector
30 ownerHandle={repo.ownerHandle}
31 repoName={repo.name}
32 current={ref}
33 branches={refs.branches}
34 tags={refs.tags}
35 />
36
37 <form
38 class="order-last w-full md:order-none md:w-64"
39 method="GET"
40 action={resolve(`${base}/search` as "/")}
41 >
42 <Input
43 class="w-full"
44 type="text"
45 name="q"
46 placeholder="Find files or code..."
47 aria-label="Search this repository"
48 iconLeft={SearchCode}
49 />
50 </form>
51
52 <div class="flex items-center gap-3">
53 <a
54 href={resolve(`${base}/commits/${encodedRef}` as "/")}
55 class="inline-flex items-center gap-1 text-sm font-medium text-foreground-default no-underline hover:underline md:hidden"
56 >
57 <GitCommitHorizontal class="size-4" aria-hidden="true" />
58 {totalCommits}
59 </a>
60 <a
61 href={resolve(`${base}/branches` as "/")}
62 class="inline-flex items-center gap-1 text-sm font-medium text-foreground-default no-underline hover:underline md:hidden"
63 >
64 <GitBranch class="size-4" aria-hidden="true" />
65 {totalBranches}
66 </a>
67 <a
68 href={resolve(`${base}/tags` as "/")}
69 class="inline-flex items-center gap-1 text-sm font-medium text-foreground-default no-underline hover:underline md:hidden"
70 >
71 <Tags class="size-4" aria-hidden="true" />
72 {totalTags}
73 </a>
74 <CloneDropdown {repo} {ref} {bobbinUrl} />
75 </div>
76</div>