fix(solidr-front): simplify wallet provider

tchambard · Jul 21, 2024 · 142e871 · 142e871
1 parent 773cc1e
commit 142e871
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 56 deletions.
diff --git a/packages/fronts/solidr-front-dapp/src/components/provider/SolanaWalletProvider.tsx b/packages/fronts/solidr-front-dapp/src/components/provider/SolanaWalletProvider.tsx
@@ -10,14 +10,19 @@ import { createDefaultAddressSelector, createDefaultAuthorizationResultCache, cr
 import '@/assets/style/WalletAdapter.css';
 import { useSnackbar } from 'notistack';
 import { useRecoilValue } from 'recoil';
-import { walletState } from '@/store/wallet';
+import { Connection, clusterApiUrl } from '@solana/web3.js';
 
 type Props = {
     children: ReactNode;
 };
 
+
+export const network = WalletAdapterNetwork.Devnet;
+
 export default function SolanaWalletProvider({ children }: Props) {
-    const { network, endpoint } = useRecoilValue(walletState);
+
+    const endpoint = useMemo(() => clusterApiUrl(network), [network]);
+
     const wallets = useMemo(() => [
         new SolanaMobileWalletAdapter({
             addressSelector: createDefaultAddressSelector(),

diff --git a/packages/fronts/solidr-front-dapp/src/content/solidr/components/SolidrWrapper.tsx b/packages/fronts/solidr-front-dapp/src/content/solidr/components/SolidrWrapper.tsx
@@ -12,8 +12,8 @@ import {
 import { useTheme } from '@mui/material/styles';
 import { ReactNode, useEffect } from 'react';
 
-import { connection, txState, solidrClientState } from '@/store/wallet';
-import { useWallet } from '@solana/wallet-adapter-react';
+import { txState, solidrClientState } from '@/store/wallet';
+import { useConnection, useWallet } from '@solana/wallet-adapter-react';
 import { WalletMultiButton } from '@solana/wallet-adapter-react-ui';
 import { Solidr, SolidrClient } from '@solidr';
 import idl from '@solidr-idl';
@@ -26,6 +26,7 @@ interface IWalletContainerWrapperProps {
 
 export default ({ children }: IWalletContainerWrapperProps) => {
     const theme = useTheme();
+    const { connection } = useConnection();
     const xsDisplay = useMediaQuery(theme.breakpoints.down('sm'));
     const { t } = useTranslation();
     const { publicKey } = useWallet();

diff --git a/packages/fronts/solidr-front-dapp/src/layouts/default/DefaultHeader.tsx b/packages/fronts/solidr-front-dapp/src/layouts/default/DefaultHeader.tsx
@@ -8,12 +8,13 @@ import ColorModeChanger from '@/components/theme/ColorModeChanger';
 
 import { WalletMultiButton } from '@solana/wallet-adapter-react-ui';
 import { useEffect, useState } from 'react';
-import { useWallet } from '@solana/wallet-adapter-react';
-import { getSolanaBalance } from '@/store/wallet';
+import { useConnection, useWallet } from '@solana/wallet-adapter-react';
 import LanguageSwitcher from '@/components/LanguageSwitcher';
+import { LAMPORTS_PER_SOL } from '@solana/web3.js';
 
 export default function DefaultHeader() {
     const navigate = useNavigate();
+    const { connection } = useConnection();
     const theme = useTheme();
     const xsDisplay = useMediaQuery(theme.breakpoints.down('sm'));
     const { publicKey } = useWallet();
@@ -22,9 +23,7 @@ export default function DefaultHeader() {
 
     useEffect(() => {
         if (publicKey) {
-            getSolanaBalance(publicKey.toBase58()).then((balance) =>
-                setSolanaBalance(balance),
-            );
+            connection.getBalance(publicKey).then((balance) => setSolanaBalance(balance / LAMPORTS_PER_SOL));
         } else {
             setSolanaBalance(null);
         }

diff --git a/packages/fronts/solidr-front-dapp/src/store/wallet.ts b/packages/fronts/solidr-front-dapp/src/store/wallet.ts
@@ -1,58 +1,21 @@
 import { atom } from "recoil";
-import { WalletAdapterNetwork } from "@solana/wallet-adapter-base";
-import {
-  Connection,
-  LAMPORTS_PER_SOL,
-  PublicKey,
-  clusterApiUrl,
-} from "@solana/web3.js";
 import { SolidrClient } from "@solidr";
 
-type WalletState = {
-  network: WalletAdapterNetwork;
-  endpoint: string;
-  connection: Connection;
-};
-
 type TxState = {
-  pending: boolean;
-  error?: string;
+    pending: boolean;
+    error?: string;
 };
 
-export const network = WalletAdapterNetwork.Devnet;
-export const endpoint = clusterApiUrl(network);
-// export const endpoint = 'http://localhost:8899/';
-export const connection = new Connection(endpoint, "confirmed");
-
-export const walletState = atom<WalletState>({
-  key: "walletState",
-  default: {
-    network,
-    endpoint,
-    connection,
-  },
-  dangerouslyAllowMutability: true,
-});
-
 export const txState = atom<TxState>({
-  key: "txState",
-  default: {
-    pending: false,
-  },
-  dangerouslyAllowMutability: true,
+    key: "txState",
+    default: {
+        pending: false,
+    },
+    dangerouslyAllowMutability: true,
 });
 
 export const solidrClientState = atom<SolidrClient | undefined>({
-  key: "solidrClientState",
-  default: undefined,
-  dangerouslyAllowMutability: true,
+    key: "solidrClientState",
+    default: undefined,
+    dangerouslyAllowMutability: true,
 });
-
-export async function getSolanaBalance(publicKey: string): Promise<number> {
-  const balanceInLamports = await connection.getBalance(
-    new PublicKey(publicKey),
-  );
-  const balanceInSol = balanceInLamports / LAMPORTS_PER_SOL;
-
-  return balanceInSol;
-}