-
-
Notifications
You must be signed in to change notification settings - Fork 3.5k
fix: don't update dataUpdateCount when setting initial data #9743
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
🦋 Changeset detectedLatest commit: 426c02c The changes in this PR will be included in the next version bump. This PR includes changesets to release 19 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
WalkthroughApplies initialData to queries by updating the query state directly (avoiding setData) to prevent accidental dataUpdateCount increments; adds a test verifying prefetched-query + initialData behavior and observer refetch; includes a changeset noting the isFetchedAfterMount fix. Changes
Sequence Diagram(s)sequenceDiagram
autonumber
actor App
participant Query as Query
participant Observer as QueryObserver
participant State as QueryState
participant Fetcher as Fetch
App->>Query: prefetch() (no data)
Query->>State: create pending state (data: undefined)
App->>Observer: mount(initialData)
Observer->>Query: setOptions(initialData)
Query->>State: setState(successState(initialData))
Note right of State #dff0d8: dataUpdateCount remains 0\nfetchMeta/fetchFailure cleared
App->>Observer: observer.refetch()
Observer->>Query: fetch()
Query->>Fetcher: network fetch
Fetcher-->>Query: resolved data
Query->>State: setData(fetched) -- increments dataUpdateCount
Note right of State #f7ecb5: isFetchedAfterMount becomes true
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (1)
🔇 Additional comments (3)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
View your CI Pipeline Execution ↗ for commit 426c02c
☁️ Nx Cloud last updated this comment at |
More templates
- @tanstack/query-example-angular-auto-refetching
- @tanstack/query-example-angular-basic
- @tanstack/query-example-angular-basic-persister
- @tanstack/query-example-angular-devtools-panel
- @tanstack/query-example-angular-infinite-query-with-max-pages
- @tanstack/query-example-angular-optimistic-updates
- @tanstack/query-example-angular-pagination
- @tanstack/query-example-angular-query-options-from-a-service
- @tanstack/query-example-angular-router
- @tanstack/query-example-angular-rxjs
- @tanstack/query-example-angular-simple
- @tanstack/query-example-solid-astro
- @tanstack/query-example-solid-basic
- @tanstack/query-example-solid-basic-graphql-request
- @tanstack/query-example-solid-default-query-function
- @tanstack/query-example-solid-simple
- @tanstack/query-example-solid-start-streaming
- @tanstack/query-example-svelte-auto-refetching
- @tanstack/query-example-svelte-basic
- @tanstack/query-example-svelte-load-more-infinite-scroll
- @tanstack/query-example-svelte-optimistic-updates
- @tanstack/query-example-svelte-playground
- @tanstack/query-example-svelte-simple
- @tanstack/query-example-svelte-ssr
- @tanstack/query-example-svelte-star-wars
- @tanstack/query-example-react-algolia
- @tanstack/query-example-react-auto-refetching
- @tanstack/query-example-react-basic
- @tanstack/query-example-react-basic-graphql-request
- @tanstack/query-example-chat
- @tanstack/query-example-react-default-query-function
- @tanstack/query-example-react-devtools-panel
- @tanstack/query-example-eslint-legacy
- @tanstack/query-example-react-infinite-query-with-max-pages
- @tanstack/query-example-react-load-more-infinite-scroll
- @tanstack/query-example-react-nextjs
- @tanstack/query-example-react-nextjs-app-prefetching
- @tanstack/query-example-nextjs-suspense-streaming
- @tanstack/query-example-react-offline
- @tanstack/query-example-react-optimistic-updates-cache
- @tanstack/query-example-react-optimistic-updates-ui
- @tanstack/query-example-react-pagination
- @tanstack/query-example-react-playground
- @tanstack/query-example-react-prefetching
- @tanstack/query-example-react-react-native
- @tanstack/query-example-react-router
- @tanstack/query-example-react-rick-morty
- @tanstack/query-example-react-shadow-dom
- @tanstack/query-example-react-simple
- @tanstack/query-example-react-star-wars
- @tanstack/query-example-react-suspense
- @tanstack/query-example-vue-2.6-basic
- @tanstack/query-example-vue-2.7-basic
- @tanstack/query-example-vue-basic
- @tanstack/query-example-vue-dependent-queries
- @tanstack/query-example-vue-nuxt3
- @tanstack/query-example-vue-persister
- @tanstack/query-example-vue-simple
@tanstack/angular-query-experimental
npm i https://pkg.pr.new/@tanstack/angular-query-experimental@9743
@tanstack/eslint-plugin-query
npm i https://pkg.pr.new/@tanstack/eslint-plugin-query@9743
@tanstack/query-async-storage-persister
npm i https://pkg.pr.new/@tanstack/query-async-storage-persister@9743
@tanstack/query-broadcast-client-experimental
npm i https://pkg.pr.new/@tanstack/query-broadcast-client-experimental@9743
@tanstack/query-core
npm i https://pkg.pr.new/@tanstack/query-core@9743
@tanstack/query-devtools
npm i https://pkg.pr.new/@tanstack/query-devtools@9743
@tanstack/query-persist-client-core
npm i https://pkg.pr.new/@tanstack/query-persist-client-core@9743
@tanstack/query-sync-storage-persister
npm i https://pkg.pr.new/@tanstack/query-sync-storage-persister@9743
@tanstack/react-query
npm i https://pkg.pr.new/@tanstack/react-query@9743
@tanstack/react-query-devtools
npm i https://pkg.pr.new/@tanstack/react-query-devtools@9743
@tanstack/react-query-next-experimental
npm i https://pkg.pr.new/@tanstack/react-query-next-experimental@9743
@tanstack/react-query-persist-client
npm i https://pkg.pr.new/@tanstack/react-query-persist-client@9743
@tanstack/solid-query
npm i https://pkg.pr.new/@tanstack/solid-query@9743
@tanstack/solid-query-devtools
npm i https://pkg.pr.new/@tanstack/solid-query-devtools@9743
@tanstack/solid-query-persist-client
npm i https://pkg.pr.new/@tanstack/solid-query-persist-client@9743
@tanstack/svelte-query
npm i https://pkg.pr.new/@tanstack/svelte-query@9743
@tanstack/svelte-query-devtools
npm i https://pkg.pr.new/@tanstack/svelte-query-devtools@9743
@tanstack/svelte-query-persist-client
npm i https://pkg.pr.new/@tanstack/svelte-query-persist-client@9743
@tanstack/vue-query
npm i https://pkg.pr.new/@tanstack/vue-query@9743
@tanstack/vue-query-devtools
npm i https://pkg.pr.new/@tanstack/vue-query-devtools@9743
commit: 478f5d0
...tchedAfterMountFix
.../query into diid/fetchedAfterMountFix
...tchedAfterMountFix
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
let’s not change this here please. I think I’ll investigate if this is necessary separately
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this.setState(
successState(defaultState.data, defaultState.dataUpdatedAt),
)
The whole idea was to have one defined successState
so that these two places don’t diverge. I’ll try to fix fetchMeta
and fetchFailureCount
separately.
Uh oh!
There was an error while loading. Please reload this page.
🎯 Changes
This introduces a check when updating
dataUpdateCount
so that it isn't updated when setting initial data. This in turn fixes theisFetchedAfterMount
bug discussed in #9656fixes #9656
✅ Checklist
pnpm test:pr
🚀 Release Impact
Summary by CodeRabbit
Bug Fixes
Tests
Chores