react-query-questions
solid-query-questions
table-questions
virtual-questions
router-questions
react-charts-questions
ranger-questions
vue-query-questions
svelte-query-questions
bling-questions
form-questions
angular-query-questions
start-questions
db-questions
start-showcase
router-showcase
📣-announcements
NotFound Error bubbling
I'm finding it really confusing trying to get the error behaviour I'd like. I'd essentially like a unmatched route to fall back to its closest error handler. Most of the time I want to use the base 404 error page like
notFoundMode: 'root' provides. However I'd like to for certain routes handle not found differently. Say someone went to /posts/5 I want to be able to specify an error page on the /posts and have it handle the error in its outlet. For all other outlets though, unless specified it should fall back to the main error handler.
I've no idea where I'm going wrong, I feel like I've tried just about everything but I guess I'm not understanding how error handling works....createFileRoute removed on save
Trying to migrate from Next.js, running the alpha. Running into two issues with file based routing:
1. No
createFileRoute being inserted in existing files
2. With new files, createFileRoute is added, but when saving the createFileRoute import is removed
...api routes in solid start
Hi, is it possible to create an api route in solid start with tanstack router? when i add api folder with firebase-handler.ts i get populated with import { createFileRoute } from '@tanstack/solid-router'
export const Route = createFileRoute('/api/firebase-handler')({
component: RouteComponent,
})...
Query State issues
Error: "Maximum update depth exceeded" when clicking the Select dropdown in TanStack Router. Works fine in React Router using nuqs. How to properly update search params without infinite re-renders?
```tsx
// Route component
const searchSchema = z.object({...
Smooth Route Transitions in TanStack Router
Hey everyone! I'm working on a chat application with TanStack Router and struggling with achieving smooth transitions between routes without unwanted remounting. Here's my situation:
Current Route Structure:
```
typescript// Three main routes:
/(app)/chat/ // Chat index/landing page...
Scroll to top behaviour in a shadow DOM
Hello 👋
I am trying to make the
scrollToTopSelectors router option work in my app but without success.
I tracked it down the fact that my selector points to an element that is inside a shadow DOM (because we are using a micro-frontend architecture and the micro-frontend is responsible for the scroll), thus document.querySelector resolves to null (code)...Understanding context selector performance impact
Hi! I'm debugging some performance issues and I'd like to understand why A performs worse than B?
```ts
// A. use selector
const { queryOptions } = Route.useRouteContext({
select: (context) => ({...
Trying to use ValidateLinkOptions in a dynamic menu structure is proving difficult - any tips?
I'm trying to create a dynamic menu in an array like this:
```[
{
label: __("Events"),
icon: IconEvents,...
how to run something before content is shown?
Is there a way to run some code that can throw a redirect before a page is shown?
I tried with the beforeload but its triggering on hover, i need when entering the page (before effects in page run) to trigger a redirect in some scenarios, is that possible?
i also tried onEnter but it executes before the effects, i need something like a beforeEnter i think...
How to develop with https in localhost in tanstack/start ?
im using the vite ssl plugin, but im getting this error, not sure it is the correct way
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,...
Translating Routes
is it possible to translate the routes in filebased routing?
I have a /search route which should be /suche when the user selects that he is german....
Native scroll by hash with hash router
Is there any intended way to have the native behavior of scrolling to a DOM element matching a given id in the URL hash, using TSR hash router?
I need that for an Electron app, so I am forced not to use the standard default browser router, but I am open to any other solution which works in Electron.
Thanks in advance ^_^...
How do stop pre-fetch ALL components?
When accessing http://localhost:3000/ and inspecting the network tab in dev tools, there are a lot of requests all the js file
For example,
```
http://localhost:3000/js/components/category/CategoryView.jsx
http://localhost:3000/js/components/cms/banner/routes.ts...
Buffer is not defined - from scroll restoration code
Hi, Im updating my TS Router version from 1.16.0 to latest and I'm running into the following issue:
When I run my app, I get the following error:
```
jsesc.js:33 Uncaught ReferenceError: Buffer is not defined...
Restoring Search Params
We have a big data table that has filters that we drive from search params.
We want to restore those search params any time the users returns to the default router.
Example flow
...
Type issue in the search params of the Link component
Hello, I have a question about the search param type. The search param keys are inferred in <Link /> props, but the values are always "unknown." Is there a reason for this? Or did I do something wrong?
Suspense around Outlets
I am using Apollo Client with Tanstack Router. I have wrapped an
<Outlet /> in a <Suspense> and I am using useReadQuery to receive preloaded data from the loader I would assume this would trigger the Suspense fallback based on this line from the Apollo documenation
The preload function returns a queryRef that is passed to useReadQuery to read the query data and suspend the component while loading.
Here is my example code
...Head data loading => What about streaming head data using deferred external data
Hello,
I have a dynamic route to load a post, and I would like to know if it is possible to use data that is loaded in the loader to integrate them in the head?
For example, I'd like to be able to define the title and canonical URLs in the head using dynamically loaded data.
...
Recommended way to deal with version skew
We have global state within our application, so when a new version is released, we don't want to perform a hard reload when navigated to a chunk that hasn't been loaded.
One thought I had was to use the router.loadRouteChunk, iterating over every route when the page has loaded. Gets us the quick initial page loaded, but then guarantees the application has all the JS it needs...