| 4 | 4 | | import type { Project } from "@g1t/contracts"; |
| 5 | 5 | | |
| 6 | 6 | | import type { Route } from "./+types/layout"; |
| 7 | + | import { Topics } from "../../components/topics"; |
| 7 | 8 | | import { page } from "../../lib/meta"; |
| 8 | 9 | | import { type Tab as PageTab, tabsFor } from "../../lib/project-nav"; |
| 9 | 10 | | import { Pill } from "../../components/ui"; |
| ⋯ |
| 74 | 75 | | } |
| 75 | 76 | | |
| 76 | 77 | | /** A repository's topics, each a way into Explore. */ |
| 77 | | − | function Topics({ topics }: { topics: string[] | undefined }) { |
| 78 | | − | if (!topics?.length) return null; |
| 79 | | − | return ( |
| 80 | | − | <div className="mt-2 flex flex-wrap gap-1.5"> |
| 81 | | − | {topics.map((topic) => ( |
| 82 | | − | <Link |
| 83 | | − | key={topic} |
| 84 | | − | to={`/explore?topic=${encodeURIComponent(topic)}`} |
| 85 | | − | className="rounded-full bg-accent/10 px-2 py-px text-xs text-accent ring-1 ring-accent/30 transition-colors hover:bg-accent/20" |
| 86 | | − | > |
| 87 | | − | {topic} |
| 88 | | − | </Link> |
| 89 | | − | ))} |
| 90 | | − | </div> |
| 91 | | − | ); |
| 92 | | − | } |
| 93 | | − | |
| 94 | 78 | | function Header({ project, isPrivate, archived, namespace, name, description, large }: { |
| 95 | 79 | | project: Project | null; |
| 96 | 80 | | isPrivate: boolean; |
| ⋯ |
| 171 | 155 | | const description = (project && !project.descriptionInherited ? project.description : null) ?? repo.description; |
| 172 | 156 | | const { pathname } = useLocation(); |
| 173 | 157 | | const tabs = tabsFor(pathname.slice(base.length + 1), member, access.can); |
| 158 | + | // The files' own About says what it is and its topics, as the one place. |
| 159 | + | const filesPage = /^(code|tree)(\/|$)/.test(pathname.slice(base.length + 1)); |
| 174 | 160 | | // Everyone, signed in or not, finds the project's pages in the sidebar; |
| 175 | 161 | | // the page shows its name, and the views of the page it is on as tabs. |
| 176 | 162 | | return ( |
| ⋯ |
| 184 | 170 | | namespace={repo.namespace} |
| 185 | 171 | | name={repo.name} |
| 186 | 172 | | // The files' own About says it there, as the one place. |
| 187 | | − | description={/^(code|tree)(\/|$)/.test(pathname.slice(base.length + 1)) ? null : description} |
| 173 | + | description={filesPage ? null : description} |
| 188 | 174 | | /> |
| 189 | | − | <Topics topics={repo.topics} /> |
| 175 | + | {/* On the files' pages, About shows them. */} |
| 176 | + | {!filesPage && <Topics topics={repo.topics} />} |
| 190 | 177 | | {tabs && ( |
| 191 | 178 | | <div className="mt-3"> |
| 192 | 179 | | <PageTabs base={base} tabs={tabs} /> |