42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
interface Props {
|
||
series?: string;
|
||
season?: number;
|
||
onNavigate: (target: "root" | "series") => void;
|
||
}
|
||
|
||
export function BreadcrumbNav({ series, season, onNavigate }: Props) {
|
||
return (
|
||
<nav className="flex items-center gap-1 px-1 py-2 text-sm">
|
||
<button
|
||
type="button"
|
||
className="text-zinc-400 hover:text-zinc-100 transition-colors"
|
||
onClick={() => onNavigate("root")}
|
||
>
|
||
Library
|
||
</button>
|
||
{series && (
|
||
<>
|
||
<span className="text-zinc-600">›</span>
|
||
{season != null ? (
|
||
<button
|
||
type="button"
|
||
className="text-zinc-400 hover:text-zinc-100 transition-colors"
|
||
onClick={() => onNavigate("series")}
|
||
>
|
||
{series}
|
||
</button>
|
||
) : (
|
||
<span className="text-zinc-100">{series}</span>
|
||
)}
|
||
</>
|
||
)}
|
||
{season != null && (
|
||
<>
|
||
<span className="text-zinc-600">›</span>
|
||
<span className="text-zinc-100">Season {season}</span>
|
||
</>
|
||
)}
|
||
</nav>
|
||
);
|
||
}
|