pr_01m47d15m3e54sn21z27rpy5n9/apps/web/app/components/repo-settings-heading.tsx

32 lines2,072 bytesCodeBlame
1import { useLocation } from "react-router";
2
3/** Each of a project's settings pages: its name and what it is for. */
4const PAGES: Record<string, { title: string; about: string }> = {
5 "": { title: "General", about: "The project's name, where its code lives, and what it is for." },
6 deployments: { title: "Deployments", about: "How the project builds, where it runs, and its previews." },
7 domains: { title: "Domains", about: "Addresses of your own for the production deployment." },
8 dependencies: { title: "Dependencies", about: "What the project relies on and what relies on it." },
9 agents: { title: "Agents", about: "How g1t's agents pick up work here, and what they read first." },
10 guardrails: { title: "Guardrails", about: "What agents may reach, run and spend while they work here." },
11 repository: { title: "Repository", about: "Its name, details and default branch, who can see it, and archiving, moving or deleting it." },
12 access: { title: "Access", about: "Who can see and change the repository, with which role, and invitations to it." },
13 branches: { title: "Branches and merging", about: "Protection for the default branch, what a pull request needs before it merges, and what agents do." },
14 secrets: { title: "Secrets and variables", about: "Values workflows, builds and deployments read at run time." },
15 webhooks: { title: "Webhooks", about: "Addresses g1t calls when something happens in the project." },
16};
17
18/**
19 * The heading of a project's settings page, named from the address. The
20 * pages themselves are listed in the sidebar while you are in settings.
21 */
22export function RepoSettingsHeading({ base }: { base: string }) {
23 const { pathname } = useLocation();
24 const section = pathname.slice(`${base}/settings`.length).replace(/^\//, "").split("/")[0] ?? "";
25 const page = PAGES[section] ?? PAGES[""]!;
26 return (
27 <header className="mb-8 border-b border-line pb-5">
28 <h1 className="text-lg font-semibold tracking-tight">{page.title}</h1>
29 <p className="mt-1 text-sm text-muted">{page.about}</p>
30 </header>
31 );
32}