Port ngrx/entity and add createAsyncThunk

.gitignore

@@ -7,6 +7,7 @@ es
 
 
 .idea/
+.vscode/
 temp/
 
 .rts2*

etc/redux-toolkit.api.md

@@ -77,6 +77,9 @@ export type CaseReducerWithPrepare<State, Action extends PayloadAction> = {
     prepare: PrepareAction<Action['payload']>;
 };
 
+// @alpha (undocumented)
+export type Comparer<T> = ComparerNum<T> | ComparerStr<T>;
+
 // @public
 export type ConfigureEnhancersCallback = (defaultEnhancers: StoreEnhancer[]) => StoreEnhancer[];
 
@@ -98,6 +101,29 @@ export function createAction<P = void, T extends string = string>(type: T): Payl
 // @public
 export function createAction<PA extends PrepareAction<any>, T extends string = string>(type: T, prepareAction: PA): PayloadActionCreator<ReturnType<PA>['payload'], T, PA>;
 
+// @alpha (undocumented)
+export function createAsyncThunk<ActionType extends string, PayloadCreator extends AsyncActionCreator<unknown, Dispatch, unknown, undefined>>(type: ActionType, payloadCreator: PayloadCreator): {
+    (args?: Parameters<PayloadCreator>[0]["args"] | undefined): (dispatch: any, getState: any, extra: any) => Promise<any>;
+    pending: import("./createAction").ActionCreatorWithPreparedPayload<[Parameters<PayloadCreator>[0]["args"]], undefined, string, never, {
+        args: Parameters<PayloadCreator>[0]["args"];
+    }>;
+    rejected: import("./createAction").ActionCreatorWithPreparedPayload<[Error, Parameters<PayloadCreator>[0]["args"]], undefined, string, Error, {
+        args: Parameters<PayloadCreator>[0]["args"];
+    }>;
+    fulfilled: import("./createAction").ActionCreatorWithPreparedPayload<[Await<ReturnType<PayloadCreator>>, Parameters<PayloadCreator>[0]["args"]], Await<ReturnType<PayloadCreator>>, string, never, {
+        args: Parameters<PayloadCreator>[0]["args"];
+    }>;
+    finished: import("./createAction").ActionCreatorWithPreparedPayload<[Parameters<PayloadCreator>[0]["args"]], undefined, string, never, {
+        args: Parameters<PayloadCreator>[0]["args"];
+    }>;
+};
+
+// @alpha (undocumented)
+export function createEntityAdapter<T>(options?: {
+    selectId?: IdSelector<T>;
+    sortComparer?: false | Comparer<T>;
+}): EntityAdapter<T>;
+
 export { createNextState }
 
 // @public
@@ -122,13 +148,46 @@ export interface CreateSliceOptions<State = any, CR extends SliceCaseReducers<St
     reducers: ValidateSliceCaseReducers<State, CR>;
 }
 
+// @alpha (undocumented)
+export abstract class Dictionary<T> implements DictionaryNum<T> {
+    // (undocumented)
+    [id: string]: T | undefined;
+}
+
 export { Draft }
 
 // @public
 export interface EnhancedStore<S = any, A extends Action = AnyAction, M extends Middlewares<S> = Middlewares<S>> extends Store<S, A> {
     dispatch: DispatchForMiddlewares<M> & Dispatch<A>;
 }
 
+// @alpha (undocumented)
+export interface EntityAdapter<T> extends EntityStateAdapter<T> {
+    // (undocumented)
+    getInitialState(): EntityState<T>;
+    // (undocumented)
+    getInitialState<S extends object>(state: S): EntityState<T> & S;
+    // (undocumented)
+    getSelectors(): EntitySelectors<T, EntityState<T>>;
+    // (undocumented)
+    getSelectors<V>(selectState: (state: V) => EntityState<T>): EntitySelectors<T, V>;
+    // (undocumented)
+    selectId: IdSelector<T>;
+    // (undocumented)
+    sortComparer: false | Comparer<T>;
+}
+
+// @alpha (undocumented)
+export type EntityMap<T> = (entity: T) => T;
+
+// @alpha (undocumented)
+export interface EntityState<T> {
+    // (undocumented)
+    entities: Dictionary<T>;
+    // (undocumented)
+    ids: string[] | number[];
+}
+
 // @public (undocumented)
 export function findNonSerializableValue(value: unknown, path?: ReadonlyArray<string>, isSerializable?: (value: unknown) => boolean, getEntries?: (value: unknown) => [string, any][], ignoredPaths?: string[]): NonSerializableValue | false;
 
