All Questions
Tagged with react-query next.js
240
questions
0
votes
0
answers
14
views
Why does React handle a 401 error at updateDehydratedSuspenseComponent?
Problem
In the Developer Tools Network tab, all requests are 2xx success.
I can get Valid data from server
But, 401 error occurs.(this api is not mocked api.)
react-dom.development.js:17497 ...
1
vote
1
answer
16
views
useQueries loses the ability to query data in parallel because Next.js requires server component to be async
The app is running by Next.js.
I have a useQueries hook:
const userQueries = useQueries({
queries: user.contacts.map((contactId: string) => ({
queryKey: ['contact', ...
0
votes
0
answers
25
views
React-query sometimes render with no uses value and i don't know why
I try to make infinite scroll. And i found out sometime react query fetch twice. for example, it should fetch only second page, but some time fetch second and third pages. (I'll call this a bug in the ...
0
votes
0
answers
36
views
⨯ TypeError: react__WEBPACK_IMPORTED_MODULE_2__.useContext is not a function
I am working on a Next.js project where I am using TRPC and React Query for data fetching. However, I am encountering a TypeError: useContext is not a function error. Here is my setup:
TRPC Client ...
1
vote
0
answers
30
views
How to build an isomorphic API client with dynamic headers in next js?
I have a next js application with a separate API. All API endpoints require a specific X-HOST request header. I want to prefetch requests on the server side and sometimes invalidate them on the client ...
0
votes
0
answers
30
views
Why do I get empty array at first render and then click other date before the data shows?
I'm having a little bit of problem on rendering the initial data for the current date, in my system I have a calendar wherein the first thing it will select is the current date, and it should show the ...
0
votes
0
answers
15
views
NextJS Server Component Data Mutation
'use server';
import TirestockComponent from '@components/TirestockComponent';
import { fetchTirestock } from '@nextapi/fetchTirestock';
export default async function UsedTirestock() {
const ...
0
votes
0
answers
20
views
Getting an empty object in data for updates
Im working on updating a document in my mongodb, the document has a field, which is an object that has other fields attached to it, I have 1 field i want to update, the others should stay the same, ...
0
votes
0
answers
43
views
How to use react query data in another component without moving state up?
I am using nextjs + typescript + react-query. Currently my app has an input that asks a user for a url, which is then used to fetch a list of github issues. Here are the simplified versions of the ...
0
votes
0
answers
29
views
getServerSideProps with ReactQuery doesn't cache properly
im using nextjs 14.2.3 (page router) with react query, and my data is not cached when im trying to call an api on the server with getServerSideProps with reactQuery.
when ever i change my route, the ...
0
votes
0
answers
50
views
React query prefetchQuery with Suspense
I'm working on my Next.js project with a server component page where I'm prefetching posts with HydrationBoundary. Here’s the server component:
'use server';
import PostList from '@/components/shared/...
1
vote
0
answers
66
views
Unhandled Runtime Error: data is undefined in useSuspenseQuery with Next.js and Tanstack Query
I am working on a Next.js application where I have implemented a commenting system. Users can post a review for a particular AI tool, reply to a review, and reply to a reply as well.
I have a ...
0
votes
0
answers
41
views
React state is being shared across iframes?
We have a next.js app that we normally run by embedding it in an iframe on a third-party website. It uses react and react-query for state management. For a specific usecase, we wanted to run two ...
0
votes
1
answer
31
views
How to make sure to unmount component when URL param changes (but using same component) in NextJs with React-query?
I will make my example as simple as possible. I have userProfile component
// UserProfie.tsx
const UserProfile = ({id}) => {
const {data: userData} = useUser(id);
console.log(userData.id); // ...
0
votes
1
answer
218
views
How to Properly Fetch and Persist Global App Parameters in Next.js with Zustand and React Query?
I'm currently working on a project using Next 14 with server actions. I want to manage global app parameters (such as cities, countries, opening hours, banks list) that need to be fetched from the ...