refactor(core): extract state enhancers from store (#338)

Author: francoischalifour

packages/autocomplete-core/src/completionStateEnhancer.ts

@@ -0,0 +1,12 @@
+import { getCompletion } from './getCompletion';
+import { AutocompleteState, InternalAutocompleteOptions } from './types';
+
+export function completionStateEnhancer<TItem>(
+  state: AutocompleteState<TItem>,
+  props: InternalAutocompleteOptions<TItem>
+) {
+  return {
+    ...state,
+    completion: getCompletion({ state, props }),
+  };
+}

packages/autocomplete-core/src/createAutocomplete.ts

@@ -1,3 +1,4 @@
+import { completionStateEnhancer } from './completionStateEnhancer';
 import { createStore } from './createStore';
 import { getAutocompleteSetters } from './getAutocompleteSetters';
 import { getDefaultProps } from './getDefaultProps';
@@ -15,7 +16,7 @@ export function createAutocomplete<
   options: AutocompleteOptions<TItem>
 ): AutocompleteApi<TItem, TEvent, TMouseEvent, TKeyboardEvent> {
   const props = getDefaultProps(options);
-  const store = createStore(stateReducer, props);
+  const store = createStore(stateReducer, props, [completionStateEnhancer]);
 
   const {
     setHighlightedIndex,

packages/autocomplete-core/src/createStore.ts

@@ -1,42 +1,39 @@
-import { getCompletion } from './getCompletion';
 import {
-  InternalAutocompleteOptions,
   AutocompleteState,
   AutocompleteStore,
+  InternalAutocompleteOptions,
   Reducer,
+  StateEnhancer,
 } from './types';
 
 export function createStore<TItem>(
   reducer: Reducer,
-  props: InternalAutocompleteOptions<TItem>
+  props: InternalAutocompleteOptions<TItem>,
+  stateEnhancers: Array<StateEnhancer<TItem>>
 ): AutocompleteStore<TItem> {
-  let state = props.initialState;
+  function enhanceState(state: AutocompleteState<TItem>) {
+    return stateEnhancers.reduce(
+      (nextState, stateEnhancer) => stateEnhancer(nextState, props),
+      state
+    );
+  }
+
+  let state = enhanceState(props.initialState);
 
   return {
     getState() {
       return state;
     },
     send(action, payload) {
-      state = withCompletion(
+      state = enhanceState(
         reducer(state, {
           type: action,
           props,
           payload,
-        }),
-        props
+        })
       );
 
       props.onStateChange({ state });
     },
   };
 }
-
-function withCompletion<TItem>(
-  state: AutocompleteState<TItem>,
-  props: InternalAutocompleteOptions<TItem>
-) {
-  return {
-    ...state,
-    completion: getCompletion({ state, props }),
-  };
-}

packages/autocomplete-core/src/types/store.ts

@@ -35,3 +35,8 @@ type ActionType =
   | 'mousemove'
   | 'mouseleave'
   | 'click';
+
+export type StateEnhancer<TItem> = (
+  state: AutocompleteState<TItem>,
+  props: InternalAutocompleteOptions<TItem>
+) => AutocompleteState<TItem>;