Merge remote-tracking branch 'upstream/master' into update-oazapfts

.codesandbox/ci.json

@@ -8,7 +8,7 @@
     "/examples/action-listener/counter",
     "/examples/publish-ci/cra5"
   ],
-  "node": "16",
+  "node": "18",
   "buildCommand": "build:packages",
   "packages": [
     "packages/toolkit",

.gitattributes

@@ -0,0 +1 @@
+* text=auto eol=lf

.github/workflows/publish.yml

@@ -24,7 +24,7 @@ jobs:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: '18.x'
+          node-version: '20.x'
           registry-url: 'https://registry.npmjs.org'
           cache: 'yarn'
       - run: yarn install --frozen-lockfile

.github/workflows/test-codegen.yml

@@ -31,7 +31,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: ['18.x']
+        node-version: ['20.x']
 
     steps:
       - uses: actions/checkout@v2

.github/workflows/tests.yml

@@ -30,7 +30,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node: ['18.x']
+        node: ['20.x']
 
     steps:
       - name: Checkout repo
@@ -67,7 +67,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node: ['18.x']
+        node: ['20.x']
     steps:
       - name: Checkout repo
         uses: actions/checkout@v2
@@ -104,7 +104,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node: ['18.x']
+        node: ['20.x']
         ts: ['4.7', '4.8', '4.9', '5.0', '5.1', '5.2', '5.3']
     steps:
       - name: Checkout repo
@@ -148,7 +148,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node: ['18.x']
+        node: ['20.x']
         example:
           [
             'cra4',
@@ -163,6 +163,8 @@ jobs:
     defaults:
       run:
         working-directory: ./examples/publish-ci/${{ matrix.example }}
+    env:
+      YARN_ENABLE_IMMUTABLE_INSTALLS: "false"
     steps:
       - name: Checkout repo
         uses: actions/checkout@v2
@@ -214,7 +216,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node: ['18.x']
+        node: ['20.x']
     steps:
       - name: Checkout repo
         uses: actions/checkout@v2

.prettierrc.json

@@ -1,5 +1,4 @@
 {
   "semi": false,
-  "singleQuote": true,
-  "endOfLine": "auto"
+  "singleQuote": true
 }

.yarnrc.yml

@@ -1,9 +1,7 @@
-nodeLinker: node-modules
+compressionLevel: mixed
+
+enableGlobalCache: false
 
-plugins:
-  - path: .yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs
-    spec: '@yarnpkg/plugin-workspace-tools'
-  - path: .yarn/plugins/@yarnpkg/plugin-version.cjs
-    spec: '@yarnpkg/plugin-version'
+nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-3.2.4.cjs
+yarnPath: .yarn/releases/yarn-4.1.0.cjs

docs/api/autoBatchEnhancer.mdx

@@ -27,7 +27,7 @@ interface CounterState {
 
 const counterSlice = createSlice({
   name: 'counter',
-  initialState: { value: 0 } as CounterState,
+  initialState: { value: 0 } satisfies CounterState as CounterState,
   reducers: {
     incrementBatched: {
       // Batched, low-priority

docs/api/createAsyncThunk.mdx

@@ -39,14 +39,14 @@ const fetchUserById = createAsyncThunk(
 )
 
 interface UsersState {
-  entities: []
+  entities: User[]
   loading: 'idle' | 'pending' | 'succeeded' | 'failed'
 }
 
 const initialState = {
   entities: [],
   loading: 'idle',
-} as UsersState
+} satisfies UserState as UsersState
 
 // Then, handle actions in your reducers:
 const usersSlice = createSlice({
@@ -699,7 +699,7 @@ interface UsersState {
 const initialState = {
   entities: {},
   error: null,
-} as UsersState
+} satisfies UsersState as UsersState
 
 const usersSlice = createSlice({
   name: 'users',

docs/api/createReducer.mdx

@@ -52,7 +52,7 @@ const increment = createAction('counter/increment')
 const decrement = createAction('counter/decrement')
 const incrementByAmount = createAction<number>('counter/incrementByAmount')
 
-const initialState = { value: 0 } as CounterState
+const initialState = { value: 0 } satisfies CounterState as CounterState
 
 const counterReducer = createReducer(initialState, (builder) => {
   builder

docs/api/createSlice.mdx

@@ -25,7 +25,7 @@ interface CounterState {
   value: number
 }
 
-const initialState = { value: 0 } as CounterState
+const initialState = { value: 0 } satisfies CounterState as CounterState
 
 const counterSlice = createSlice({
   name: 'counter',
@@ -158,7 +158,7 @@ const todosSlice = createSlice({
   initialState: {
     loading: false,
     todos: [],
-  } as TodoState,
+  } satisfies TodoState as TodoState,
   reducers: (create) => ({
     deleteTodo: create.reducer<number>((state, action) => {
       state.todos.splice(action.payload, 1)
@@ -513,7 +513,7 @@ interface CounterState {
 
 const counterSlice = createSlice({
   name: 'counter',
-  initialState: { value: 0 } as CounterState,
+  initialState: { value: 0 } satisfies CounterState as CounterState,
   reducers: {
     // omitted
   },
@@ -542,7 +542,7 @@ interface CounterState {
 
 const counterSlice = createSlice({
   name: 'counter',
-  initialState: { value: 0 } as CounterState,
+  initialState: { value: 0 } satisfies CounterState as CounterState,
   reducers: {
     // omitted
   },
@@ -608,7 +608,7 @@ const decrementBy = createAction<number>('decrementBy')
 
 const counter = createSlice({
   name: 'counter',
-  initialState: 0 as number,
+  initialState: 0 satisfies number as number,
   reducers: {
     increment: (state) => state + 1,
     decrement: (state) => state - 1,

docs/api/matching-utilities.mdx

@@ -181,7 +181,7 @@ interface ExampleState {
 const initialState = {
   isSpecial: false,
   isInteresting: false,
-} as ExampleState
+} satisfies ExampleState as ExampleState
 
 export const isSpecialAndInterestingThunk = createAsyncThunk(
   'isSpecialAndInterestingThunk',

docs/api/otherExports.mdx

@@ -66,7 +66,7 @@ interface Todo {
 }
 const addTodo = createAction<Todo>('addTodo')
 
-const initialState = [] as Todo[]
+const initialState = [] satisfies Todo[] as Todo[]
 
 const todosReducer = createReducer(initialState, (builder) => {
   builder.addCase(addTodo, (state, action) => {

docs/tutorials/typescript.md

@@ -149,7 +149,7 @@ In some cases, [TypeScript may unnecessarily tighten the type of the initial sta
 // Workaround: cast state instead of declaring variable type
 const initialState = {
   value: 0,
-} as CounterState
+} satisfies CounterState as CounterState
 ```
 
 ### Use Typed Hooks in Components

docs/usage/nextjs.mdx

@@ -380,7 +380,7 @@ It is worth noting that initializing the store with a `useEffect` would not work
 
 ### Caching
 
-The App Router has four seperate caches including `fetch` request and route caches. The most likely cache to cause issues is the route cache. If you have an application that accepts login you may have routes (e.g. the home route, `/`) that render different data based on the user you will need to disable the route cache by using the [`dynamic` export from the route handler](https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config#dynamic):
+The App Router has four separate caches including `fetch` request and route caches. The most likely cache to cause issues is the route cache. If you have an application that accepts login you may have routes (e.g. the home route, `/`) that render different data based on the user you will need to disable the route cache by using the [`dynamic` export from the route handler](https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config#dynamic):
 
 ```ts
 export const dynamic = 'force-dynamic'

docs/usage/usage-with-typescript.md

@@ -273,7 +273,7 @@ createSlice({
 
 You might have noticed that it is not a good idea to pass your `SliceState` type as a generic to `createSlice`. This is due to the fact that in almost all cases, follow-up generic parameters to `createSlice` need to be inferred, and TypeScript cannot mix explicit declaration and inference of generic types within the same "generic block".
 
-The standard approach is to declare an interface or type for your state, create an initial state value that uses that type, and pass the initial state value to `createSlice`. You can also use the construct `initialState: myInitialState as SliceState`.
+The standard approach is to declare an interface or type for your state, create an initial state value that uses that type, and pass the initial state value to `createSlice`. You can also use the construct `initialState: myInitialState satisfies SliceState as SliceState`.
 
 ```ts {1,4,8,15}
 type SliceState = { state: 'loading' } | { state: 'finished'; data: string }
@@ -290,7 +290,7 @@ createSlice({
 // Or, cast the initial state as necessary
 createSlice({
   name: 'test2',
-  initialState: { state: 'loading' } as SliceState,
+  initialState: { state: 'loading' } satisfies SliceState as SliceState,
   reducers: {},
 })
 ```
@@ -368,14 +368,14 @@ const fetchUserById = createAsyncThunk(
 )
 
 interface UsersState {
-  entities: []
+  entities: User[]
   loading: 'idle' | 'pending' | 'succeeded' | 'failed'
 }
 
 const initialState = {
   entities: [],
   loading: 'idle',
-} as UsersState
+} satisfies UsersState as UsersState
 
 const usersSlice = createSlice({
   name: 'users',

docs/virtual/matchers/index.ts

@@ -37,7 +37,7 @@ export interface ExampleState {
 export const initialState = {
   isSpecial: false,
   isInteresting: false,
-} as ExampleState
+} satisfies ExampleState as ExampleState
 
 export const isSpecialAndInterestingThunk = createAsyncThunk(
   'isSpecialAndInterestingThunk',

examples/query/react/advanced/src/Pokemon.tsx

@@ -1,33 +1,33 @@
-import { useGetPokemonByNameQuery } from './services/pokemon'
-
-export const Pokemon = ({
-  name,
-  pollingInterval,
-}: {
-  name: string
-  pollingInterval: number
-}) => {
-  const { data, error, isLoading, isFetching } = useGetPokemonByNameQuery(
-    name,
-    {
-      pollingInterval,
-    },
-  )
-
-  return (
-    <>
-      {error ? (
-        <>Oh no, there was an error</>
-      ) : isLoading ? (
-        <>Loading...</>
-      ) : data ? (
-        <>
-          <h3>
-            {data.species.name} {isFetching ? '...' : ''}
-          </h3>
-          <img src={data.sprites.front_shiny} alt={data.species.name} />
-        </>
-      ) : null}
-    </>
-  )
-}
+import { useGetPokemonByNameQuery } from './services/pokemon'
+
+export const Pokemon = ({
+  name,
+  pollingInterval,
+}: {
+  name: string
+  pollingInterval: number
+}) => {
+  const { data, error, isLoading, isFetching } = useGetPokemonByNameQuery(
+    name,
+    {
+      pollingInterval,
+    },
+  )
+
+  return (
+    <>
+      {error ? (
+        <>Oh no, there was an error</>
+      ) : isLoading ? (
+        <>Loading...</>
+      ) : data ? (
+        <>
+          <h3>
+            {data.species.name} {isFetching ? '...' : ''}
+          </h3>
+          <img src={data.sprites.front_shiny} alt={data.species.name} />
+        </>
+      ) : null}
+    </>
+  )
+}

examples/query/react/advanced/src/services/pokemon.ts

@@ -1,15 +1,15 @@
-import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
-
-export const pokemonApi = createApi({
-  reducerPath: 'pokemonApi',
-  baseQuery: fetchBaseQuery({ baseUrl: 'https://pokeapi.co/api/v2/' }),
-  tagTypes: [],
-  endpoints: (builder) => ({
-    getPokemonByName: builder.query({
-      query: (name: string) => `pokemon/${name}`,
-    }),
-  }),
-})
-
-// Export hooks for usage in functional components
-export const { useGetPokemonByNameQuery } = pokemonApi
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+
+export const pokemonApi = createApi({
+  reducerPath: 'pokemonApi',
+  baseQuery: fetchBaseQuery({ baseUrl: 'https://pokeapi.co/api/v2/' }),
+  tagTypes: [],
+  endpoints: (builder) => ({
+    getPokemonByName: builder.query({
+      query: (name: string) => `pokemon/${name}`,
+    }),
+  }),
+})
+
+// Export hooks for usage in functional components
+export const { useGetPokemonByNameQuery } = pokemonApi

examples/query/react/authentication-with-extrareducers/src/mocks/browser.ts

@@ -1,4 +1,4 @@
-import { setupWorker } from 'msw'
-import { handlers } from './handlers'
-
-export const worker = setupWorker(...handlers)
+import { setupWorker } from 'msw'
+import { handlers } from './handlers'
+
+export const worker = setupWorker(...handlers)

examples/query/react/authentication/src/mocks/browser.ts

@@ -1,4 +1,4 @@
-import { setupWorker } from 'msw'
-import { handlers } from './handlers'
-
-export const worker = setupWorker(...handlers)
+import { setupWorker } from 'msw'
+import { handlers } from './handlers'
+
+export const worker = setupWorker(...handlers)