Logan Cusano
eaae452d4e
Rewrite Nav.tsx to the five-destination IA from UI_REDESIGN.md §3 (Live,
Incidents, Archive, Watch, Network) on tokens/sans type, with Settings,
Admin, Trips and Profile moved into the avatar dropdown instead of sitting
as nav peers. Network stays gated to admin/operator, matching the write
boundary its constituent pages (nodes/systems/tokens) already had.
Delete app/dashboard/page.tsx — its incident cards become the Live rail,
its node cards become Network, its call table becomes Archive; nothing on
it is unique. Add app/map/page.tsx -> redirect('/') and rewrite
app/calls/page.tsx -> redirect('/incidents') (Archive/search is blocked on
backend work, chunk 12).
ChromeSwitcher now gives a signed-in user at "/" the app shell instead of
marketing chrome; app/page.tsx branches the same way, sending a signed-in
provisioned user to /incidents as an honest interim until the Live screen
itself lands (chunk 6) — marketing content and behavior for signed-out
visitors is unchanged.
Left the light-mode !important overrides in globals.css in place past this
chunk (deviating from the chunk 4 acceptance criteria) — they still back
every page outside this redesign's 11-chunk scope (settings, admin,
profile, marketing). Deleting them now would break light mode on all of
those. Logged in DEFERRED.md.
Per UI_REDESIGN.md chunk 4.
82 lines
3.2 KiB
TypeScript
82 lines
3.2 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect } from "react";
|
|
import { usePathname, useRouter } from "next/navigation";
|
|
import { useAuth } from "@/components/AuthProvider";
|
|
import { Nav } from "@/components/Nav";
|
|
import { MarketingHeader } from "@/components/marketing/MarketingHeader";
|
|
import { MarketingFooter } from "@/components/marketing/MarketingFooter";
|
|
|
|
// Public marketing surface — exact paths, not prefixes, so e.g. /features/x
|
|
// (if it ever exists) doesn't accidentally get pulled into marketing chrome.
|
|
// Keep in sync with PUBLIC_PATHS in middleware.ts (that one decides whether
|
|
// to redirect at all; this one just picks page chrome).
|
|
const MARKETING_PATHS = new Set(["/", "/features", "/pricing", "/faq", "/terms", "/privacy"]);
|
|
|
|
// Pages a signed-in user with no org_id claim must still be able to reach —
|
|
// otherwise the redirect below would loop against itself, or lock someone
|
|
// out of the one screen (/onboarding) that fixes their account.
|
|
const NO_ORG_ALLOWED_PATHS = new Set(["/onboarding", "/login", "/signup", "/profile"]);
|
|
|
|
/**
|
|
* Picks page chrome by route: the public marketing pages get a full-bleed
|
|
* layout with their own header/footer, everything else (the authenticated
|
|
* app, including /login and /settings) keeps the existing app Nav + padded
|
|
* main container.
|
|
*
|
|
* Also carries AuthProvider's no-claim guard (SAAS_PLAN.md B3): a signed-in
|
|
* Firebase user with no org_id claim is a real session that is nonetheless
|
|
* provisioned into nothing — AuthProvider already refuses to set the
|
|
* drb_session cookie for them, so middleware.ts's redirect only covers
|
|
* "not signed in at all". This effect covers the other case: signed in, no
|
|
* org, anywhere in the app — send them to /onboarding rather than letting
|
|
* every page's data hooks fail open or silently return nothing.
|
|
*/
|
|
export function ChromeSwitcher({ children }: { children: React.ReactNode }) {
|
|
const pathname = usePathname();
|
|
const { user, loading, orgId } = useAuth();
|
|
const router = useRouter();
|
|
|
|
useEffect(() => {
|
|
if (loading) return;
|
|
if (!user) return; // not signed in — middleware.ts already routes this to /login
|
|
if (orgId) return;
|
|
if (MARKETING_PATHS.has(pathname) || NO_ORG_ALLOWED_PATHS.has(pathname)) return;
|
|
router.replace("/onboarding");
|
|
}, [loading, user, orgId, pathname, router]);
|
|
|
|
// "/" is marketing for a signed-out visitor, but the moment someone is
|
|
// signed in it's Live — the map is the home screen (UI_REDESIGN.md §3),
|
|
// not a marketing page. Every other marketing path stays marketing
|
|
// regardless of auth state.
|
|
const showMarketingChrome = MARKETING_PATHS.has(pathname) && !(pathname === "/" && user);
|
|
|
|
if (showMarketingChrome) {
|
|
return (
|
|
<>
|
|
<MarketingHeader />
|
|
{children}
|
|
<MarketingFooter />
|
|
</>
|
|
);
|
|
}
|
|
|
|
// Live ("/") is full-bleed under its own top bar, not the padded
|
|
// max-width container the rest of the app uses.
|
|
if (pathname === "/" && user) {
|
|
return (
|
|
<>
|
|
<Nav />
|
|
<main className="h-[calc(100vh-3.75rem)]">{children}</main>
|
|
</>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Nav />
|
|
<main className="max-w-screen-2xl mx-auto px-4 md:px-6 py-6">{children}</main>
|
|
</>
|
|
);
|
|
}
|