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

correct-apricot

1/2/2025

Dynamic Route Generation with TanStack Router for External Components

Question:
I aim to create a component that can be imported as a package and included in a route, which will then generate its own nested routes. For instance, when adding an editor component, it should automatically support the paths it comes with. Here is my typical setup using React Router: ...

generous-apricot

1/2/2025

Why does my form default value not re-render?

```js export const Route = createFileRoute('/product-backlog/task/edit/$taskID')({ component: EditTask, loader: ({ params }) => { return fetchTask(params.taskID)...

fascinating-indigo

1/2/2025

How can I design typesafe callback urls?

I currently have this pattern for my auth routes: ``` const schema = z.object({ callbackUrl: z.string().optional(), });...

useful-bronze

1/1/2025

How to handle authentication (get session data)

My knowledge on this has atrophied. 😩 With NextJS I'm so used to having async as the default. Now that I'm with Tanstack Router this isn't the case (as of now). I'm struggling how to use ```...

exotic-emerald

1/1/2025

Has anyone gotten TanStack Router/Start to work on Cloudflare Worker with bindings (NOT PAGES)

Cloudflare pages will be merging to workers, so want to know if this is something we can accomplish today

eager-peach

12/31/2024

Nested layouts work in flat but not directory based syntax

so i have routes like this that work fine: ``` src/ ├── routes/...

optimistic-gold

12/31/2024

Vitest renders App but not the Outlet content for "/"

Can somebody point me in the right direction here? Experimenting with TanStack Router and Unit Tests for UI. Works partially but does not render Outlet for the "/" Route. ...

foreign-sapphire

12/30/2024

Link + Pagination + Search Prop + Shadcn/UI

Hey there, I'm trying to build the pagination for my app and I struggle more than I should. 😅 I use the pagination components from Shadcn/UI and I replaced the a element from PaginationLink with Link from @tanstack/react-router....

extended-salmon

12/29/2024

advice on filesystem routing

is there a way to achieve this posts structure from the docs without having both a directory named posts and a posts.tsx ideally I could have something like posts/ with a layout.tsx and then also index.tsx and $postId.tsx. not having everything post-related contained within the posts directory itslef feels confusing to me.

extended-salmon

12/29/2024

Redirect from NotFound component

Hey ! Use redirect from root not-found component causes unhandled error. How to redirect from not-found page without using window.location ? ...

correct-apricot

12/29/2024

Multiple path params?

I'm having trouble with multiple path params. I have a wiki structure, e.g. ``` handbook.tsx handbook.$slug.tsx...

helpful-purple

12/27/2024

Using Tanstack Router with WebSockets

Hey, I'm making a webapp (SPA) with React and WebSockets. I want to have access to my socket in any part of the application, I thought about using a singleton approach and instantiate it in the main.tsx. However, I would like to still be able to use the tanstack redirect methods. So what would be the best way to implement something like that?

multiple-amethyst

12/26/2024

I'm having issue where useLoaderData returns undefined during SSR (Start)

I'm using TanStack Start and having issue that useLoaderData returns undefined during SSR. It works during client-side or soft navigation. But if I reload that same page, useLoaderData returns undefined.

genetic-orange

12/26/2024

Is naming files *.lazy.tsx for pages required for lazy loading ?

Just a quick question, as the intro quick start seems to suggest you should.

extended-salmon

12/24/2024

Having two similar views in the same app

What is the best way to structure the routes in a react app using tanstack router to have two different views, they both sometimes use the same components and also have unique ones

exotic-emerald

12/24/2024

An array of filter with same name. ?category=4&category=3

I am migrating a nextjs app. The nextjs app has a category filter array. How do I do this in tanstack router?

optimistic-gold

12/23/2024

Display Error when Error in context RouteOption?

In a createFileRoute() I have, I'm loading data from localstorage and putting the result in my route's context. How would I gracefully handle when the data in localstorage was corrupted and unparsable as JSON? Right now, my code throws a runtime error and my react app doesn't render. What I'd like to happen is the errorComponent be rendered. ```typescript xport const Route = createFileRoute("/$sessionId/_wizard")({ component: RouteComponent,...

metropolitan-bronze

12/23/2024

Unexpected Behavior with Unused Server Function in TanStack Start

Hi everyone! I’m facing an issue where an unused function is causing my application to misbehave. Specifically, when I include the following authenticateUserWithoutAPI function in my code, even if I don’t call it in any beforeLoad or other route handlers, it causes problems like: 1. The Clerk sign-in component not rendering. 2. The TanStack Router dev tools disappearing....

genetic-orange

12/21/2024

Yup adapter

Is there an existing adapter so that search params validation in tanstack router can be handled by yup schemas? At work we're pretty bought in on yup (and its integration with formik), and I don't see us switching soon (even though it's definitely on my roadmap!). If there is none, I will have to write it, so I guess my secondary question is: is there interest for this to be open source? Or even integrated to the tanstack org once we have it working?...

absent-sapphire

12/20/2024

Authentication

Hello everyone How I can handle authentication using Tanstack Router? Is possible to redirect to the login page when axios return a status code 401 and redirect to dashboard when access login and already have a httponly cookie with authentication token?...

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