SHARE
TWEET

Untitled

a guest Apr 25th, 2019 55 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React from 'react';
  2. import { ThemeProvider } from 'styled-components';
  3.  
  4. import { themes } from './themes';
  5.  
  6. const reducer = (state, action) => {
  7.   switch (action.type) {
  8.     case `CHANGE_THEME`:
  9.       return {
  10.         ...state,
  11.         themeName: action.name,
  12.       };
  13.   }
  14. };
  15.  
  16. /**
  17.  * Create the context itself.
  18.  */
  19. const Context = React.createContext({});
  20.  
  21. /**
  22.  * The main Provider for making the App Context available throughout the app.
  23.  */
  24. const AppContextProvider = props => {
  25.   const [ state, dispatch ] = React.useReducer(reducer, {
  26.     themeName: `light`,
  27.   });
  28.  
  29.   const context: AppContext = React.useMemo(
  30.     () => ({ ...state, dispatch }),
  31.     [state]
  32.   );
  33.  
  34.   return (
  35.     <Context.Provider value={context}>
  36.       <ThemeProvider theme={themes[state.themeName]}>
  37.         {props.children}
  38.       </ThemeProvider>
  39.     </Context.Provider>
  40.   );
  41. };
  42.  
  43. /**
  44.  * Quick access to the App Context.
  45.  */
  46. const useAppContext = () => React.useContext(Context);
  47.  
  48. export {
  49.   AppContextProvider,
  50.   useAppContext,
  51. };
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top