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: |
| 7 | | "code" |
| 8 | | "branches" |
| 9 | | "tags" |
| 10 | | "commits" |
| 11 | | "issues" |
| 12 | | "patches" |
| 13 | | "releases" |
| 14 | | "settings"; |
| 15 | user?: SessionUser | null; |
| 16 | } |
| 17 | |
| 18 | export function RepoNav({ repo, active, user }: RepoNavProps) { |
| 19 | const tabs = [ |
| 20 | { key: "code", label: "Code", href: `/${repo.name}` }, |
| 21 | { key: "branches", label: "Branches", href: `/${repo.name}/branches` }, |
| 22 | { key: "tags", label: "Tags", href: `/${repo.name}/tags` }, |
| 23 | { |
| 24 | key: "commits", |
| 25 | label: "Commits", |
| 26 | href: `/${repo.name}/commits/${repo.default_branch}`, |
| 27 | }, |
| 28 | { key: "issues", label: "Issues", href: `/${repo.name}/issues` }, |
| 29 | { key: "patches", label: "Patches", href: `/${repo.name}/patches` }, |
| 30 | { key: "releases", label: "Releases", href: `/${repo.name}/releases` }, |
| 31 | ] as const; |
| 32 | return ( |
| 33 | <div class="repo-nav-bar"> |
| 34 | <nav class="repo-tabs"> |
| 35 | {tabs.map((t) => ( |
| 36 | <a |
| 37 | href={t.href} |
| 38 | class={`repo-tab${active === t.key ? " active" : ""}`} |
| 39 | > |
| 40 | {t.label} |
| 41 | </a> |
| 42 | ))} |
| 43 | {user?.isAdmin && ( |
| 44 | <a |
| 45 | href={`/${repo.name}/settings`} |
| 46 | class={`repo-tab${active === "settings" ? " active" : ""}`} |
| 47 | > |
| 48 | Settings |
| 49 | </a> |
| 50 | )} |
| 51 | </nav> |
| 52 | </div> |
| 53 | ); |
| 54 | } |
| 55 |