v1.7.0-beta.0 #1673
markerikson
announced in
Announcements
v1.7.0-beta.0
#1673
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
This release updates RTK Query with support for SSR and rehydration, allows sharing mutation results across components, adds a new
currentData
field to query results, adds several new options for customizing endpoints and base queries, adds support for asynccondition
options increateAsyncThunk
, and updatescreateSlice/createReducer
to accept a "lazy state initializer" function.See the v1.7 beta docs for updated usage guides and API references:
Changelog
RTK Query SSR and Rehydration Support
RTK Query now has support for SSR scenarios, such as the
getStaticProps/getServerSideProps
APIs in Next.js. Queries can be executed on the server using the existingdispatch(someEndpoint.initiate())
thunks, and then collected using the newawait Promise.all(api.getRunningOperationPromises())
method.API definitions can then provide an
extractRehydrationInfo
method that looks for a specific action type containing the fetched data, and return the data to initialize the API cache section of the store state.The related
api.util.getRunningOperationPromise()
API adds a building block that may enable future support for React Suspense as well, and we'd encourage users to experiment with this idea.Sharing Mutation Results Across Components
Mutation hooks provide status of in-progress requests, but as originally designed that information was unique per-component - there was no way for another component to see that request status data. But, we had several requests to enable this use case.
useMutation
hooks now support afixedCacheKey
option that will store the result status in a common location, so multiple components can read the request status if needed.This does mean that the data cannot easily be cleaned up automatically, so the mutation status object now includes a
reset()
function that can be used to clear that data.Data Loading Updates
Query results now include a
currentData
field, which contains the latest data cached from the server for the current query arg. Additionally,transformResponse
now receives the query arg as a parameter. These can be used to add additional derivation logic in cases when a hooks query arg has changed to represent a different value and the existing data no longer conceptually makes sense to keep displaying.Data Serialization and Base Query Improvements
RTK Query originally only did shallow checks for query arg fields to determine if values had changed. This caused issues with infinite loops depending on user input.
The query hooks now use a "serialized stable value" hook internally to do more consistent comparisons of query args and eliminate those problems.
Also,
fetchBaseQuery
now supports aparamsSerializer
option that allows customization of query string generation from the provided arguments, which enables better interaction with some backend APIs.The
BaseQueryApi
andprepareheaders
args now include fields forendpoint
name,type
to indicate if it's a query or mutation, andforced
to indicate a re-fetch even if there was already a cache entry. These can be used to help determine headers likeCache-Control: no-cache
.createAsyncThunk
ImprovementsThe
condition
option may now beasync
, which enables scenarios like checking if an existing operation is running and resolving the promise when the other instance is done.If an
idGenerator
function is provided, it will now be given thethunkArg
value as a parameter, which enables generating custom IDs based on the request data.The
createAsyncThunk
types were updated to correctly handle type inference when usingrejectWithValue()
.Other Improvements
createSlice
andcreateReducer
now accept a "lazy state initializer" function as theinitialState
argument. If provided, the initializer will be called to produce a new initial state value any time the reducer is givenundefined
as its state argument. This can be useful for cases like reading fromlocalStorage
, as well as testing.API objects now have a
selectInvalidatedBy
function that accepts a root state object and an array of query tag objects, and returns a list of details on endpoints that would be invalidated. This can be used to help implement optimistic updates of paginated lists.Related Libraries
The Redux team has also recently released Reselect 4.1 and Redux Thunk 2.4. Reselect 4.1 contains major improvements to selector options, including cache sizes > 1, and both libraries have improved TS types. We'll update 1.7 to depend on those new versions before release, but you can update your own projects to make sure you have the new functionality and types available as well:
What's Changed
true
" isLoading briefly flips back totrue
#1519 by @phryneas in fix "isLoading briefly flips back totrue
" #1519 #1520arg
totransformResponse
by @phryneas in addarg
totransformResponse
#1521currentData
property to hook results. by @phryneas in addcurrentData
property to hook results. #1500useSerializedStableValue
for value comparison by @phryneas in useuseSerializedStableValue
for value comparison #1533reset
method to useMutation hook by @phryneas in addreset
method to useMutation hook #1476useMutation
hook by @phryneas in allow for "shared component results" using theuseMutation
hook #1477useMutation
shared results by @Shrugsy in 🐛 Fix bug withuseMutation
shared results #1616endpoint
,type
andforced
toBaseQueryApi
andprepareHeaders
by @phryneas in addendpoint
,type
andforced
toBaseQueryApi
andprepareHeaders
#1656AsyncThunkConfig
for better inference by @phryneas in split off signature withoutAsyncThunkConfig
for better inference #1644selectInvalidatedBy
by @phryneas in addselectInvalidatedBy
#1665Full Changelog: v1.6.2...v1.7.0-beta.0
This discussion was created from the release v1.7.0-beta.0.
Beta Was this translation helpful? Give feedback.
All reactions