Use thunk and Immer named imports

Author: markerikson

packages/toolkit/src/configureStore.ts

@@ -34,7 +34,7 @@ const IS_PRODUCTION = process.env.NODE_ENV === 'production'
  * @public
  */
 export type ConfigureEnhancersCallback<E extends Enhancers = Enhancers> = (
-    defaultEnhancers: readonly StoreEnhancer[]
+  defaultEnhancers: readonly StoreEnhancer[]
 ) => [...E]
 
 /**
@@ -107,7 +107,7 @@ type Enhancers = ReadonlyArray<StoreEnhancer>
 export interface ToolkitStore<
   S = any,
   A extends Action = AnyAction,
-  M extends Middlewares<S> = Middlewares<S>,
+  M extends Middlewares<S> = Middlewares<S>
 > extends Store<S, A> {
   /**
    * The `dispatch` method of your store, enhanced by all its middlewares.

packages/toolkit/src/createReducer.ts

@@ -1,5 +1,5 @@
 import type { Draft } from 'immer'
-import createNextState, { isDraft, isDraftable } from 'immer'
+import { produce as createNextState, isDraft, isDraftable } from 'immer'
 import type { AnyAction, Action, Reducer } from 'redux'
 import type { ActionReducerMapBuilder } from './mapBuilders'
 import { executeReducerBuilderCallback } from './mapBuilders'

packages/toolkit/src/getDefaultMiddleware.ts

@@ -1,6 +1,6 @@
 import type { Middleware, AnyAction } from 'redux'
 import type { ThunkMiddleware } from 'redux-thunk'
-import thunkMiddleware from 'redux-thunk'
+import { thunk as thunkMiddleware, withExtraArgument } from 'redux-thunk'
 import type { ImmutableStateInvariantMiddlewareOptions } from './immutableStateInvariantMiddleware'
 /* PROD_START_REMOVE_UMD */
 import { createImmutableStateInvariantMiddleware } from './immutableStateInvariantMiddleware'
@@ -88,9 +88,7 @@ export function getDefaultMiddleware<
     if (isBoolean(thunk)) {
       middlewareArray.push(thunkMiddleware)
     } else {
-      middlewareArray.push(
-        thunkMiddleware.withExtraArgument(thunk.extraArgument)
-      )
+      middlewareArray.push(withExtraArgument(thunk.extraArgument))
     }
   }
 

packages/toolkit/src/tests/configureStore.typetest.ts

@@ -6,7 +6,7 @@ import type {
   Reducer,
   Store,
   Action,
-  StoreEnhancer
+  StoreEnhancer,
 } from 'redux'
 import { applyMiddleware } from 'redux'
 import type { PayloadAction } from '@reduxjs/toolkit'
@@ -17,7 +17,7 @@ import {
   ConfigureStoreOptions,
 } from '@reduxjs/toolkit'
 import type { ThunkMiddleware, ThunkAction, ThunkDispatch } from 'redux-thunk'
-import thunk from 'redux-thunk'
+import { thunk } from 'redux-thunk'
 import { expectNotAny, expectType } from './helpers'
 
 const _anyMiddleware: any = () => () => () => {}
