From 81bddf0c5d5d6bcaf991c5f0b01e95f15caf281b Mon Sep 17 00:00:00 2001
From: Ilja <idaderko@gmail.com>
Date: Fri, 4 Feb 2022 12:01:08 +0200
Subject: [PATCH] Cleanup context

---
 .../src/components/PageHeader.tsx             |  6 ++++
 .../src/containers/GlobalLayout.tsx           | 30 +++++++++++--------
 .../src/contexts/AccountContext.tsx           |  0
 .../src/contexts/WalletContext.tsx            | 18 ++++++-----
 4 files changed, 34 insertions(+), 20 deletions(-)
 create mode 100644 wallets/react-wallet-v2/src/contexts/AccountContext.tsx

diff --git a/wallets/react-wallet-v2/src/components/PageHeader.tsx b/wallets/react-wallet-v2/src/components/PageHeader.tsx
index b6f92fe..b187271 100644
--- a/wallets/react-wallet-v2/src/components/PageHeader.tsx
+++ b/wallets/react-wallet-v2/src/components/PageHeader.tsx
@@ -1,9 +1,15 @@
 import { Text } from '@nextui-org/react'
 
+/**
+ * Types
+ */
 interface Props {
   children: string
 }
 
+/**
+ * Component
+ */
 export default function PageHeader({ children }: Props) {
   return (
     <Text
diff --git a/wallets/react-wallet-v2/src/containers/GlobalLayout.tsx b/wallets/react-wallet-v2/src/containers/GlobalLayout.tsx
index 3743af6..3ec69e4 100644
--- a/wallets/react-wallet-v2/src/containers/GlobalLayout.tsx
+++ b/wallets/react-wallet-v2/src/containers/GlobalLayout.tsx
@@ -2,27 +2,31 @@ import { WalletContext } from '@/contexts/WalletContext'
 import { Card, Container, Divider, Loading } from '@nextui-org/react'
 import { Fragment, ReactNode, useCallback, useContext, useEffect } from 'react'
 
+/**
+ * Types
+ */
 interface Props {
   children: ReactNode | ReactNode[]
 }
 
+/**
+ * Container
+ */
 export default function GlobalLayout({ children }: Props) {
-  const {
-    state: { initialized },
-    actions
-  } = useContext(WalletContext)
+  const { walletState, walletActions } = useContext(WalletContext)
+  const waletReady = walletState.ready
 
   const onInitialize = useCallback(async () => {
-    actions.createWallet()
-    await actions.createWalletConnectClient()
-    actions.setInitialized()
-  }, [actions])
+    walletActions.createWallet()
+    await walletActions.createWalletConnectClient()
+    walletActions.setInitialized()
+  }, [walletActions])
 
   useEffect(() => {
-    if (!initialized) {
+    if (!waletReady) {
       onInitialize()
     }
-  }, [initialized, onInitialize])
+  }, [waletReady, onInitialize])
 
   return (
     <Container
@@ -38,11 +42,11 @@ export default function GlobalLayout({ children }: Props) {
           height: '92vh',
           maxWidth: '600px',
           width: '100%',
-          justifyContent: initialized ? 'normal' : 'center',
-          alignItems: initialized ? 'normal' : 'center'
+          justifyContent: waletReady ? 'normal' : 'center',
+          alignItems: waletReady ? 'normal' : 'center'
         }}
       >
-        {initialized ? (
+        {waletReady ? (
           <Fragment>
             <Card.Header>Header</Card.Header>
             <Divider />
diff --git a/wallets/react-wallet-v2/src/contexts/AccountContext.tsx b/wallets/react-wallet-v2/src/contexts/AccountContext.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/wallets/react-wallet-v2/src/contexts/WalletContext.tsx b/wallets/react-wallet-v2/src/contexts/WalletContext.tsx
index 1553383..d13a8ef 100644
--- a/wallets/react-wallet-v2/src/contexts/WalletContext.tsx
+++ b/wallets/react-wallet-v2/src/contexts/WalletContext.tsx
@@ -7,7 +7,7 @@ import { createContext, ReactNode, useMemo, useState } from 'react'
  * Types
  */
 interface State {
-  initialized: boolean
+  ready: boolean
   wallet: Wallet
   walletConnectClient: WalletConnectClient
 }
@@ -19,8 +19,8 @@ interface Actions {
 }
 
 interface Context {
-  state: State
-  actions: Actions
+  walletState: State
+  walletActions: Actions
 }
 
 interface Props {
@@ -33,13 +33,13 @@ interface Props {
 export const WalletContext = createContext<Context>({} as Context)
 
 export function WalletContextProvider({ children }: Props) {
-  const [state, setState] = useState<State>({
-    initialized: false,
+  const [walletState, setState] = useState<State>({
+    ready: false,
     wallet: undefined,
     walletConnectClient: undefined
   })
 
-  const actions = useMemo(
+  const walletActions = useMemo(
     () => ({
       setInitialized() {
         setState(s => ({ ...s, initialized: true }))
@@ -70,5 +70,9 @@ export function WalletContextProvider({ children }: Props) {
     []
   )
 
-  return <WalletContext.Provider value={{ state, actions }}>{children}</WalletContext.Provider>
+  return (
+    <WalletContext.Provider value={{ walletState, walletActions }}>
+      {children}
+    </WalletContext.Provider>
+  )
 }