Jahans3

return (
  <StateConsumer mapState={state => ({ greeting: state.greeting })} mapDispatch={dispatch => dispatch}>
    // ...

Jahans3

export function useStateProvider ({ initialState, reducers, middleware = [] }) {
  const [state, _dispatch] = useReducer((state, action) => {
    return reducers.reduce((state, reducer) => reducer(state, action) || state, state);
  }, initialState);

  function dispatch (action) {
    if (typeof action === 'function') {
      return action(dispatch, state);
    }

Jahans3

export class StateProvider extends React.PureComponent {
  static defaultProps = {
    state: {},
    reducers: [],
    middleware: []
  };

  state = this.props.state;

  _dispatch = action => {

Jahans3

const logIn = (email, password) => async dispatch => {
  dispatch({ type: 'LOG_IN_REQUEST' });

  try {
    const user = api.authenticateUser(email, password);
    dispatch({ type: 'LOG_IN_SUCCESS', payload: user });
  catch (error) {
    dispatch({ type: 'LOG_IN_ERROR', payload: error });
  }
};

Jahans3

export function StateProvider ({ state: initialState, reducers, middleware, children }) {
  const [state, dispatch] = useReducer((state, action) => {
    return reducers.reduce((state, reducer) => reducer(state, action) || state, state);
  }, initialState);

  return (
    <StateContext.Provider value={{ state, dispatch }}>
      {children}
    </StateContext.Provider>
  );

Jahans3

function countReducer ({ count, ...state }, { type, payload }) {
  switch (type) {
    case ADD_N:
      return { ...state, count: count + payload };
    case ADD_ONE:
      return { ...state, count: count + 1 };
  }
}

Jahans3

export class Provider extends React.PureComponent {
  static defaultProps = {
    state: {},
    reducers: []
  };

  state = this.props.state;

  _dispatch = action => {
    const { reducers } = this.props;

Jahans3

export function StateProvider ({ state: initialState, reducers, middleware, children }) {
  return (
    <StateContext.Provider value={useStateProvider({ initialState, reducers, middleware })}>
      {children}
    </StateContext.Provider>
  );
}

Jahans3

export default function SomeCount () {
  const [state, dispatch] = useStore();
  return (
    <>
      <p>
        Count: {state.count}
      </p>
      <button onClick={() => dispatch(addOne())}>
        + 1
      </button>

Jahans3

const StateContent = createContext();

export function useStore () {
  const { state, dispatch } = useContext(StateContext);
  return [state, dispatch];
}