188 questions
-1
votes
0
answers
34
views
Best way to aggregate data of subrows? [closed]
The Tanstack ExpandedRowModel allows the creation of SubRows, these can be retrieved using the subrows property. How would one aggregate specific data in those subrows, especially if the subrows ...
- 119
0
votes
0
answers
91
views
create-tsrouter-app@latest not working ERROR
I want to create new project using
npx create-tsrouter-app@latest
I keep getting this issue. The error always error code ECOMPROMISED and error Lock compromised. I even tried using npm create, but ...
- 1,692
2
votes
1
answer
82
views
How to keep scroll position stable when loading messages on top?
I’m building a chat UI in Next.js (App Router) and struggling with maintaining the scroll position when fetching older messages at the top.
I’m using:
@tanstack/react-virtual for virtualization
...
- 327
0
votes
1
answer
352
views
Trying to dockerize TanStack application
I am following hosting docs for TanStack Start with Nitro hosting in order to dockerize the app.
So, in the docs there is instrution to get nitro-nightly package
npm i nitro-nightly
After that, code ...
- 41.2k
-1
votes
1
answer
418
views
What is the use case for TanStack Start useServerFn hook
I am currently exploring TanStack Start (with React).
At What are Server Functions? page we have example of server function that can be used with useQuery (from TanStack Query, to fetch data from ...
- 41.2k
0
votes
1
answer
88
views
How can I have a delay until useQuery/refetch have returned the data
I am developping an iOs/Android App with React Narive.
I am using useQuery (TanStack Query v5) to send the username and an hashed password to my database and it return the user ID if the email/...
- 11
0
votes
0
answers
70
views
Tantsack Virtualized Dynamic Height Rows
I have been trying to create a dynamic grid using tanstack virtualized rows (the number of columns being tied to window width)
The issue is that my rows expand in height due to window resize, but my ...
- 1,119
0
votes
1
answer
148
views
TanStack Query useMutation is not return isSuccess true after success response
I have an authentication system. calling Api's using tanstack query.
When logging in, signing up, and verifying email using the link, everything works fine. However, when I check the mutation's ...
0
votes
2
answers
439
views
TanStack query - Invalidate queries not working with retry
I have a setup using the queryClient's defaultOptions.
The queries are set to always retry up to three times, and the mutations are set to retry on a specific error.
This works in most cases as ...
- 155
0
votes
1
answer
1k
views
Tanstack form field level errors behaving very weirdly
So I have a simple register form with 5 fields
Email, Username, Password, Confirm Password and Accept T&C. I am doing validation at form level for the following
if (!value.username) return "...
-1
votes
1
answer
129
views
Why doesn't invalidateQueries accept the full query key from trpc.router.endpoint.queryKey()?
I'm using tRPC with React Query and trying to invalidate a specific query using the full query key generated by trpc.
Here's what I'm doing:
const likeFullKey = trpc.like.getLikesByUser.queryKey();
...
2
votes
2
answers
597
views
How do you change the port for a TanStack Start app?
I would like to update the port that my app is running on but the TanStack Start [defineConfig][1] method doesn't seem to expose that like a normal Vite config does. Here is my app.config.ts:
import { ...
- 18.8k
1
vote
0
answers
262
views
How to Implement Virtualization with Sticky Header and Sidebar Using @tanstack/react-virtual?
I am using @tanstack/react-virtual (useVirtualizer) to optimize rendering for a large dataset. My data consists of reports for 200 employees over 365 days, displayed in a CSS Grid.
Requirements:
...
- 41
0
votes
0
answers
88
views
How to create an advance filter using NextJS Tanstack, and Prisma?
I'm having a hard time on how can I create an advance filter function using Tanstack Query, Next JS and Prisma. The main problem I'm encountering right now is how can I pass the query properly to my ...
- 795
0
votes
0
answers
45
views
"Error: No QueryClient set" when using TanStack Query in a component package across repositories in Next.js
I have a Next.js application (main-app) that imports and uses UI components (widgets) and API hooks from a separate repository (abc-widgets).
These widgets internally use API hooks that rely on ...
0
votes
1
answer
137
views
zustand hook is called inside cell table tanstack
I am trying to call hooks I created with zustand to one of the cells of tanstack table, during building, eslint throws an error
Error: React Hook "useCartStore" is called in function "...
0
votes
1
answer
1k
views
Is there a way to construct a route path as string in Tanstack Router?
Question
I'm using Tanstack Router and Tanstack Start and I'm wondering if there's a way to do something like:
const path = buildPath({ to: "/$lang/posts/$id", params: { lang, id }});
so ...
- 76.5k
0
votes
0
answers
36
views
Handling an Editable Table with react-virtual for 5000+ Rows
I'm working with a large dataset (5000+ rows) in a React application and want to use react-virtual to optimize performance. However, the table also needs to be editable without causing lag while ...
2
votes
1
answer
291
views
Large React Aria Components dropdown with virtualized rows
I need to implement a dropdown with react-aria-components but one of the use cases has a large amount of instances, provoking a very slow experience. For that reason, I want to use a row ...
- 1,647
1
vote
1
answer
2k
views
Dynamic nested routes using TanStack Router
How would I set up file-based routing with tanstack router so that I could have these three different routes:
/{year} routes to YearViewComponent
/{year}/{month} routes to MonthViewComponent
/{year}/{...
- 4,053
0
votes
1
answer
2k
views
Tanstack Router Link with search params where one key has multiple values
I'd like to provide a search property to my Link component where they query string key can have multiple values (an array)
<Link to="/foo/bar" search={{group_by: ['foo', 'bar']}} ...>
...
- 1,030
0
votes
0
answers
78
views
Angular Tanstack Cached Observables are refreshing data and not using the cache causing problems
I'll keep it short as possible ><
-I have a left hand menu with items that can be expanded/collapsed. This is dependent on "getAll()" and works as expected.
-When I incorporated "...
- 195
1
vote
0
answers
465
views
TanStack Table - sticky column not working - Radix UI
I’m having issues getting the first column of my table to be sticky. I think I’m missing some CSS that sets the container of the scroll area to 100vw, but even after setting it, I still don't get my ...
- 79
0
votes
1
answer
203
views
tanstack sorting arrow function call onClick not working but when calling directly on onClick , its works , why?
This doesn't work:
onClick={() => {
header.column.getToggleSortingHandler();
}}
However if I invoke it like this then it works - why?
onClick={
header.column.getToggleSortingHandler()
}
I was ...
- 21
1
vote
1
answer
274
views
How to disable row click for one column in material react table?
I have enabled row click functionality in a Material React Table to redirect users to a details page. I also want to implement a switch component to enable or disable the user. However, when I click ...
