TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

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

fair-rose

2/22/2025

Monorepo-examples and HMR

I'm new to monorepos and tried the router-monorepo-react-query-example. Is it possible to get HMR when changing the components in post-feature-package?...

sensitive-blue

2/21/2025

What happens here during code splitting?

I was showing my friends some of my code with Tanstack Start but did not know how to properly answer the following question. Take a look at this snippet ```const addSessionHistoryEntryFn = useMutation({...

fascinating-indigo

2/21/2025

Lookup dynamic route's metadata with route name?

Is there any way to take a dynamic route and lookup/retrieve associated metadata from the router?

fascinating-indigo

2/21/2025

Directory route.tsx that hides when visiting child route?

I'm attempting to do a mixed directory and flat structure but I can't see a clear way to have a route.tsx file (being the directory path) and having the ability to make non-nested routes. For example I would like route.tsx to be visible in the background of my /invite routes which render a modal but I would like the route.tsx to not be rendered when visiting /$userId. No matter what I do it seems route.tsx will render and if I change it to index.tsx then I don't get the content in the background...

useful-bronze

2/21/2025

Refreshing page gives error

When I navigate to some route by clicking the navigation bar, say to /some/route and then refresh the page, the page shows Cannot read properties of undefined (reading 'href') error. Could anyone please help? I'm in dev mode right now. TS router version 1.109.2 , vite version 6.0.5...

quickest-silver

2/20/2025

Nested layout for routes

Hey, everybody! I am trying to create the following authentication route structure and I need to add a generic layout that wraps the sign-in and sign-up routes. I have created a pathless route _layout.tsx, but it doesn't seem to work. I've read several threads about this, but haven't figured out how to properly define this layout. I'd be glad if anyone can help. Thanks!...

fascinating-indigo

2/20/2025

Programatically updating a searchParam

How can I programatically update a searchParam so that it re-runs the useSearch hook to update the value in the component? const { fooBarId } = useSearch({ from: '/foor/$barId/_layout' });...

helpful-purple

2/19/2025

Cookie based auth review.

Hi all! I just wanted to confirm if my "solution" works fines, break no rules etc. as it's really important for me. I don't want to make mistake that will cost me a lot in the future. If anyone like, please tell me if my approach is legit, alternatively leave your suggestions please! I'll be grateful. main.tsx: ```tsx const queryClient = new QueryClient();...

vicious-gold

2/19/2025

Setting Up Apple Pay Domain Verification Route in TanStack Start

I'm using TanStack Start, hosted on a VPS with Docker, and I'm trying to set up a route for Apple Pay verification on my staging URL (staging.xxx.ie).
I initially tried placing apple-developer-merchantid-domain-association.tsx inside a .well-known folder but then opted to use createRoute inside __root.tsx.
Current Code: ...

metropolitan-bronze

2/18/2025

You are calling ReactDOMClient.createRoot() ...

Hello, i have a simple setup. Basically i have /login, /admin and / paths When i start the navigation on / nothing happens, but as soon as i go back to "/" from any other page i get this error and it is driving me mad. ``` main.tsx:44 You are calling ReactDOMClient.createRoot() on a container that has already been passed to createRoot() before. Instead, call root.render() on the existing root instead if you want to update it....

extended-salmon

2/17/2025

Maximum update depth exceeded when redirecting

Hello I have this setup and every time I navigate to /profile I get the error even though the app doesnt crush and there's no problem I just wonder what's the correct way to achieve that redirect ``` export const profileRoute = createRoute({ getParentRoute: () => rootRoute,...

stormy-gold

2/15/2025

How to share a lazy-loaded route across multiple parent routes?

I have three journeys: ```ts const journey1 = createRoute({ getParentRoute: () => rootRoute, path: "/journey1" }); const journey2 = createRoute({ getParentRoute: () => rootRoute, path: "/journey2" });...

helpful-purple

2/15/2025

Nested Dynamic routes

Hi! It's probably my fault, but I can't find a solution! So my problem is that I have following structure: ``` - posts - index.tsx...

absent-sapphire

2/15/2025

Disable ViewTransition in specific routes

with defaultViewReansition set to true globally is there a wa y to opt out in certain pages , in my case it's trigerring every time i change the search query tracking which tab is the current one and it's less than ideal

fair-rose

2/15/2025

help refactoring context with useEffect into layout `beforeload`?

I'm trying to integreate openauth into a router project, and have been at this on and off for a week or so now. i've come up with a solution, but it's suboptimal and involves setting/getting jotai stores outside of react which seems to be generally discouraged. basically there's this example i'm trying to roughly port. some of the things tripping me up, but here's my thought process, and would be deeply grateful to any willing to give some thoughts - there's a bunch of logic happening in a useEffect w/ no deps. this tells me that I would prefer to just pull this logic into a beforeload. i'll pull into __root because, for now, i want auth data accessible at all my pages. - ok, i pull the logic out, but now i need to set some values which, in the example, are state values. i'm not in a component anymore so i need a solution here -> use context to communicate btwn route loader and context...

like-gold

2/14/2025

Multiple layout in a route causes layout flash

Hi guys, in the below image is the file structure of my route. The issue is when i am on any route wrapped by _mainLayout trying to route to a route wrapped by _infoLayout, i always get a flash of _mainLayout before _infoLayout will show up. Any idea of how i can fix this will. be appropriated. Thanks...

flat-fuchsia

2/13/2025

MDX integration

Does anyone know how to integrate mdx with a tanstack router project? I want to have the flexibility to use markdown files and wrap them with a prose class. I am surprised I can't find any examples of this. Thanks for any ideas.

stormy-gold

2/13/2025

URLSearchParams encodes spaces as +, breaking useSearch

I'm doing: ``` const params = new URLSearchParams({ test: "a b: });...

conscious-sapphire

2/13/2025

How to show spinner when lazy route (js chunk) is being loaded?

Basically I want to have some some spinner when lazy route is being loaded. It is quite usefull for slow connections. Ideally to combine it with loader, so spinner will be shown util route and route data are both loaded. With lodable/component lib I achieved this with:

``jsx
const AsyncPage = loadable(
  props => pMinDelay(timeout(import(

lazy-load/pages/${props.path}.jsx`), 20000), 200),...

eastern-cyan

2/13/2025

Invalidate route without reseting scroll

In my page I have a button which programmatically invalidate the current route: ``` const handleDelete = async () => { const response = await mutation.mutate(data.id);...

Previous Next

Gaming

Programming

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs