From 4d3c6111897ef4a54b2984fc57b795198796ab68 Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Wed, 9 Sep 2020 15:46:10 +0200
Subject: [PATCH] create UserPreferencesProvider

---
 src/helpers/wrapRootElement.tsx   |  7 ++++--
 src/providers/UserPreferences.tsx | 41 +++++++++++++++++++++++++++++++
 2 files changed, 46 insertions(+), 2 deletions(-)
 create mode 100644 src/providers/UserPreferences.tsx

diff --git a/src/helpers/wrapRootElement.tsx b/src/helpers/wrapRootElement.tsx
index b98873d21..5000ccb90 100644
--- a/src/helpers/wrapRootElement.tsx
+++ b/src/helpers/wrapRootElement.tsx
@@ -8,6 +8,7 @@ import {
   ConfigHelperNetworkName,
   ConfigHelperNetworkId
 } from '@oceanprotocol/lib/dist/node/utils/ConfigHelper'
+import { UserPreferencesProvider } from '../providers/UserPreferences'
 
 export function getOceanConfig(
   network: ConfigHelperNetworkName | ConfigHelperNetworkId
@@ -30,8 +31,10 @@ export default function wrapRootElement({
       initialConfig={oceanInitialConfig}
       web3ModalOpts={web3ModalOpts}
     >
-      <NetworkMonitor />
-      {element}
+      <UserPreferencesProvider>
+        <NetworkMonitor />
+        {element}
+      </UserPreferencesProvider>
     </OceanProvider>
   )
 }
diff --git a/src/providers/UserPreferences.tsx b/src/providers/UserPreferences.tsx
new file mode 100644
index 000000000..1b0b8e7d1
--- /dev/null
+++ b/src/providers/UserPreferences.tsx
@@ -0,0 +1,41 @@
+import React, {
+  createContext,
+  useContext,
+  ReactElement,
+  ReactNode,
+  useState
+} from 'react'
+
+declare type Currency = 'eur' | 'usd'
+
+interface UserPreferencesValue {
+  debug: boolean
+  currency: Currency
+  setDebug: (value: boolean) => void
+  setCurrency: (value: string) => void
+}
+
+const UserPreferencesContext = createContext(null)
+
+function UserPreferencesProvider({
+  children
+}: {
+  children: ReactNode
+}): ReactElement {
+  const [debug, setDebug] = useState<boolean>(false)
+  const [currency, setCurrency] = useState<Currency>('eur')
+
+  return (
+    <UserPreferencesContext.Provider
+      value={{ debug, currency, setDebug, setCurrency } as UserPreferencesValue}
+    >
+      {children}
+    </UserPreferencesContext.Provider>
+  )
+}
+
+// Helper hook to access the provider values
+const useUserPreferences = (): UserPreferencesValue =>
+  useContext(UserPreferencesContext)
+
+export { UserPreferencesProvider, useUserPreferences, UserPreferencesValue }