limber dragon
I have a route _authenticated.my-files.$.tsx which I want to catch /my-files, /my-files/folder, /my-files/any/folder-depth, and this works, however, when I go to /my-files/this/folder/does/not/exist, I make sure I throw the result of notFound() inside of the loader function of the Route which calls the notFound handler, and in this handler I want to return the user to the root path of the splat route which is /my-files, but I can't seem to do that without TS complaining.
If I try to navigate the user to /my-files/$ which is what TS want me to do, then the URL doesn't change. Will I have to split my route into a route only for /my-files and then a catch all route for everything under /my-files?
export const Route = createFileRoute("/_authenticated/my-files/$")({
component: RouteComponent,
validateSearch: zodValidator(searchParamsSchema),
search: {
middlewares: [stripSearchParams(defaultSearchParams)],
},
pendingMinMs: 0,
loaderDeps(opts) {
return [opts.search];
},
loader(ctx) {
const path = ctx.params._splat;
return ctx.context.queryClient.ensureQueryData(
getQueryOptions({ path: path, search: ctx.deps[0] }),
);
},
notFoundComponent() {
return <Navigate to="/my-files" replace />;
},
});
hushed ridge
