make the slice the reducer function

Author: phryneas

docs/api/createSlice.md

@@ -69,20 +69,19 @@ to force the TS compiler to accept the computed property.)
 
 ## Return Value
 
-`createSlice` will return an object that looks like:
+`createSlice` will return a reducer function with these additional properties:
 
 ```ts
 {
     name : string,
-    reducer : ReducerFunction,
     actions : Object<string, ActionCreator},
 }
 ```
 
 Each function defined in the `reducers` argument will have a corresponding action creator generated using [`createAction`](./createAction.md)
 and included in the result's `actions` field using the same function name.
 
-The generated `reducer` function is suitable for passing to the Redux `combineReducers` function as a "slice reducer".
+The generated function is suitable for passing to the Redux `combineReducers` function as a "slice reducer".
 
 You may want to consider destructuring the action creators and exporting them individually, for ease of searching
 for references in a larger codebase.
@@ -129,8 +128,8 @@ const user = createSlice({
 })
 
 const reducer = combineReducers({
-  counter: counter.reducer,
-  user: user.reducer
+  counter,
+  user
 })
 
 const store = createStore(reducer)

src/createSlice.test.ts

@@ -35,13 +35,18 @@ describe('createSlice', () => {
   })
 
   describe('when passing slice', () => {
-    const { actions, reducer } = createSlice({
+    const reducer = createSlice({
       reducers: {
         increment: state => state + 1
       },
       initialState: 0,
       name: 'cool'
     })
+    const { actions } = reducer
+
+    it('should have the correct name', () => {
+      expect(reducer.name).toBe('cool')
+    })
 
     it('should create increment action', () => {
       expect(actions.hasOwnProperty('increment')).toBe(true)
@@ -62,7 +67,7 @@ describe('createSlice', () => {
   describe('when mutating state object', () => {
     const initialState = { user: '' }
 
-    const { actions, reducer } = createSlice({
+    const reducer = createSlice({
       reducers: {
         setUserName: (state, action) => {
           state.user = action.payload
@@ -71,6 +76,7 @@ describe('createSlice', () => {
       initialState,
       name: 'user'
     })
+    const { actions } = reducer
 
     it('should set the username', () => {
       expect(reducer(initialState, actions.setUserName('eric'))).toEqual({
@@ -82,7 +88,7 @@ describe('createSlice', () => {
   describe('when passing extra reducers', () => {
     const addMore = createAction('ADD_MORE')
 
-    const { reducer } = createSlice({
+    const reducer = createSlice({
       name: 'test',
       reducers: {
         increment: state => state + 1,
@@ -137,7 +143,7 @@ describe('createSlice', () => {
         }
       })
 
-      testSlice.reducer(0, testSlice.actions.testReducer('testPayload'))
+      testSlice(0, testSlice.actions.testReducer('testPayload'))
       expect(reducer).toHaveBeenCalledWith(
         0,
         expect.objectContaining({ payload: 'testPayload' })

src/createSlice.ts

@@ -19,17 +19,12 @@ export type SliceActionCreator<P> = PayloadActionCreator<P>
 export interface Slice<
   State = any,
   ActionCreators extends { [key: string]: any } = { [key: string]: any }
-> {
+> extends Reducer<State> {
   /**
    * The slice name.
    */
   name: string
 
-  /**
-   * The slice's reducer.
-   */
-  reducer: Reducer<State>
-
   /**
    * Action creators for the types of actions that are handled by the slice
    * reducer.
@@ -198,9 +193,9 @@ export function createSlice<
     {} as any
   )
 
-  return {
-    name,
-    reducer,
+  Object.defineProperty(reducer, 'name', { value: name, writable: false })
+
+  return Object.assign(reducer, {
     actions: actionMap
-  }
+  })
 }

type-tests/files/createSlice.typetest.ts

@@ -26,12 +26,12 @@ function expectType<T>(t: T) {
 
   /* Reducer */
 
-  const reducer: Reducer<number, PayloadAction> = slice.reducer
+  const reducer: Reducer<number, PayloadAction> = slice
 
   // typings:expect-error
-  const stringReducer: Reducer<string, PayloadAction> = slice.reducer
+  const stringReducer: Reducer<string, PayloadAction> = slice
   // typings:expect-error
-  const anyActionReducer: Reducer<string, AnyAction> = slice.reducer
+  const anyActionReducer: Reducer<string, AnyAction> = slice
 
   /* Actions */