Skip to content

Instantly share code, notes, and snippets.

@csantiago132

csantiago132/provider.js

Last active February 25, 2020 01:52
Show Gist options
  • Save csantiago132/e1634d440708ee5fbbb05e4bba63180c to your computer and use it in GitHub Desktop.
Save csantiago132/e1634d440708ee5fbbb05e4bba63180c to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. csantiago132 revised this gist Feb 25, 2020. 1 changed file with 9 additions and 1 deletion.
    10 changes: 9 additions & 1 deletion provider.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,8 @@
    // ... prev. code ommited
    import * as React from 'react';
    import reducer from './path to the object containing the reducers/';
    import { combineReducer } from './path to combineReducer function';

    const AppStateProvider = React.createContext({});

    const ContextProvider = ({ children }) => {

    @@ -14,5 +18,9 @@ const ContextProvider = ({ children }) => {

    // pass in the returned value of useReducer
    const contextValue = React.useMemo(() => ({ state, dispatch }), [state, dispatch]);

    return <AppStateProvider.Provider value={contextValue}>{children}</AppStateProvider.Provider>;
    };

    export { ContextProvider, AppStateProvider as ContextConsumer };

  2. csantiago132 revised this gist Feb 25, 2020. No changes.
  3. csantiago132 revised this gist Feb 25, 2020. 1 changed file with 12 additions and 4 deletions.
    16 changes: 12 additions & 4 deletions provider.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,10 +1,18 @@
    // ... prev. code ommited

    const ContextProvider = ({ children }) => {
    const ContextProvider = ({ children }) => {

    const reducers = React.useCallback(() => {
    return combineReducer(reducer);
    }, [combineReducer]);
    return combineReducer(reducer);
    }, [combineReducer]);

    }
    // call the function to get initial state and global reducer
    const [initialState, mainReducer] = reducers();

    // setup useReducer with the returned value of the reducers function
    const [state, dispatch] = React.useReducer(mainReducer, initialState);

    // pass in the returned value of useReducer
    const contextValue = React.useMemo(() => ({ state, dispatch }), [state, dispatch]);
    };

  4. csantiago132 revised this gist Feb 25, 2020. 1 changed file with 7 additions and 6 deletions.
    13 changes: 7 additions & 6 deletions provider.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,9 +1,10 @@
    import * as React from 'react';
    import reducer from './path to the object containing the reducers/';
    import { combineReducer } from './path to combineReducer function';

    const AppStateProvider = React.createContext({});
    // ... prev. code ommited

    const ContextProvider = ({ children }) => {

    const reducers = React.useCallback(() => {
    return combineReducer(reducer);
    }, [combineReducer]);

    }

    }
  5. csantiago132 created this gist Feb 25, 2020.
    9 changes: 9 additions & 0 deletions provider.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,9 @@
    import * as React from 'react';
    import reducer from './path to the object containing the reducers/';
    import { combineReducer } from './path to combineReducer function';

    const AppStateProvider = React.createContext({});

    const ContextProvider = ({ children }) => {

    }