Creacion de contexto base

src/index.jsx

@@ -6,6 +6,8 @@ import './styles/reset.css';
 import './styles/main.scss';
 import './styles/tabs.scss';
 
+import {StateProvider} from "./services/State";
+
 import {Nav} from "./components/Nav";
 import {SearchBar} from "./components/SearchBar";
 import {ScrollToTopRouter} from "./components/ScrollToTop";
@@ -59,7 +61,23 @@ const App = () => (
     </main>
 );
 
+const AppWithState = () => {
+    const initialState = {theme: {primary: 'green'}};
+
+    const reducer = (state, action) => {
+        switch (action.type) {
+            default: return state;
+        }
+    };
+
+    return (
+        <StateProvider initialState={initialState} reducer={reducer}>
+            <App/>
+        </StateProvider>
+    );
+}
+
 ReactDOM.render(
-    <App/>,
+    <AppWithState/>,
     document.getElementById('root')
 );

src/services/State.jsx

@@ -0,0 +1,11 @@
+import React, {createContext, useContext, useReducer} from 'react';
+
+export const StateContext = createContext(null);
+
+export const StateProvider = ({reducer, initialState, children}) => (
+  <StateContext.Provider value={useReducer(reducer, initialState)}>
+    {children}
+  </StateContext.Provider>
+);
+
+export const useStateValue = () => useContext(StateContext);