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 defaultBranch={repo.defaultBranch}
36 />
37
38 <form
39 class="order-last w-full md:order-0 md:w-64"
40 method="GET"
41 action={resolve(`${base}/search` as "/")}
42 >
43 <Input
44 class="w-full"
45 type="text"
46 name="q"
47 placeholder="Find files or code..."
48 aria-label="Search this repository"
49 iconLeft={SearchCode}
50 />
51 </form>
52
53 <div class="flex items-center gap-3">
54 <a
55 href={resolve(`${base}/commits/${encodedRef}` as "/")}
56 class="inline-flex items-center gap-1 typography-paragraph-small font-bold text-foreground-default no-underline hover:underline md:hidden"
57 >
58 <GitCommitHorizontal class="size-4" aria-hidden="true" />
59 {totalCommits}
60 </a>
61 <a
62 href={resolve(`${base}/branches` as "/")}
63 class="inline-flex items-center gap-1 typography-paragraph-small font-bold text-foreground-default no-underline hover:underline md:hidden"
64 >
65 <GitBranch class="size-4" aria-hidden="true" />
66 {totalBranches}
67 </a>
68 <a
69 href={resolve(`${base}/tags` as "/")}
70 class="inline-flex items-center gap-1 typography-paragraph-small font-bold text-foreground-default no-underline hover:underline md:hidden"
71 >
72 <Tags class="size-4" aria-hidden="true" />
73 {totalTags}
74 </a>
75 <CloneDropdown {repo} {ref} {bobbinUrl} />
76 </div>
77</div>