Monorepo for Tangled
Something went wrong. Try again.
Svelte
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293<script lang="ts"> import { dev } from "$app/environment"; import { page } from "$app/state"; import SquareChartGantt from "$icon/square-chart-gantt"; import BookMarked from "$icon/book-marked"; import Star from "$icon/star"; import LineSquiggle from "$icon/line-squiggle"; import Shield from "$icon/shield"; import UsersRound from "$icon/users-round"; import Settings from "$icon/settings"; import Tabs, { type TabDef } from "$lib/components/ui/Tabs.svelte"; import { organizationMemberCount } from "$lib/components/profile/organization/mock"; import type { ProfileCounts } from "$lib/components/profile/types";
interface Props { handle: string; active: string; counts: ProfileCounts; organization?: boolean; }
let { handle, active, counts, organization = false }: Props = $props();
const hrefFor = (id: string) => { const query = new URLSearchParams([ ...(id === "overview" ? [] : [["tab", id]]), ...(dev && page.url.searchParams.get("preview") === "organization" ? [["preview", "organization"]] : []) ]).toString(); return `/${handle}${query ? `?${query}` : ""}`; };
const tabs = $derived<TabDef[]>( organization ? [ { id: "overview", label: "Overview", icon: SquareChartGantt, href: hrefFor("overview") }, { id: "repos", label: "Repositories", icon: BookMarked, count: counts.repos, href: hrefFor("repos") }, { id: "members", label: "Members", icon: UsersRound, count: organizationMemberCount, href: hrefFor("members") }, { id: "settings", label: "Settings", icon: Settings, href: hrefFor("settings") } ] : [ { id: "overview", label: "Overview", icon: SquareChartGantt, href: hrefFor("overview") }, { id: "repos", label: "Repositories", icon: BookMarked, count: counts.repos, href: hrefFor("repos") }, { id: "starred", label: "Starred", icon: Star, count: counts.stars, href: hrefFor("starred") }, { id: "strings", label: "Strings", icon: LineSquiggle, count: counts.strings, href: hrefFor("strings") }, { id: "vouches", label: "Vouches", icon: Shield, href: hrefFor("vouches") } ] );</script>
<Tabs {tabs} {active} overlapBottom={true} label="profile sections" />