@@ -142,6 +201,9 @@ export function getDefaultMiddleware<S = any, O extends Partial<GetDefaultMiddle
 // @public
 export function getType<T extends string>(actionCreator: PayloadActionCreator<any, T>): T;
 
+// @alpha (undocumented)
+export type IdSelector<T> = IdSelectorStr<T> | IdSelectorNum<T>;
+
 // @public
 export function isPlain(val: any): boolean;
 
@@ -199,6 +261,9 @@ export type SliceCaseReducers<State> = {
 
 export { ThunkAction }
 
+// @alpha (undocumented)
+export type Update<T> = UpdateStr<T> | UpdateNum<T>;
+
 // @public
 export type ValidateSliceCaseReducers<S, ACR extends SliceCaseReducers<S>> = ACR & {
     [T in keyof ACR]: ACR[T] extends {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reduxjs/toolkit",
-  "version": "1.2.4",
+  "version": "1.3.0-alpha.0",
   "description": "The official, opinionated, batteries-included toolset for efficient Redux development",
   "repository": "https://github.com/reduxjs/redux-toolkit",
   "keywords": [

src/createAction.ts

@@ -5,6 +5,7 @@ import {
   IfVoid,
   IsAny
 } from './tsHelpers'
+import isPlainObject from './isPlainObject'
 
 /**
  * An action with a string type and an associated payload. This is the
@@ -295,6 +296,22 @@ export function createAction(type: string, prepareAction?: Function): any {
   return actionCreator
 }
 
+export function isFSA<
+  Payload = undefined,
+  Type extends string = string,
+  Meta = undefined
+>(action: any): action is PayloadAction<Payload, Type, Meta> {
+  return (
+    isPlainObject(action) &&
+    typeof (action as any).type === 'string' &&
+    Object.keys(action).every(isValidKey)
+  )
+}
+
+function isValidKey(key: string) {
+  return ['type', 'payload', 'error', 'meta'].indexOf(key) > -1
+}
+
 /**
  * Returns the action type of the actions created by the passed
  * `createAction()`-generated action creator (arbitrary action creators

src/createAsyncThunk.test.ts

@@ -0,0 +1,82 @@
+import { createAsyncThunk } from './createAsyncThunk'
+
+describe('createAsyncThunk', () => {
+  it('creates the action types', () => {
+    const thunkActionCreator = createAsyncThunk('testType', async () => 42)
+
+    expect(thunkActionCreator.fulfilled.type).toBe('testType/fulfilled')
+    expect(thunkActionCreator.pending.type).toBe('testType/pending')
+    expect(thunkActionCreator.finished.type).toBe('testType/finished')
+    expect(thunkActionCreator.rejected.type).toBe('testType/rejected')
+  })
+
+  it('accepts arguments and dispatches the actions on resolve', async () => {
+    const dispatch = jest.fn()
+
+    let passedArgs: any
+
+    const result = 42
+    const args = 123
+
+    const thunkActionCreator = createAsyncThunk(
+      'testType',
+      async ({ args }) => {
+        passedArgs = args
+        return result
+      }
+    )
+
+    const thunkFunction = thunkActionCreator(args)
+
+    await thunkFunction(dispatch, undefined, undefined)
+
+    expect(passedArgs).toBe(args)
+
+    expect(dispatch).toHaveBeenNthCalledWith(
+      1,
+      thunkActionCreator.pending(args)
+    )
+
+    expect(dispatch).toHaveBeenNthCalledWith(
+      2,
+      thunkActionCreator.fulfilled(result, args)
+    )
+
+    expect(dispatch).toHaveBeenNthCalledWith(
+      3,
+      thunkActionCreator.finished(args)
+    )
+  })
+
+  it('accepts arguments and dispatches the actions on reject', async () => {
+    const dispatch = jest.fn()
+
+    let passedArgs: any
+    const args = 123
+
+    const error = new Error('Panic!')
+
+    const thunkActionCreator = createAsyncThunk('testType', async () => {
+      throw error
+    })
+
+    const thunkFunction = thunkActionCreator(args)
+
+    await thunkFunction(dispatch, undefined, undefined)
+
+    expect(dispatch).toHaveBeenNthCalledWith(
+      1,
+      thunkActionCreator.pending(args)
+    )
+
+    expect(dispatch).toHaveBeenNthCalledWith(
+      2,
+      thunkActionCreator.rejected(error, args)
+    )
+
+    expect(dispatch).toHaveBeenNthCalledWith(
+      3,
+      thunkActionCreator.finished(args)
+    )
+  })
+})

src/createAsyncThunk.ts

@@ -0,0 +1,113 @@
+import { Dispatch } from 'redux'
+import { createAction } from './createAction'
+
+export type Await<T> = T extends {
+  then(onfulfilled?: (value: infer U) => unknown): unknown
+}
+  ? U
+  : T
+
+export interface AsyncThunkParams<
+  A,
+  D extends Dispatch,
+  S extends unknown,
+  E extends unknown
+> {
+  args: A
+  dispatch: D
+  getState: () => S
+  extra: E
+}
+
+export type AsyncActionCreator<
+  A,
+  D extends Dispatch,
+  S extends unknown,
+  E extends unknown
+> = (params: AsyncThunkParams<A, D, S, E>) => any
+
+/**
+ *
+ * @param type
+ * @param payloadCreator
+ *
+ * @alpha
+ */
+export function createAsyncThunk<
+  ActionType extends string,
+  PayloadCreator extends AsyncActionCreator<
+    unknown,
+    Dispatch,
+    unknown,
+    undefined
+  >
+>(type: ActionType, payloadCreator: PayloadCreator) {
+  // TODO This results in some hideous-looking inferred types for the actions
+  type ActionParams = Parameters<PayloadCreator>[0]['args']
+
+  const fulfilled = createAction(
+    type + '/fulfilled',
+    (result: Await<ReturnType<PayloadCreator>>, args: ActionParams) => {
+      return {
+        payload: result,
+        meta: { args }
+      }
+    }
+  )
+
+  const pending = createAction(type + '/pending', (args: ActionParams) => {
+    return {
+      payload: undefined,
+      meta: { args }
+    }
+  })
+
+  const finished = createAction(type + '/finished', (args: ActionParams) => {
+    return {
+      payload: undefined,
+      meta: { args }
+    }
+  })
+
+  const rejected = createAction(
+    type + '/rejected',
+    (error: Error, args: ActionParams) => {
+      return {
+        payload: undefined,
+        error,
+        meta: { args }
+      }
+    }
+  )
+
+  function actionCreator(args?: ActionParams) {
+    return async (dispatch: any, getState: any, extra: any) => {
+      try {
+        dispatch(pending(args))
+        // TODO Also ugly types
+        const result: Await<ReturnType<PayloadCreator>> = await payloadCreator({
+          args,
+          dispatch,
+          getState,
+          extra
+        })
+
+        // TODO How do we avoid errors in here from hitting the catch clause?
+        return dispatch(fulfilled(result, args))
+      } catch (err) {
+        // TODO Errors aren't serializable
+        dispatch(rejected(err, args))
+      } finally {
+        // TODO IS there really a benefit from a "finished" action?
+        dispatch(finished(args))
+      }
+    }
+  }
+
+  actionCreator.pending = pending
+  actionCreator.rejected = rejected
+  actionCreator.fulfilled = fulfilled
+  actionCreator.finished = finished
+
+  return actionCreator
+}

src/entities/create_adapter.ts

@@ -0,0 +1,38 @@
+import { EntityDefinition, Comparer, IdSelector, EntityAdapter } from './models'
+import { createInitialStateFactory } from './entity_state'
+import { createSelectorsFactory } from './state_selectors'
+import { createSortedStateAdapter } from './sorted_state_adapter'
+import { createUnsortedStateAdapter } from './unsorted_state_adapter'
+
+/**
+ *
+ * @param options
+ *
+ * @alpha
+ */
+export function createEntityAdapter<T>(
+  options: {
+    selectId?: IdSelector<T>
+    sortComparer?: false | Comparer<T>
+  } = {}
+): EntityAdapter<T> {
+  const { selectId, sortComparer }: EntityDefinition<T> = {
+    sortComparer: false,
+    selectId: (instance: any) => instance.id,
+    ...options
+  }
+
+  const stateFactory = createInitialStateFactory<T>()
+  const selectorsFactory = createSelectorsFactory<T>()
+  const stateAdapter = sortComparer
+    ? createSortedStateAdapter(selectId, sortComparer)
+    : createUnsortedStateAdapter(selectId)
+
+  return {
+    selectId,
+    sortComparer,
+    ...stateFactory,
+    ...selectorsFactory,
+    ...stateAdapter
+  }
+}