Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
""" WalkthroughThis update introduces comprehensive support for TanStack Query's Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant QueryOptions
participant QueryFn
participant QueryClient
User->>QueryOptions: Provide input (value or skipToken)
QueryOptions->>QueryFn: Prepare query options
alt input is skipToken
QueryOptions->>QueryFn: Set enabled = false
QueryFn-->>QueryClient: (Does NOT call client)
QueryFn-->>User: Throws error if called
else input is value
QueryOptions->>QueryFn: Set enabled = true
QueryFn->>QueryClient: Call with input
QueryClient-->>QueryFn: Return data
QueryFn-->>User: Return data
end
Assessment against linked issues
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (3)
🚧 Files skipped from review as they are similar to previous changes (3)
⏰ Context from checks skipped due to timeout of 90000ms (2)
✨ Finishing Touches
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
Codecov ReportAll modified and coverable lines are covered by tests ✅ 📢 Thoughts on this report? Let us know! |
More templates
@orpc/arktype
@orpc/client
@orpc/contract
@orpc/nest
@orpc/openapi
@orpc/openapi-client
@orpc/react
@orpc/server
@orpc/react-query
@orpc/shared
@orpc/solid-query
@orpc/standard-server
@orpc/standard-server-fetch
@orpc/standard-server-node
@orpc/standard-server-peer
@orpc/svelte-query
@orpc/valibot
@orpc/vue-colada
@orpc/vue-query
@orpc/zod
commit: |
dinwwwh
changed the title
skipTokenskipToken as input
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
packages/react-query/tests/e2e.test.tsx (1)
1-170: Address React testing warnings.There's a pipeline warning about React state updates not being wrapped in
act(...), which could lead to unreliable test behavior.Consider wrapping the state updates in React's
act()helper or using thewaitForutility more consistently to ensure proper test behavior. This particularly applies to the new tests with timeouts where you're waiting for state updates.🧰 Tools
🪛 GitHub Actions: CI
[error] 1-6: React testing warning: An update to TestComponent inside a test was not wrapped in act(...). React state updates should be wrapped in act(...) to ensure proper testing behavior.
packages/solid-query/src/procedure-utils.test-d.ts (1)
122-124: Consider addressing the FIXME for useQueries error inference.The commented FIXME indicates that useQueries cannot infer error types correctly. While this is a known limitation not directly related to skipToken support, it might be worth addressing in a future PR to improve type safety.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Cache: Disabled due to data retention organization setting
Knowledge Base: Disabled due to data retention organization setting
📒 Files selected for processing (25)
apps/content/docs/tanstack-query/basic.md(1 hunks)apps/content/docs/tanstack-query/react.md(0 hunks)packages/react-query/src/procedure-utils.test-d.ts(4 hunks)packages/react-query/src/procedure-utils.test.ts(2 hunks)packages/react-query/src/procedure-utils.ts(2 hunks)packages/react-query/src/types.ts(1 hunks)packages/react-query/tests/e2e.test-d.ts(2 hunks)packages/react-query/tests/e2e.test.tsx(3 hunks)packages/solid-query/src/procedure-utils.test-d.ts(12 hunks)packages/solid-query/src/procedure-utils.test.ts(2 hunks)packages/solid-query/src/procedure-utils.ts(2 hunks)packages/solid-query/src/types.ts(1 hunks)packages/solid-query/tests/e2e.test-d.ts(10 hunks)packages/solid-query/tests/e2e.test.tsx(4 hunks)packages/svelte-query/src/procedure-utils.test-d.ts(2 hunks)packages/svelte-query/src/procedure-utils.test.ts(0 hunks)packages/svelte-query/src/procedure-utils.test.tsx(1 hunks)packages/svelte-query/src/procedure-utils.ts(2 hunks)packages/svelte-query/src/types.ts(1 hunks)packages/svelte-query/tests/e2e.test.tsx(3 hunks)packages/vue-query/src/procedure-utils.test-d.ts(5 hunks)packages/vue-query/src/procedure-utils.test.ts(2 hunks)packages/vue-query/src/procedure-utils.ts(2 hunks)packages/vue-query/src/types.ts(4 hunks)packages/vue-query/tests/e2e.test.tsx(3 hunks)
💤 Files with no reviewable changes (2)
- apps/content/docs/tanstack-query/react.md
- packages/svelte-query/src/procedure-utils.test.ts
🧰 Additional context used
🧬 Code Graph Analysis (13)
packages/solid-query/tests/e2e.test-d.ts (1)
packages/solid-query/tests/shared.tsx (1)
orpc(5-5)
packages/vue-query/tests/e2e.test.tsx (1)
packages/client/tests/shared.ts (1)
orpc(32-32)
packages/react-query/tests/e2e.test.tsx (3)
playgrounds/nuxt/lib/orpc.ts (1)
orpc(16-16)packages/client/tests/helpers.ts (1)
orpc(151-151)packages/client/tests/shared.ts (1)
orpc(32-32)
packages/solid-query/src/procedure-utils.ts (1)
packages/solid-query/src/key.ts (1)
buildKey(11-22)
packages/solid-query/src/procedure-utils.test-d.ts (2)
packages/solid-query/src/procedure-utils.ts (1)
ProcedureUtils(8-44)packages/vue-colada/src/procedure-utils.ts (1)
ProcedureUtils(8-37)
packages/svelte-query/src/procedure-utils.test-d.ts (1)
packages/svelte-query/src/procedure-utils.ts (1)
ProcedureUtils(8-44)
packages/solid-query/tests/e2e.test.tsx (1)
packages/solid-query/tests/shared.tsx (2)
orpc(5-5)queryClient(7-13)
packages/react-query/src/procedure-utils.ts (1)
packages/vue-colada/src/key.ts (1)
buildKey(9-23)
packages/svelte-query/tests/e2e.test.tsx (3)
packages/svelte-query/tests/shared.tsx (2)
orpc(5-5)queryClient(7-13)playgrounds/svelte-kit/src/lib/orpc.ts (1)
orpc(16-16)packages/svelte-query/src/router-utils.ts (1)
get(37-55)
packages/solid-query/src/types.ts (3)
packages/react-query/src/types.ts (4)
QueryOptionsIn(5-8)QueryOptionsBase(10-15)InfiniteOptionsIn(17-20)InfiniteOptionsBase(22-27)packages/client/src/types.ts (1)
ClientContext(6-6)packages/shared/src/types.ts (1)
SetOptional(1-1)
packages/react-query/src/types.ts (5)
packages/svelte-query/src/types.ts (4)
QueryOptionsIn(12-15)QueryOptionsBase(17-22)InfiniteOptionsIn(24-27)InfiniteOptionsBase(29-34)packages/solid-query/src/types.ts (4)
QueryOptionsIn(12-15)QueryOptionsBase(17-22)InfiniteOptionsIn(24-27)InfiniteOptionsBase(29-34)packages/vue-query/src/types.ts (4)
QueryOptionsIn(18-29)QueryOptionsBase(31-36)InfiniteOptionsIn(38-49)InfiniteOptionsBase(51-56)packages/client/src/types.ts (1)
ClientContext(6-6)packages/shared/src/types.ts (1)
SetOptional(1-1)
packages/svelte-query/src/types.ts (4)
packages/solid-query/src/types.ts (4)
QueryOptionsIn(12-15)QueryOptionsBase(17-22)InfiniteOptionsIn(24-27)InfiniteOptionsBase(29-34)packages/react-query/src/types.ts (4)
QueryOptionsIn(5-8)QueryOptionsBase(10-15)InfiniteOptionsIn(17-20)InfiniteOptionsBase(22-27)packages/client/src/types.ts (1)
ClientContext(6-6)packages/shared/src/types.ts (1)
SetOptional(1-1)
packages/vue-query/src/types.ts (6)
packages/svelte-query/src/types.ts (1)
InfiniteOptionsIn(24-27)packages/solid-query/src/types.ts (1)
InfiniteOptionsIn(24-27)packages/react-query/src/types.ts (1)
InfiniteOptionsIn(17-20)packages/client/src/types.ts (1)
ClientContext(6-6)packages/server/src/index.ts (1)
ClientContext(24-24)packages/client/tests/helpers.ts (1)
ClientContext(130-130)
🪛 GitHub Actions: CI
packages/vue-query/tests/e2e.test.tsx
[warning] 1-6: Vue warning: onScopeDispose() is called when there is no active effect scope to be associated with.
packages/react-query/tests/e2e.test.tsx
[error] 1-6: React testing warning: An update to TestComponent inside a test was not wrapped in act(...). React state updates should be wrapped in act(...) to ensure proper testing behavior.
🔇 Additional comments (110)
packages/react-query/tests/e2e.test-d.ts (2)
44-44: Clean positioning of the type error expectation.Repositioning the
@ts-expect-errorcomment to the line before the entire input property rather than within it improves clarity, making it explicit that the entire input object is expected to fail type checking.
80-80: Consistent error annotation positioning.Good consistency in positioning the
@ts-expect-errorcomment for theuseSuspenseQuerytest, matching the same pattern used in theuseQuerytest above.packages/vue-query/tests/e2e.test.tsx (3)
3-3: Correctly importing skipToken from the Vue Query package.The import statement has been appropriately updated to include the
skipTokensentinel value, which is essential for the new test cases.
55-65: Comprehensive test for useQuery with skipToken.This test effectively verifies that when
skipTokenis provided as input touseQuery:
- The query status remains 'pending'
- No fetching occurs even after a timeout
- The query client doesn't initiate any network requests
This ensures the
skipTokenfunctionality correctly prevents the query from executing as intended.
133-147: Thorough test for useInfiniteQuery with skipToken.This test properly validates that
useInfiniteQuerywithskipTokenas input:
- Keeps the query in 'pending' status
- Prevents any fetch attempts
- Doesn't change state even after a delay
The implementation maintains consistency between regular and infinite queries, which is excellent for API predictability.
apps/content/docs/tanstack-query/basic.md (1)
124-144: Clear documentation for skipToken usage.The added documentation section:
- Clearly explains the purpose of
skipTokenas a type-safe alternative to thedisabledoption- Provides practical examples for both
useQueryanduseInfiniteQuery- Shows a realistic use case with conditionally disabling queries based on search parameters
- Uses appropriate highlighting to emphasize the key parts of the code
This documentation will help users understand how to properly implement conditional query execution with
skipToken.packages/react-query/tests/e2e.test.tsx (2)
3-3: Correctly importing skipToken from React Query.The import has been properly updated to include the
skipTokensentinel value from@tanstack/react-query, which is required for the new tests.
49-59: Effective test for useQuery with skipToken.This test properly verifies that
useQuerywithskipTokenas input:
- Maintains the query in a 'pending' status
- Prevents the query client from initiating any fetch requests
- Preserves this state even after a delay
This confirms the correct implementation of the
skipTokenfunctionality for React Query.packages/svelte-query/tests/e2e.test.tsx (3)
3-3: ImportskipTokento support new test cases.The addition of
skipTokenimport from@tanstack/svelte-querysupports the new test cases validating that queries can be conditionally disabled using this token.
54-64: Well-structured test for query withskipTokeninput.This test case properly verifies two key behaviors when
skipTokenis used:
- The query remains in a 'pending' status
- No fetching occurs (isFetching returns 0)
The test validates both immediate state and after a delay, ensuring the query remains disabled over time.
132-146: Comprehensive test for infinite query withskipToken.This test mirrors the structure of the regular query test but applied to infinite queries, ensuring that:
- The query remains in 'pending' status
- No network requests are triggered
- The behavior persists after a timeout
This provides good coverage for the
skipTokenfeature across different query types.packages/react-query/src/procedure-utils.ts (3)
5-5: ImportskipTokensentinel value.Adding the import for
skipTokenfrom@tanstack/react-queryenables conditional query disabling throughout the utility.
60-67: Add robust error handling and disabling forskipTokenin queryOptions.The implementation correctly:
- Throws a clear error message if the query function is called despite being disabled
- Sets
enabled: falsewhenskipTokenis provided as inputThis prevents queries from executing when
skipTokenis used, matching TanStack Query's expected behavior.
74-86: CompleteskipTokensupport for infiniteOptions.This implementation correctly handles
skipTokenfor infinite queries by:
- Intelligently handling the query key construction when
skipTokenis provided- Adding error prevention if the query function is somehow called
- Setting
enabled: falseto prevent query executionThe conditional handling of the input in the query key is particularly important for correct caching behavior.
packages/solid-query/tests/e2e.test-d.ts (5)
3-3: Update to current hook-based API.Replacing the deprecated
createQuery,createQueries,createInfiniteQuery, andcreateMutationimports with their current hook-based equivalents from@tanstack/solid-query.
22-57: Migrate queryOptions tests to use current hook-based API.Updating the test cases to use
useQueryinstead of the deprecatedcreateQuerywhile maintaining the same test coverage and type checks. This change ensures the tests remain effective with the latest Solid Query API.
59-95: Convert queries tests to use hook-based API.This segment properly updates the
useQueriesfunction usage while preserving all the type assertions and test logic from the original tests.
113-155: Migrate infinite query tests to hook-based API.The implementation correctly updates
createInfiniteQuerytouseInfiniteQueryacross all test cases, maintaining the same validation of typing behavior and error cases.
169-199: Update mutation tests to use hook-based API.The migration from
createMutationtouseMutationmaintains all the existing type checks while adapting to the newer API pattern.packages/svelte-query/src/procedure-utils.test-d.ts (6)
6-6: ImportskipTokenfor type testing.Adding the
skipTokenimport enables type-level testing of this feature across the various procedure utilities.
14-14: Add conditional variable forskipTokentesting.The
conditionvariable allows testing both paths whereskipTokenis or isn't used, ensuring type safety in both scenarios. This is a good pattern for comprehensive type testing.
36-36: UpdaterequiredUtilstype with required context property.Changing the
batchproperty from optional to required ensures more thorough testing of the requirement interactions withskipToken.
41-41: AddskipTokenconditional input tests.These test cases verify that
skipTokencan be used as input in both optional and required contexts, ensuring proper type checking in each scenario.Also applies to: 47-50
58-60: Verify context requirements withskipToken.This test case confirms that context requirements are still enforced even when
skipTokenis used as input, which is important for maintaining type safety across the utility.
65-65: Add type verification forskipTokenwith incorrect inputs.These test cases ensure that using
skipTokendoesn't bypass other type checks. The conditional pattern correctly tests both standard input validation and validation whenskipTokencould be used.Also applies to: 68-70
packages/solid-query/src/procedure-utils.ts (6)
5-5: Import ofskipTokensentinel value addedThe addition of
skipTokenimport from@tanstack/solid-queryenables the use of this TanStack Query feature to conditionally disable queries.
60-66: Good error handling forskipTokeninputsThe implementation correctly detects when the
skipTokensentinel value is provided as input and throws a clear error message if the query function is still called, preventing unexpected behavior.
67-67: Properly disables query execution withskipTokenSetting
enabled: falsewhen input isskipTokenensures the query won't execute, which is the expected behavior for this TanStack Query feature.
74-77: Correctly handlesskipTokenin query key generation for infinite queriesThe conditional logic ensures that when
skipTokenis used as input, it's properly passed to the query key, otherwise it correctly calls the input function with the initial page parameter.
79-82: Good error handling for infinite queries withskipTokenSimilar to the regular query implementation, this correctly prevents execution of infinite queries when
skipTokenis provided and throws a clear error message.
85-85: Properly disables infinite query execution withskipTokenSetting
enabled: falsefor infinite queries when input isskipTokenensures the query won't execute, maintaining consistent behavior with regular queries.packages/solid-query/src/procedure-utils.test.ts (5)
1-1: Import ofskipTokenfor testingCorrectly imports the
skipTokensentinel value from@tanstack/solid-queryfor use in tests.
21-34: Well-structured test for standard query optionsThe test for query options without
skipTokenis well-organized and verifies the expected behavior when using regular inputs, including checking thatenabledis true and the client is called.
36-47: Comprehensive test forskipTokenin query optionsThis test thoroughly verifies the
skipTokenbehavior by confirming that:
enabledis set tofalse- The query key is built correctly with
skipToken- Calling the query function throws the expected error
- The client is never called
This provides excellent coverage for the new feature.
50-73: Well-structured test for standard infinite query optionsThe test for infinite query options without
skipTokenverifies all the expected behaviors including correct query key generation, parameter handling, and client interaction.
75-96: Comprehensive test forskipTokenin infinite query optionsThis test thoroughly verifies the
skipTokenbehavior in infinite queries by confirming that:
enabledis set tofalse- The query key is built correctly with
skipToken- The initialPageParam and getNextPageParam are preserved
- Calling the query function throws the expected error
- The client is never called
This provides excellent coverage for the new feature with infinite queries.
packages/svelte-query/src/procedure-utils.ts (6)
5-5: Import ofskipTokensentinel value for SvelteThe addition of
skipTokenimport from@tanstack/svelte-queryenables the use of this TanStack Query feature in the Svelte implementation.
60-66: Good error handling forskipTokeninputs in SvelteThe implementation correctly detects when the
skipTokensentinel value is provided as input and throws a clear error message if the query function is still called.
67-67: Properly disables Svelte query execution withskipTokenSetting
enabled: falsewhen input isskipTokenensures the query won't execute in Svelte applications.
74-77: Correctly handlesskipTokenin query key generation for Svelte infinite queriesThe conditional logic ensures that when
skipTokenis used as input in Svelte, it's properly passed to the query key, otherwise it correctly calls the input function with the initial page parameter.
79-82: Good error handling for Svelte infinite queries withskipTokenSimilar to the regular query implementation, this correctly prevents execution of infinite queries when
skipTokenis provided in Svelte applications and throws a clear error message.
85-85: Properly disables Svelte infinite query execution withskipTokenSetting
enabled: falsefor infinite queries when input isskipTokenensures the query won't execute in Svelte applications.packages/vue-query/src/procedure-utils.ts (6)
5-5: Import ofskipTokensentinel value for VueThe addition of
skipTokenimport from@tanstack/vue-queryenables the use of this TanStack Query feature in the Vue implementation.
62-70: Vue-specific handling of reactive inputs withskipTokenThe implementation correctly:
- Uses
unrefDeepto handle Vue's reactive inputs- Detects when the unwrapped input is
skipToken- Throws a clear error message if the query function is called with
skipTokenThis properly adapts the
skipTokenfeature for Vue's reactivity system.
71-71: Properly handles reactiveenabledproperty in VueWrapping the
enabledcondition in acomputedproperty ensures it will correctly react to changes in the input, dynamically enabling/disabling the query when the input changes between a regular value andskipToken.
78-85: Correctly handles reactive inputs for Vue infinite query keysThe implementation:
- Unwraps potentially reactive inputs using
unrefDeep- Builds the query key conditionally based on whether the input is
skipToken- Wraps the entire key generation in a
computedproperty to maintain reactivityThis ensures reactivity is properly maintained while supporting the
skipTokenfeature.
86-94: Vue-specific handling of reactive inputs for infinite query functionsThe implementation correctly:
- Unwraps reactive inputs at query execution time
- Handles the
skipTokencase properly with a clear error message- Preserves the reactive nature of inputs when executing regular queries
This properly adapts the
skipTokenfeature for Vue's reactivity system in infinite queries.
95-95: Properly handles reactiveenabledproperty for Vue infinite queriesWrapping the
enabledcondition in acomputedproperty ensures it will correctly react to changes in the input for infinite queries, maintaining consistency with regular queries.packages/react-query/src/procedure-utils.test.ts (1)
1-111: Well-structured test organization with comprehensive skipToken coverage.The tests are logically reorganized into describe blocks that clearly separate normal queries from those using skipToken. The new tests thoroughly verify that skipToken correctly:
- Disables queries by setting
enabled: false- Maintains proper query key construction
- Prevents client calls
- Throws appropriate errors if queryFn is accidentally called
This ensures robust handling of conditional query skipping across both regular and infinite queries.
packages/react-query/src/procedure-utils.test-d.ts (4)
6-6: Good addition of skipToken import alongside existing query hooks.The import statement correctly includes skipToken from the TanStack React Query package, enabling type testing of the skipToken functionality.
13-14: Well-designed condition variable for toggle testing.Adding a typed boolean condition variable is an effective approach for testing conditional skipToken usage in various scenarios.
40-41: Comprehensive type testing for skipToken with both optional and required inputs.The tests effectively verify that skipToken can be used conditionally in place of regular inputs while maintaining proper type safety. Error cases are also correctly tested with
@ts-expect-errorannotations.Also applies to: 47-50, 58-60, 64-65, 68-69
195-205: Complete coverage of infinite query scenarios with skipToken.The tests verify skipToken behavior with infinite queries, including conditional function wrapping and proper type checking for both valid and invalid inputs. The parameter rename from
pageParamtocursorimproves readability.Also applies to: 216-229, 232-236
packages/vue-query/src/procedure-utils.test-d.ts (5)
6-6: Consistent skipToken import for Vue implementation.The import statement correctly includes skipToken from the TanStack Vue Query package, maintaining framework-specific imports while ensuring consistent functionality.
14-14: Matching condition variable implementation for Vue tests.The Vue tests follow the same pattern as the React tests with a typed boolean condition variable, ensuring consistent testing approach across frameworks.
41-41: Consistent type testing for Vue's skipToken implementation.The Vue tests mirror the React tests for skipToken integration, ensuring equivalent functionality across frameworks while accounting for Vue's reactive paradigm.
Also applies to: 47-50, 58-60, 65-65, 68-70
196-205: Complete coverage of Vue infinite query scenarios with skipToken.The tests thoroughly verify skipToken behavior with Vue's infinite queries, including proper handling of Vue's reactivity system. The implementation maintains consistency with the React version while adapting to Vue's unique patterns.
Also applies to: 217-229, 232-236
84-89: Enhanced reactive input validation for Vue implementation.The test now includes validation for invalid reactive inputs and contexts, ensuring type safety when using skipToken with Vue's reactivity system.
packages/solid-query/tests/e2e.test.tsx (6)
4-4: Updated to modern hook-based APIs with skipToken support.The imports have been modernized to use the current hook-based API (
useQuery,useInfiniteQuery,useMutation) instead of the deprecated create* functions, while also adding skipToken support.
17-18: Migration from createQuery to useQuery while preserving functionality.The test has been successfully migrated to the modern hook-based API while maintaining the same test behavior and assertions.
49-59: Comprehensive testing for useQuery with skipToken.This new test case effectively verifies that:
- Queries with skipToken remain in a "pending" state
- No fetching occurs (isFetching count is 0)
- The query remains in a pending state even after a delay
This ensures that skipToken properly prevents query execution in real-world usage.
61-62: Migration from createInfiniteQuery to useInfiniteQuery.The test has been successfully migrated to the modern hook-based API for infinite queries while preserving existing functionality.
127-141: Thorough verification of useInfiniteQuery with skipToken.This test case thoroughly verifies that infinite queries with skipToken behave correctly:
- The query status remains "pending"
- No fetching occurs
- The state remains unchanged even after a delay
This ensures proper skipToken behavior for infinite queries in real application scenarios.
143-144: Migration from createMutation to useMutation.The test has been successfully migrated to the modern hook-based API for mutations while maintaining the same test behavior.
packages/react-query/src/types.ts (5)
3-3: Imports SkipToken type from TanStack React Query library.This import enables type support for TanStack Query's skipToken feature, which provides a type-safe way to conditionally disable queries.
6-6: Enhances input types to support skipToken.The type definition now correctly allows the
inputproperty to be either the original type or aSkipToken, enabling queries to be conditionally disabled in a type-safe manner. This maintains the conditional optionality based on whetherundefinedis part ofTInput.
14-14: Adds required enabled property to QueryOptionsBase.The addition of the
enabledflag as a required property ensures explicit control over query execution status, which is essential for proper skipToken implementation.
18-18: Adds skipToken support to infinite queries.The infinite query input type now properly accepts
skipTokenas an alternative to the function that produces input, maintaining consistency with the standard query implementation.
26-26: Adds required enabled property to InfiniteOptionsBase.Similar to the change for regular queries, this ensures explicit control over infinite query execution status, which is necessary for skipToken functionality.
packages/solid-query/src/types.ts (5)
6-6: Imports SkipToken type from TanStack Solid Query library.This import enables type support for TanStack Query's skipToken feature in the Solid.js integration, maintaining consistency with the React implementation.
13-13: Enhances input types to support skipToken in Solid.js.The type definition now correctly allows the
inputproperty to be either the original type or aSkipTokenin Solid Query, providing a type-safe way to conditionally disable queries.
21-21: Adds required enabled property to QueryOptionsBase.Adding the
enabledflag as a required property ensures explicit control over query execution status in Solid Query, matching the implementation in other frameworks.
25-25: Adds skipToken support to infinite queries in Solid.js.The infinite query input type now properly accepts
skipTokenas an alternative to the function that produces input, maintaining consistency across query types.
33-33: Adds required enabled property to InfiniteOptionsBase.This change ensures explicit control over infinite query execution status in Solid Query, necessary for proper skipToken functionality.
packages/svelte-query/src/types.ts (5)
9-9: Imports SkipToken type from TanStack Svelte Query library.This import enables type support for TanStack Query's skipToken feature in the Svelte integration, maintaining consistency with other framework implementations.
13-13: Enhances input types to support skipToken in Svelte.The type definition now correctly allows the
inputproperty to be either the original type or aSkipTokenin Svelte Query, providing a type-safe way to conditionally disable queries.
21-21: Adds required enabled property to QueryOptionsBase.Adding the
enabledflag as a required property ensures explicit control over query execution status in Svelte Query, matching the implementation in other frameworks.
25-25: Adds skipToken support to infinite queries in Svelte.The infinite query input type now properly accepts
skipTokenas an alternative to the function that produces input, maintaining consistency across query types.
33-33: Adds required enabled property to InfiniteOptionsBase.This change ensures explicit control over infinite query execution status in Svelte Query, necessary for proper skipToken functionality.
packages/vue-query/src/types.ts (5)
3-3: Imports SkipToken type from TanStack Vue Query library.This import enables type support for TanStack Query's skipToken feature in the Vue integration, maintaining consistency with other framework implementations.
19-19: Enhances input types to support skipToken with Vue's reactivity system.The type definition now correctly allows the
inputproperty to be either the original type or aSkipToken, wrapped in Vue'sMaybeRefDeepto account for Vue's reactivity system. This provides a type-safe way to conditionally disable queries in Vue.
35-35: Makes enabled property required and reactive in QueryOptionsBase.The
enabledflag is now a requiredComputedRef<boolean>property, ensuring explicit and reactive control over query execution status in Vue Query, appropriately adapting to Vue's reactivity system.
45-45: Adds reactive skipToken support to infinite queries in Vue.The infinite query input type now properly accepts
skipTokenas an alternative to the function that produces input, correctly wrapped in Vue's reactivity utilities to maintain reactivity throughout the system.
55-55: Makes enabled property required and reactive in InfiniteOptionsBase.The
enabledflag is now a requiredComputedRef<boolean>property for infinite queries, ensuring explicit and reactive control over infinite query execution status in Vue Query.packages/svelte-query/src/procedure-utils.test.tsx (6)
1-4: Well-structured imports with necessary dependencies.The imports include all required dependencies for testing, with the
skipTokenfrom@tanstack/svelte-querybeing the key addition that enables the new functionality.
21-34: Good implementation of queryOptions test without skipToken.This test ensures that the base functionality works as expected when a normal input is provided:
- Verifies that the query is enabled
- Checks that the query key is built correctly
- Confirms the queryFn resolves correctly and calls the client with expected parameters
36-47: Correct implementation of skipToken handling in queryOptions.The test properly verifies that when skipToken is used:
- The query is automatically disabled (
enabledis set to false)- The query key is built correctly with skipToken as input
- The queryFn throws an appropriate error and doesn't call the client
This ensures skipToken behaves as expected, preventing query execution when used.
50-73: Thorough testing of infiniteOptions without skipToken.This test validates that infinite queries work correctly with regular input:
- Verifies query is enabled
- Validates query key construction
- Checks that getNextPageParam and initialPageParam are correctly passed through
- Confirms the queryFn calls the client with the right parameters
Comprehensive test coverage for the basic functionality.
75-96: Proper handling of skipToken in infiniteOptions.The test correctly validates that when skipToken is used with infiniteOptions:
- The query is automatically disabled
- The query key includes skipToken
- getNextPageParam and initialPageParam are still correctly passed through
- The queryFn throws an appropriate error and doesn't call the client
This ensures consistent behavior with skipToken across both regular and infinite queries.
99-111: Mutation options test remains unchanged and appropriate.The mutation options test doesn't need modifications for skipToken support since skipToken is only relevant for queries and infinite queries, not mutations. The existing test properly verifies that mutation options are correctly generated.
packages/solid-query/src/procedure-utils.test-d.ts (13)
6-6: Updated imports to use the current hook APIs.Correctly imports
skipTokenalong with the current hook-based APIs (useInfiniteQuery,useMutation,useQueries,useQuery) from@tanstack/solid-queryrather than the deprecated functions.
13-13: Good addition of condition variable for testing conditional skipToken usage.The boolean condition variable allows testing conditional usage of skipToken, which is a common use case where users would conditionally disable queries based on the availability of required parameters.
39-41: Added support for conditional skipToken in queryOptions.Properly tests conditional usage of skipToken in queryOptions, demonstrating how the API handles dynamic switching between skipToken and valid input based on conditions.
46-49: Comprehensive type testing for required utils with conditional skipToken.Correctly tests required utils with conditional skipToken input, ensuring type safety is maintained when skipToken is used in place of required inputs.
58-59: Type checking for missing context with conditional skipToken.Properly verifies that even when using skipToken conditionally, required context is still checked at the type level, maintaining type safety.
64-64: Type inference works correctly with conditional skipToken.Tests that type inference for input parameters works correctly when skipToken is used conditionally.
67-68: Type checking catches errors even with conditional skipToken.Verifies that invalid input types are caught even when combined with conditional skipToken usage, maintaining type safety.
77-125: Updated useQuery and useQueries tests to use current hook APIs.The tests have been updated to use the current hook-based APIs instead of deprecated functions, ensuring tests remain valid with the latest TanStack Query versions. The FIXME comment on line 122 correctly identifies a limitation with error type inference in useQueries.
182-191: Added conditional skipToken support for infiniteOptions.Successfully implements and tests conditional skipToken usage with infiniteOptions, allowing for dynamic disabling of infinite queries based on conditions.
203-213: Comprehensive type checking for invalid inputs with conditional skipToken.Properly tests that type errors are caught when invalid input types are used in conjunction with conditional skipToken in infiniteOptions.
214-226: Type checking for conflicting types in conditional skipToken scenarios.Successfully tests that type errors are caught when there are conflicts between pageParam types and initialPageParam types, even when skipToken is used conditionally.
245-278: Updated useInfiniteQuery tests to use current hook API.The tests have been updated to use the current hook-based API (useInfiniteQuery) instead of deprecated functions, ensuring the tests remain valid with the latest TanStack Query versions.
315-329: Updated useMutation test to use current hook API.The test has been updated to use the current hook-based API (useMutation) instead of deprecated functions, ensuring the test remains valid with the latest TanStack Query versions.
packages/vue-query/src/procedure-utils.test.ts (7)
1-1: Added skipToken import for Vue Query integration.Correctly imports the skipToken sentinel value from @tanstack/vue-query to support conditional query disabling.
22-35: Comprehensive testing of queryOptions without skipToken in Vue.This test properly verifies that queryOptions works correctly with normal Vue computed inputs:
- Checks that the query is enabled
- Verifies the query key is built correctly
- Confirms the queryFn resolves correctly and calls the client with expected parameters
Adapts the tests to Vue's reactivity system by using computed and ref.
37-48: Proper handling of skipToken in Vue queryOptions.The test correctly validates that when skipToken is used:
- The query is automatically disabled (
enabled.valueis false)- The query key is built correctly with skipToken as input
- The queryFn throws an appropriate error and doesn't call the client
This ensures consistent behavior with skipToken in Vue Query.
50-75: Excellent test for reactive skipToken handling in Vue.This test comprehensively checks how reactive inputs behave when switching between skipToken and valid input:
- Initially verifies the query is disabled with skipToken
- Changes the ref value to a valid computed input
- Confirms the query becomes enabled
- Verifies the query key is rebuilt with the new input
- Checks that the queryFn now works correctly with the new input
This is particularly valuable for Vue's reactivity system, ensuring smooth transitions between disabled and enabled states.
78-101: Thorough testing of infiniteOptions without skipToken in Vue.This test properly verifies that infiniteOptions works correctly with normal Vue computed inputs:
- Checks that the infinite query is enabled
- Verifies the query key is built correctly
- Confirms initialPageParam and getNextPageParam are passed through
- Validates the queryFn resolves correctly and calls the client with expected parameters
Adapts the tests to Vue's reactivity system.
103-124: Correct skipToken handling in Vue infiniteOptions.The test validates that when skipToken is used with infiniteOptions:
- The query is automatically disabled
- The query key includes skipToken
- initialPageParam and getNextPageParam are correctly passed through
- The queryFn throws an appropriate error and doesn't call the client
This ensures consistent behavior with skipToken for infinite queries in Vue.
126-160: Comprehensive test for reactive skipToken in infiniteOptions.This test thoroughly checks how reactive inputs behave in infinite queries when switching between skipToken and valid input:
- Initially verifies the query is disabled with skipToken
- Changes the ref value to a valid input function
- Confirms the query becomes enabled
- Verifies the query key is rebuilt with the new input
- Checks that the queryFn now works correctly with the new input
This is particularly valuable for Vue's reactivity system with infinite queries.
2 participants
Closes: https://github.com/unnoq/orpc/issues/495
Alternative: https://github.com/unnoq/orpc/pull/496
Co-authored-by: Louis Haftmann 30736553+LouisHaftmann@users.noreply.github.com
Summary by CodeRabbit
Summary by CodeRabbit
New Features
skipTokento conditionally disable queries in React, Solid, Svelte, and Vue Query integrations.skipTokenfor disabling queries.Bug Fixes
skipTokenis used as input.Tests
skipToken.skipTokenis used.Documentation
skipToken.