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

continuing-cyan

7/10/2024

Handle 404 from a component query

I am using '@tanstack/react-query' and '@tanstack/react-router'. I have a component that is a child in my __root.tsx that queries the api. When it works, it works, but I am having trouble in the context of this file based router to figure out what to do when it 404s. This one data fetch in turn runs the entire ui and every query afterwards, so the ui won't work if that one request fails. Ideally I'd like to just display an error component, or reroute to one in the

if (isError) {...}

if (isError) {...}

section of that component, but I don't know what would be proper protocol here. I had...

conscious-sapphire

7/10/2024

type inferred incorrect on getRouteApi or useSearch({ from: '/some/route/path' })

searchParams2 and searchParams3 both has a empty object type inferred unioned with the correct type. How to make sure the searchParams2/searchParams3 can get the correct typed object from search schema?...

fascinating-indigo

7/9/2024

Meta works on lazy routes despite TS screaming

Why does the Meta property work on the lazy route despite Typescript saying it doesn't exist? Are there any issues with using the Meta prop on the lazy route and ignoring the type error?...

flat-fuchsia

7/9/2024

Two routes one page (optional parameter)

is there a way to have query like this whatever/ID/SECOND_ID where they both point to the same page but the SECOND_ID is optional? So even if you just put whatever/1 instead of whatever/1/2 it still match the same page

metropolitan-bronze

7/8/2024

Using the basic code-based route example in electron forge app gives a blank page

rival-black

7/8/2024

Validate Search different output and input types?

I used to have the following setup: ```ts const route = { path: '/zzz'...

vicious-gold

7/6/2024

Flash of unstyled content

Browsing through the docs on my phone, refreshing by pulling down from the top (iOS safari) shows FOUC. Since you guys are dogfooding Start on tanstack.com, could this be an issue? Solid has a similar issue caused with Vinxi from what I’ve read but the issue only existed in dev environments....

inland-turquoise

7/5/2024

Type validating arbitrary strings against router types

Hello, When I have a user sign in, I send them to third party url to login. I am storing the current path in local storage then when they are redirected back I am reading the path and redirecting in the beforeLoad API. What interface should I be using from tanstack/router to appropriately zod validate that a string satisfies my route types? Thank you!...

extended-yellow

7/4/2024

Role base URL protection

Hi I'm new on tanstack/router and i'm just wondering is there any way to close access of some URL depending on User role on File-Based-Routing for example: normal user role can not access the url of /dashboard...

absent-sapphire

7/3/2024

Custom 404 does not appear in my main-layout

I am quite a bit confused on how to get a custom 404 page to display the header and footer that are in my main-layout.tsx. I am able to get a custom 404 to work by adding a notFoundComponent to the __root OR to the router const in main.tsx. However, those do not have my main-layout. Any ideas?

continuing-cyan

7/3/2024

Best practice for redirecting after a fetch

Hi everyone, I'm working on a routing setup and need some guidance on the best way to handle a redirect after fetching data. Here's my scenario: 1. I have two routes: /users and /users/$userId...

national-gold

7/3/2024

Isn't the Tanstack Router in React not supporting Hot Module Replacement (HMR)?

I have an issue with the TanStack Router in my React application. The hot module replacement (HMR) functionality does not appear to be working as expected.

xenial-black

7/2/2024

Link active prop with param

Hello I have a problem with activeProps prop in Link component and a route with a param. I have implemented a TabsRoute component. I have a sidebar with all the routes for example: ```ts export const SIDEBAR_ITEMS: SidebarItem[] = [ {...

like-gold

7/1/2024

Not able to build start app

``` [6:37:23 PM] ERROR [tsr-routes-manifest] Could not load tsr:routes-manifest (imported by nodemodules/.pnpm/@tanstack+start@1.43.4@opentelemetry+api@1.9.0_@types+node@20.14.9drizzle-orm@0.31.2@cloud_c3xbxkqqwnxdaj4km4r37i5kie/node_modules/@tanstack/start/dist/esm/router-manifest/index.js): Cannot read properties of undefined (reading 'map') at Object.load (/testapp/nodemodules/.pnpm/@tanstack+start@1.43.4@opentelemetry+api@1.9.0_@types+node@20.14.9drizzle-orm@0.31.2@cloud_c3xbxkqqwnxdaj4km4r37i5kie/node_modules/@tanstack/start/dist/esm/config/index.js:284:46) at async PluginDriver.hookFirstAndGetPlugin (/testapp/node_modules/.pnpm/rollup@4.18.0/node_modules/rollup/dist/es/shared/node-entry.js:19674:28)...

flat-fuchsia

7/1/2024

Infer routes type to a custom component

I'm making a custom component that have a Link inside, I would like to pass the to route via props to the component, is there a type to get all the available routes in the same way the to prop of the Link does? ``` <Link to="/settings">Back</Link> ...

graceful-blue

6/29/2024

dependant queries router loading

https://github.com/TanStack/router/discussions/922 is there any solution to this?...

conscious-sapphire

6/28/2024

Get Search Params from Localstorage before loading a page

Hello, I'd like to save last used search params in localstorage and re-set them when user go to this page again. I need it beacause it's admin panel and there're a lot of filters. Is it possible to get this data from localstorage and set proper params?

optimistic-gold

6/27/2024

How can I use "loader" with "createLazyFileRoute"?

I have this lazy route and I'm not sure how to use the loader function: ``` export const Route = createLazyFileRoute("/(customers)/customers")({ loader: async ({ context: { queryClient } }) => {...

unwilling-turquoise

6/27/2024

Router with multiple apps on same page (micro-frontends)

Hi, We have a page with multiple micro-frontends and would like to have: - the main/container page to manage the routing - the micro-frontends/apps to be able to listen and update search parameters to maintain their state...

correct-apricot

6/27/2024

Example repo with vite, react, tanstack router and an api in express js

Anyone come across a good example repo to get me going quickly?

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