Cleanup context

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

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 {
+  const { walletState, walletActions } = useContext(WalletContext)
-    state: { initialized },
+  const waletReady = walletState.ready
-    actions
-  } = useContext(WalletContext)
 
   const onInitialize = useCallback(async () => {
-    actions.createWallet()
+    walletActions.createWallet()
-    await actions.createWalletConnectClient()
+    await walletActions.createWalletConnectClient()
-    actions.setInitialized()
+    walletActions.setInitialized()
-  }, [actions])
+  }, [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',
+          justifyContent: waletReady ? 'normal' : 'center',
-          alignItems: initialized ? 'normal' : 'center'
+          alignItems: waletReady ? 'normal' : 'center'
         }}
       >
-        {initialized ? (
+        {waletReady ? (
           <Fragment>
             <Card.Header>Header</Card.Header>
             <Divider />

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
+  walletState: State
-  actions: Actions
+  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>({
+  const [walletState, setState] = useState<State>({
-    initialized: false,
+    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>
+  )
 }