Skip to content

Commit

Permalink
Remove slice selectors (#193)
Browse files Browse the repository at this point in the history
* Remove slice selectors

* Update createSlice docs to remove selector references
  • Loading branch information
markerikson committed Sep 8, 2019
1 parent 659ff14 commit 313e3ce
Show file tree
Hide file tree
Showing 7 changed files with 10 additions and 111 deletions.
24 changes: 4 additions & 20 deletions docs/api/createSlice.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,8 @@ hide_title: true

# `createSlice`

A function that accepts an initial state, an object full of reducer functions, and optionally a "slice name", and automatically generates action creators, action types, and selectors that correspond to the reducers and state.
A function that accepts an initial state, an object full of reducer functions, and optionally a "slice name",
and automatically generates action creators and action types that correspond to the reducers and state.

## Parameters

Expand All @@ -19,7 +20,7 @@ function createSlice({
reducers: Object<string, ReducerFunction>
// The initial state for the reducer
initialState: any,
// An optional name, used in action types and selectors
// An optional name, used in action types
slice?: string,
// An additional object of "case reducers". Keys should be other action types.
extraReducers?: Object<string, ReducerFunction>
Expand All @@ -45,16 +46,7 @@ The initial state value for this slice of state.

### `slice`

An optional string name for this slice of state.

The slice name is used in two ways.

First, if provided, generated action type constants will use this as a prefix.

Second, it affects the name and behavior of the generated selector. If provided, a selector named after the slice
will be generated. This selector assume the slice data exists in an object, with the slice name as the key, and will
return the value at that key name. If not provided, a selector named `getState` will be generated that just returns
its argument.
An optional string name for this slice of state. Generated action type constants will use this as a prefix.

### `extraReducers`

Expand Down Expand Up @@ -84,7 +76,6 @@ to force the TS compiler to accept the computed property.)
slice : string,
reducer : ReducerFunction,
actions : Object<string, ActionCreator},
selectors : Object<string, Selector>
}
```

Expand All @@ -93,8 +84,6 @@ 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 selector function will be available in the result's `selectors` field.

You may want to consider destructuring the action creators and exporting them individually, for ease of searching
for references in a larger codebase.

Expand Down Expand Up @@ -156,9 +145,4 @@ console.log(`${counter.actions.decrement}`)
// -> "counter/decrement"
store.dispatch(user.actions.setUserName('eric'))
// -> { counter: 6, user: { name: 'eric', age: 22} }
const state = store.getState()
console.log(user.selectors.getUser(state))
// -> { name: 'eric', age: 22 }
console.log(counter.selectors.getCounter(state))
// -> 6
```
8 changes: 1 addition & 7 deletions src/configureStore.test.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,7 @@
import { configureStore } from './configureStore'
import * as redux from 'redux'
import * as devtools from 'redux-devtools-extension'
import {
StoreCreator,
StoreEnhancer,
StoreEnhancerStoreCreator,
Reducer,
AnyAction
} from 'redux'
import { StoreEnhancer, StoreEnhancerStoreCreator } from 'redux'

describe('configureStore', () => {
jest.spyOn(redux, 'applyMiddleware')
Expand Down
22 changes: 2 additions & 20 deletions src/createSlice.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { createAction, PayloadAction } from './createAction'

describe('createSlice', () => {
describe('when slice is empty', () => {
const { actions, reducer, selectors } = createSlice({
const { actions, reducer } = createSlice({
reducers: {
increment: state => state + 1,
multiply: (state, action: PayloadAction<number>) =>
Expand Down Expand Up @@ -43,20 +43,10 @@ describe('createSlice', () => {
expect(reducer(2, actions.multiply(3))).toEqual(6)
})
})

describe('when using selectors', () => {
it('should create selector with correct name', () => {
expect(selectors.hasOwnProperty('getState')).toBe(true)
})

it('should return the slice state data', () => {
expect(selectors.getState(2)).toEqual(2)
})
})
})

describe('when passing slice', () => {
const { actions, reducer, selectors } = createSlice({
const { actions, reducer } = createSlice({
reducers: {
increment: state => state + 1
},
Expand All @@ -78,14 +68,6 @@ describe('createSlice', () => {
it('should return the correct value from reducer', () => {
expect(reducer(undefined, actions.increment())).toEqual(1)
})

it('should create selector with correct name', () => {
expect(selectors.hasOwnProperty('getCool')).toBe(true)
})

it('should return the slice state data', () => {
expect(selectors.getCool({ cool: 2 })).toEqual(2)
})
})

describe('when mutating state object', () => {
Expand Down
21 changes: 3 additions & 18 deletions src/createSlice.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ import {
ActionCreatorWithPreparedPayload
} from './createAction'
import { createReducer, CaseReducers, CaseReducer } from './createReducer'
import { createSliceSelector, createSelectorName } from './sliceSelector'

/**
* An action creator atttached to a slice.
Expand Down Expand Up @@ -36,14 +35,6 @@ export interface Slice<
* reducer.
*/
actions: ActionCreators

/**
* Selectors for the slice reducer state. `createSlice()` inserts a single
* selector that returns the entire slice state and whose name is
* automatically derived from the slice name (e.g., `getCounter` for a slice
* named `counter`).
*/
selectors: { [key: string]: (state: any) => State }
}

/**
Expand All @@ -54,8 +45,7 @@ export interface CreateSliceOptions<
CR extends SliceCaseReducers<State, any> = SliceCaseReducers<State, any>
> {
/**
* The slice's name. Used to namespace the generated action types and to
* name the selector for retrieving the reducer's state.
* The slice's name. Used to namespace the generated action types.
*/
slice?: string

Expand Down Expand Up @@ -156,7 +146,7 @@ function getType(slice: string, actionKey: string): string {
/**
* A function that accepts an initial state, an object full of reducer
* functions, and optionally a "slice name", and automatically generates
* action creators, action types, and selectors that correspond to the
* action creators and action types that correspond to the
* reducers and state.
*
* The `reducer` argument is passed to `createReducer()`.
Expand Down Expand Up @@ -205,14 +195,9 @@ export function createSlice<
{} as any
)

const selectors = {
[createSelectorName(slice)]: createSliceSelector(slice)
}

return {
slice,
reducer,
actions: actionMap,
selectors
actions: actionMap
}
}
9 changes: 0 additions & 9 deletions src/sliceSelector.test.ts

This file was deleted.

30 changes: 0 additions & 30 deletions src/sliceSelector.ts

This file was deleted.

7 changes: 0 additions & 7 deletions type-tests/files/createSlice.typetest.ts
Original file line number Diff line number Diff line change
Expand Up @@ -40,13 +40,6 @@ function expectType<T>(t: T) {

// typings:expect-error
slice.actions.other(1)

/* Selector */

const value: number = slice.selectors.getCounter(0)

// typings:expect-error
const stringValue: string = slice.selectors.getCounter(0)
}

/*
Expand Down

0 comments on commit 313e3ce

Please sign in to comment.