Add ThemeType

apps/contract-verification/src/app/AppContext.tsx

@@ -1,3 +1,9 @@
 import React from 'react'
+import {ThemeType} from './types'
 
-export const AppContext = React.createContext({})
+export const AppContext = React.createContext({
+  themeType: 'dark' as ThemeType,
+  setThemeType: (themeType: ThemeType) => {
+    console.log('Calling Set Theme Type')
+  },
+})

apps/contract-verification/src/app/app.tsx

@@ -3,10 +3,18 @@ import React, {useState, useEffect, useRef} from 'react'
 import {AppContext} from './AppContext'
 import DisplayRoutes from './routes'
 
+import {ThemeType} from './types'
+
 import './App.css'
 
 const App = () => {
-  return <DisplayRoutes />
+  const [themeType, setThemeType] = useState<ThemeType>('dark')
+
+  return (
+    <AppContext.Provider value={{themeType, setThemeType}}>
+      <DisplayRoutes />
+    </AppContext.Provider>
+  )
 }
 
 export default App

apps/contract-verification/src/app/components/NavMenu.tsx

@@ -27,13 +27,11 @@ const NavItem = ({to, icon, title}: NavItemProps) => {
 
 export const NavMenu = () => {
   return (
-    <div className="d-flex justify-content-between">
-      <div className="nav">
-        <NavItem to="/" icon={<i className="fas fa-home"></i>} title="Verify" />
-        <NavItem to="/receipts" icon={<i className="fas fa-home"></i>} title="Receipts" />
-        <NavItem to="/lookup" icon={<i className="fas fa-receipt"></i>} title="Lookup" />
-        <NavItem to="/settings" icon={<i className="fas fa-cog"></i>} title="Settings" />
-      </div>
-    </div>
+    <nav className="d-flex flex-row justify-content-between">
+      <NavItem to="/" icon={<i className="fas fa-home"></i>} title="Verify" />
+      <NavItem to="/receipts" icon={<i className="fas fa-receipt"></i>} title="Receipts" />
+      <NavItem to="/lookup" icon={<i className="fas fa-search"></i>} title="Lookup" />
+      <NavItem to="/settings" icon={<i className="fas fa-cog"></i>} title="Settings" />
+    </nav>
   )
 }