T
TanStack•4mo ago
other-emerald

Not Found Components not working as expected

Hey there, i need some help with my NotFoundComponents. Somehow every route renders only the default not found component. Instead of the parent NotFoundComponent. 
export const Route = createFileRoute("/_auth/_district-manager")({
  component: DistrictManagerLayout,
  validateSearch: (searchObj: DistrictManagerLayoutSearchParams) => {
    return searchObj;
  },
  loader: () => {
    queryLoader(QUERY_OPTIONS_DISTRICT_MANAGER_LAYOUT);
  },
  pendingComponent: DistrictManagerLayoutPending,
  notFoundComponent: DistrictManagerLayoutNotFound,
});
export const Route = createFileRoute("/_auth/_district-manager")({
  component: DistrictManagerLayout,
  validateSearch: (searchObj: DistrictManagerLayoutSearchParams) => {
    return searchObj;
  },
  loader: () => {
    queryLoader(QUERY_OPTIONS_DISTRICT_MANAGER_LAYOUT);
  },
  pendingComponent: DistrictManagerLayoutPending,
  notFoundComponent: DistrictManagerLayoutNotFound,
});
` this is my layout. I expect that the notFoundComponent will be rendered when i visite any subroute under the /district-manager/ path so e.g. district-manager/test should render the notFoundComponent of the layout right? Somehow the default notfound gets rendered even this is my router: 
 notFoundMode: "fuzzy",
  defaultNotFoundComponent: () => (
    <AppShell.Main>Not Found Default</AppShell.Main>
  ),
 notFoundMode: "fuzzy",
  defaultNotFoundComponent: () => (
    <AppShell.Main>Not Found Default</AppShell.Main>
  ),
`
0 Replies
No replies yetBe the first to reply to this messageJoin

Did you find this page helpful?