configureNavigation
Replaces what notFound, redirect and unauthorized throw. A framework adapter calls it once; theme code never needs to.
import { configureNavigation } from '@salla.sa/twilight-theme-engine/providers';In plain words
The loader helpers must throw whatever the router in use understands. A framework adapter calls configureNavigation() once to swap in its own versions, and the TanStack adapter does so as soon as @salla.sa/twilight-theme-engine/tanstack is imported.
It is exported for new adapters and for tests.
Signature
function configureNavigation(config: {
notFound?: (message?: string) => never;
redirect?: (path: string, opts?: { replace?: boolean }) => never;
unauthorized?: (message?: string) => never;
}): void // only the functions you pass are replacedExample
import {
configureNavigation,
UnauthorizedError,
} from '@salla.sa/twilight-theme-engine/providers';
import { notFound, redirect } from '@tanstack/react-router';
configureNavigation({
notFound: (message) => {
throw notFound({ data: message });
},
redirect: (path, opts) => {
throw redirect({ to: path, replace: opts?.replace });
},
unauthorized: (message) => {
throw new UnauthorizedError(message);
},
});
How it behaves
The helpers are exported
letbindings, and ES module imports are live: every module that importednotFoundsees the replacement. A copy stored in a variable before the call keeps the old function.It is global. Every loader in the app, the engine's own included, uses the last configuration, on the server and in the browser.
orThrowis unaffected: it throwsNotFoundErroritself.
Gotchas
Calling it from theme code changes the engine's own loaders too (product, account, blog…), which expect the TanStack behaviour. Leave it to the adapter.
Related
Throw helpers for route loaders: stop and show the not-found page, send the visitor to another address, or refuse a guest.
NotFoundError, RedirectError, UnauthorizedErrorThe error classes behind the loader helpers, so an error screen can tell a missing page, a redirect and a refused guest apart.
Source and docs
- Engine source:
packages/theme-engine/src/providers/NavigationProvider.ts