Files
wehub-resource-sync e4dcfc49aa
Tests / Import Check (Python 3.13) (push) Has been cancelled
Tests / Import Check (Python 3.14) (push) Has been cancelled
Tests / Python Tests (Python 3.11) (push) Has been cancelled
Tests / Python Tests (Python 3.12) (push) Has been cancelled
Tests / Python Tests (Python 3.14) (push) Has been cancelled
Tests / Test Summary (push) Has been cancelled
Tests / Lint and Format (push) Has been cancelled
Tests / Web Node Tests (push) Has been cancelled
Tests / Import Check (Python 3.11) (push) Has been cancelled
Tests / Import Check (Python 3.12) (push) Has been cancelled
Tests / Python Tests (Python 3.13) (push) Has been cancelled
chore: import upstream snapshot with attribution
2026-07-13 13:00:43 +08:00

67 lines
2.0 KiB
TypeScript

"use client";
import Link from "next/link";
import { usePathname } from "next/navigation";
import { ArrowLeft } from "lucide-react";
import { useTranslation } from "react-i18next";
// Sections that own their full height + scroll (Mastery Path's list/detail
// console). They must NOT be squeezed into the centered, padded document
// container the list-style sections use.
const FULL_BLEED = ["/space/learning"];
function isFullBleed(pathname: string): boolean {
return FULL_BLEED.some((p) => pathname === p || pathname.startsWith(`${p}/`));
}
// Hub-and-spoke: the dashboard at `/space` is the only navigator. Once inside a
// section we don't re-list every sibling on a rail — a single "back to the hub"
// link keeps the section focused and sends you to the overview to switch.
function BackToHub() {
const { t } = useTranslation();
return (
<Link
href="/space"
className="group inline-flex items-center gap-1.5 text-[13px] text-[var(--muted-foreground)] transition-colors hover:text-[var(--foreground)]"
>
<ArrowLeft
size={15}
strokeWidth={1.8}
className="transition-transform group-hover:-translate-x-0.5"
/>
{t("Learning Space")}
</Link>
);
}
export default function SpaceMain({
children,
}: Readonly<{ children: React.ReactNode }>) {
const pathname = usePathname() ?? "";
const isDashboard = pathname === "/space";
if (isFullBleed(pathname)) {
return (
<div className="flex h-full min-h-0 flex-col bg-[var(--background)]">
<div className="shrink-0 border-b border-[var(--border)] px-5 py-2.5">
<BackToHub />
</div>
<div className="min-h-0 flex-1 overflow-hidden">{children}</div>
</div>
);
}
return (
<div className="h-full overflow-y-auto bg-[var(--background)] [scrollbar-gutter:stable]">
<div className="mx-auto max-w-5xl px-8 py-8 pb-12">
{!isDashboard && (
<div className="mb-5">
<BackToHub />
</div>
)}
{children}
</div>
</div>
);
}