alice.pds.demo.boltless.dev
This repository has no description
1<script lang="ts">
2 import RefChip from "./RefChip.svelte";
3 import RepoCrumbs from "./RepoCrumbs.svelte";
4 import type { TreeEntrySummary } from "./types";
5
6 interface Props {
7 ownerHandle: string;
8 repoName: string;
9 ref: string;
10 path: string;
11 entries: TreeEntrySummary[];
12 }
13
14 let { ownerHandle, repoName, ref, path, entries }: Props = $props();
15
16 const folders = $derived(
17 entries.filter((entry) => entry.kind === "directory" || entry.kind === "submodule").length
18 );
19 const files = $derived(entries.length - folders);
20 const plural = (count: number, noun: string) => `${count} ${noun}${count === 1 ? "" : "s"}`;
21</script>
22
23<div class="flex items-center justify-between gap-2 typography-paragraph-regular mb-2">
24 <div class="flex min-w-0 items-center gap-3">
25 <RepoCrumbs {ownerHandle} {repoName} {ref} {path} />
26
27 <div class="flex items-center gap-2 text-foreground-muted">
28 {#if folders > 0}
29 <span>{plural(folders, "folder")}</span>
30 {/if}
31 {#if folders > 0 && files > 0}
32 <span aria-hidden="true">·</span>
33 {/if}
34 {#if files > 0}
35 <span>{plural(files, "file")}</span>
36 {/if}
37 </div>
38 </div>
39
40 <RefChip {ownerHandle} {repoName} {ref} class="hidden md:flex" />
41</div>