RepoNav.tsx
| 1 | import type { RepositoryRow } from "../../db/index.ts"; |
| 2 | import type { SessionUser } from "../../middleware/session.ts"; |
| 3 | |
| 4 | interface RepoNavProps { |
| 5 | repo: RepositoryRow; |
| 6 | active: "code" | "commits" | "issues" | "patches" | "releases" | "settings"; |
| 7 | user?: SessionUser | null; |
| 8 | } |
| 9 | |
| 10 | export function RepoNav({ repo, active, user }: RepoNavProps) { |
| 11 | const tabs = [ |
| 12 | { key: "code", label: "Code", href: `/${repo.name}` }, |
| 13 | { |
| 14 | key: "commits", |
| 15 | label: "Commits", |
| 16 | href: `/${repo.name}/commits/${repo.default_branch}`, |
| 17 | }, |
| 18 | { key: "issues", label: "Issues", href: `/${repo.name}/issues` }, |
| 19 | { key: "patches", label: "Patches", href: `/${repo.name}/patches` }, |
| 20 | { key: "releases", label: "Releases", href: `/${repo.name}/releases` }, |
| 21 | ] as const; |
| 22 | return ( |
| 23 | <div class="repo-nav-bar"> |
| 24 | <nav class="repo-tabs"> |
| 25 | {tabs.map((t) => ( |
| 26 | <a |
| 27 | href={t.href} |
| 28 | class={`repo-tab${active === t.key ? " active" : ""}`} |
| 29 | > |
| 30 | {t.label} |
| 31 | </a> |
| 32 | ))} |
| 33 | {user?.isAdmin && ( |
| 34 | <a |
| 35 | href={`/${repo.name}/settings`} |
| 36 | class={`repo-tab${active === "settings" ? " active" : ""}`} |
| 37 | > |
| 38 | Settings |
| 39 | </a> |
| 40 | )} |
| 41 | </nav> |
| 42 | </div> |
| 43 | ); |
| 44 | } |
| 45 |