@@ -144,10 +144,12 @@ const _anyMiddleware: any = () => () => () => {}
   {
     const store = configureStore({
       reducer: () => 0,
-      enhancers: [applyMiddleware(() => next => next)]
+      enhancers: [applyMiddleware(() => (next) => next)],
     })
 
-    expectType<Dispatch & ThunkDispatch<number, undefined, AnyAction>>(store.dispatch)
+    expectType<Dispatch & ThunkDispatch<number, undefined, AnyAction>>(
+      store.dispatch
+    )
   }
 
   configureStore({
@@ -159,7 +161,7 @@ const _anyMiddleware: any = () => () => () => {}
   {
     type SomePropertyStoreEnhancer = StoreEnhancer<{ someProperty: string }>
 
-    const somePropertyStoreEnhancer: SomePropertyStoreEnhancer = next => {
+    const somePropertyStoreEnhancer: SomePropertyStoreEnhancer = (next) => {
       return (reducer, preloadedState) => {
         return {
           ...next(reducer, preloadedState),
@@ -168,9 +170,13 @@ const _anyMiddleware: any = () => () => () => {}
       }
     }
 
-    type AnotherPropertyStoreEnhancer = StoreEnhancer<{ anotherProperty: number }>
+    type AnotherPropertyStoreEnhancer = StoreEnhancer<{
+      anotherProperty: number
+    }>
 
-    const anotherPropertyStoreEnhancer: AnotherPropertyStoreEnhancer = next => {
+    const anotherPropertyStoreEnhancer: AnotherPropertyStoreEnhancer = (
+      next
+    ) => {
       return (reducer, preloadedState) => {
         return {
           ...next(reducer, preloadedState),
@@ -184,7 +190,9 @@ const _anyMiddleware: any = () => () => () => {}
       enhancers: [somePropertyStoreEnhancer, anotherPropertyStoreEnhancer],
     })
 
-    expectType<Dispatch & ThunkDispatch<number, undefined, AnyAction>>(store.dispatch)
+    expectType<Dispatch & ThunkDispatch<number, undefined, AnyAction>>(
+      store.dispatch
+    )
     expectType<string>(store.someProperty)
     expectType<number>(store.anotherProperty)
   }
@@ -348,7 +356,9 @@ const _anyMiddleware: any = () => () => () => {}
   {
     const store = configureStore({
       reducer: reducerA,
-      middleware: [] as any as readonly [Middleware<(a: StateA) => boolean, StateA>],
+      middleware: [] as any as readonly [
+        Middleware<(a: StateA) => boolean, StateA>
+      ],
     })
     const result: boolean = store.dispatch(5)
     // @ts-expect-error
@@ -532,21 +542,23 @@ const _anyMiddleware: any = () => () => () => {}
       initialState: null as any,
       reducers: {
         set(state) {
-          return state;
+          return state
         },
       },
-    });
+    })
 
-    function configureMyStore<S>(options: Omit<ConfigureStoreOptions<S>, 'reducer'>) {
+    function configureMyStore<S>(
+      options: Omit<ConfigureStoreOptions<S>, 'reducer'>
+    ) {
       return configureStore({
         ...options,
         reducer: someSlice.reducer,
-      });
+      })
     }
 
-    const store = configureMyStore({});
+    const store = configureMyStore({})
 
-    expectType<Function>(store.dispatch);
+    expectType<Function>(store.dispatch)
   }
 
   {

packages/toolkit/src/tests/getDefaultMiddleware.test.ts

@@ -11,7 +11,7 @@ import {
   MiddlewareArray,
   configureStore,
 } from '@reduxjs/toolkit'
-import thunk from 'redux-thunk'
+import { thunk } from 'redux-thunk'
 import type { ThunkMiddleware } from 'redux-thunk'
 
 import { expectType } from './helpers'
@@ -23,10 +23,20 @@ describe('getDefaultMiddleware', () => {
     process.env.NODE_ENV = ORIGINAL_NODE_ENV
   })
 
-  it('returns an array with only redux-thunk in production', () => {
-    process.env.NODE_ENV = 'production'
+  describe('Production behavior', () => {
+    beforeEach(() => {
+      jest.resetModules()
+    })
+
+    it('returns an array with only redux-thunk in production', () => {
+      process.env.NODE_ENV = 'production'
+      const { thunk } = require('redux-thunk')
+      const { getDefaultMiddleware } = require('@reduxjs/toolkit')
 
-    expect(getDefaultMiddleware()).toEqual([thunk]) // @remap-prod-remove-line
+      const middleware = getDefaultMiddleware()
+      expect(middleware).toContain(thunk)
+      expect(middleware.length).toBe(1)
+    })
   })
 
   it('returns an array with additional middleware in development', () => {