Replace App's page-render ternary and the three side-rail page conditionals with a data-driven lookup: components/moduleRegistry maps each page to a prop-free content component (+ optional side rail + shell fadeTop), and App renders PAGE_CONTENT[page]/PAGE_RAIL[page] gated by moduleDef(page).gate (an unreachable gated page falls back to the feed, as the old ternary did). Content modules and the two rails are now prop-free: they read `me` via the new useMe() hook and their module-local state from the scoped providers; FeedPage/MessagesPage are the only wrappers (they wire the global feed scope / meId). App.tsx 796->431 lines, zero `page===X` chrome conditionals — closes the Platform epic DoD. (Platform S6b.3)
14 lines
771 B
TypeScript
14 lines
771 B
TypeScript
import { useQuery } from "@tanstack/react-query";
|
|
import { api, type Me } from "./api";
|
|
|
|
// The signed-in account, read from the ["me"] query cache. App owns the FETCHING query (gated on
|
|
// setup state) and renders modules only once it has resolved to a real user — so anywhere inside the
|
|
// authenticated module tree the cache is always populated. `enabled:false` makes this a passive
|
|
// observer (no second fetch, which could 503 in setup mode) that still re-renders when the cache
|
|
// updates (login, the 60s refetch, a Google-link round-trip). Lets modules read `me` from a hook
|
|
// instead of having it prop-drilled through App.
|
|
export function useMe(): Me {
|
|
const { data } = useQuery({ queryKey: ["me"], queryFn: api.me, enabled: false });
|
|
return data as Me;
|
|
}
|