Improve breadcrumb with binary name and inline version switcher

- Show binary basename in breadcrumb after iOS version
- Move version switcher inline with OS name
- Remove separate Binary Detail/Search Results labels
This commit is contained in:
cc
2026-04-14 19:58:10 +02:00
parent a6f90462a5
commit 9e171642ad
+17 -11
View File
@@ -24,6 +24,8 @@ export default function OSDetailLayout({
const params = useSearchParams(); const params = useSearchParams();
const pathname = usePathname(); const pathname = usePathname();
const os = params.get("os") || ""; const os = params.get("os") || "";
const binaryPath = params.get("path") || "";
const binaryName = binaryPath ? binaryPath.split("/").pop() : "";
const currentPage = pathname.includes("/files") const currentPage = pathname.includes("/files")
? "files" ? "files"
@@ -40,7 +42,7 @@ export default function OSDetailLayout({
return ( return (
<div className="flex flex-col flex-1 min-h-0 p-4 md:p-6" suppressHydrationWarning> <div className="flex flex-col flex-1 min-h-0 p-4 md:p-6" suppressHydrationWarning>
<header className="flex flex-col sm:flex-row sm:items-center gap-2 mb-4 shrink-0"> <header className="flex flex-col sm:flex-row sm:items-center gap-2 mb-4 shrink-0">
<div className="flex items-center gap-4"> <div className="flex items-center">
<Breadcrumb> <Breadcrumb>
<BreadcrumbList> <BreadcrumbList>
<BreadcrumbItem> <BreadcrumbItem>
@@ -48,13 +50,23 @@ export default function OSDetailLayout({
</BreadcrumbItem> </BreadcrumbItem>
<BreadcrumbSeparator /> <BreadcrumbSeparator />
<BreadcrumbItem> <BreadcrumbItem>
<span className="text-muted-foreground"> <div className="flex items-center gap-2">
{os?.split("/")[0]} <span className="text-muted-foreground">{os?.split("/")[0]}</span>
</span> <VersionSwitcher currentOs={os} />
</div>
</BreadcrumbItem> </BreadcrumbItem>
{currentPage === "bin" && binaryName && (
<>
<BreadcrumbSeparator />
<BreadcrumbItem>
<span className="text-foreground font-medium">
{binaryName}
</span>
</BreadcrumbItem>
</>
)}
</BreadcrumbList> </BreadcrumbList>
</Breadcrumb> </Breadcrumb>
<VersionSwitcher currentOs={os} />
</div> </div>
<nav className="flex items-center gap-4 text-sm sm:ml-auto"> <nav className="flex items-center gap-4 text-sm sm:ml-auto">
@@ -70,12 +82,6 @@ export default function OSDetailLayout({
> >
Browse Files Browse Files
</Link> </Link>
{currentPage === "find" && (
<span className="font-medium">Search Results</span>
)}
{currentPage === "bin" && (
<span className="font-medium">Binary Detail</span>
)}
</nav> </nav>
</header> </header>