make chainId and account methods in wallet interface

packages/thirdweb/src/react/ui/ConnectWallet/Details.tsx

@@ -750,6 +750,7 @@ const ActiveDot = /* @__PURE__ */ StyledDiv(() => {
 });
 
 function ConnectedToSmartWallet() {
+  const activeAccount = useActiveAccount();
   const activeWallet = useActiveWallet();
   const chainId = useActiveWalletChainId();
   const locale = useTWLocale().connectWallet;
@@ -774,14 +775,14 @@ function ConnectedToSmartWallet() {
     </Container>
   );
 
-  if (chainId && activeWallet?.account && isSmartWallet) {
+  if (chainId && activeAccount && isSmartWallet) {
     return (
       <>
         {isSmartWalletDeployed ? (
           <Link
             color="secondaryText"
             hoverColor="primaryText"
-            href={`https://thirdweb.com/${chainId}/${activeWallet.account.address}/account`}
+            href={`https://thirdweb.com/${chainId}/${activeAccount.address}/account`}
             target="_blank"
             size="sm"
           >

packages/thirdweb/src/react/wallets/smartWallet/SmartWalletConnectUI.tsx

@@ -71,7 +71,7 @@ const SmartWalletConnecting = (props: {
 
   const [personalWalletChainId, setPersonalWalletChainId] = useState<
     bigint | undefined
-  >(personalWallet.chainId);
+  >(personalWallet.getChainId());
 
   useEffect(() => {
     function handleChainChanged(chain: string) {

packages/thirdweb/src/wallets/injected/index.ts

@@ -60,9 +60,9 @@ export function injectedWallet(options?: InjectedWalletOptions) {
  */
 export class InjectedWallet implements Wallet {
   metadata: Wallet["metadata"];
-  chainId: Wallet["chainId"];
+  private chainId: bigint | undefined;
+  private account?: Account | undefined;
   events: Wallet["events"];
-  account?: Account | undefined;
 
   // NOTE: can't use `#` notation unless we want to use `tslib` (which we don't because it adds overhead)
   private options?: InjectedWalletOptions;
@@ -98,6 +98,30 @@ export class InjectedWallet implements Wallet {
     };
   }
 
+  /**
+   * Get the `chainId` that the wallet is connected to.
+   * @returns The chainId
+   * @example
+   * ```ts
+   * const chainId = wallet.getChainId();
+   * ```
+   */
+  getChainId(): bigint | undefined {
+    return this.chainId;
+  }
+
+  /**
+   * Get the connected `Account` from the wallet.
+   * @returns The connected account
+   * @example
+   * ```ts
+   * const account = wallet.getAccount();
+   * ```
+   */
+  getAccount(): Account | undefined {
+    return this.account;
+  }
+
   /**
    * Auto connect to already connected wallet provider
    * @example

packages/thirdweb/src/wallets/interfaces/wallet.ts

@@ -21,17 +21,16 @@ export type Wallet = {
   connect: (options?: any) => Promise<Account>;
   autoConnect: (options?: any) => Promise<Account>;
   disconnect: () => Promise<void>;
+  getAccount(): Account | undefined;
+  getChainId(): bigint | undefined;
 
   // OPTIONAL
-  chainId?: bigint;
-
   events?: {
     addListener: WalletEventListener;
     removeListener: WalletEventListener;
   };
 
   switchChain?: (newChainId: bigint | number) => Promise<void>;
-  account?: Account;
 };
 
 export interface WalletWithPersonalWallet extends Wallet {

packages/thirdweb/src/wallets/manager/index.ts

@@ -78,7 +78,7 @@ export function createConnectionManager() {
   };
 
   const setActiveWallet = (wallet: Wallet) => {
-    const account = wallet.account;
+    const account = wallet.getAccount();
     if (!account) {
       throw new Error("Can not a wallet without an account as active");
     }
@@ -92,7 +92,7 @@ export function createConnectionManager() {
     // update active states
     activeWallet.setValue(wallet);
     activeAccount.setValue(account);
-    activeWalletChainId.setValue(wallet.chainId);
+    activeWalletChainId.setValue(wallet.getChainId());
     activeWalletConnectionStatus.setValue("connected");
 
     // setup listeners

packages/thirdweb/src/wallets/smart/index.ts

@@ -60,11 +60,12 @@ export const personalWalletToSmartAccountMap = new WeakMap<Wallet, Wallet>();
  */
 export class SmartWallet implements WalletWithPersonalWallet {
   private options: SmartWalletOptions;
+  private chainId?: bigint | undefined;
+  private account?: Account | undefined;
+
   personalWallet: Wallet | undefined;
   metadata: Wallet["metadata"];
-  chainId?: bigint | undefined;
   isSmartWallet: true;
-  account?: Account | undefined;
 
   /**
    * Create an instance of the SmartWallet.
@@ -81,6 +82,30 @@ export class SmartWallet implements WalletWithPersonalWallet {
     this.chainId = getChainIdFromChain(options.chain);
   }
 
+  /**
+   * Get the `chainId` that the wallet is connected to.
+   * @returns The chainId
+   * @example
+   * ```ts
+   * const chainId = wallet.getChainId();
+   * ```
+   */
+  getChainId(): bigint | undefined {
+    return this.chainId;
+  }
+
+  /**
+   * Get the connected `Account` from the wallet.
+   * @returns The connected account
+   * @example
+   * ```ts
+   * const account = wallet.getAccount();
+   * ```
+   */
+  getAccount(): Account | undefined {
+    return this.account;
+  }
+
   /**
    * Connect to the smart wallet using a personal account.
    * @param connectionOptions - The options for connecting to the smart wallet.
@@ -99,11 +124,13 @@ export class SmartWallet implements WalletWithPersonalWallet {
 
     const { personalWallet } = connectionOptions;
 
-    if (!personalWallet.account) {
+    const personalAccount = personalWallet.getAccount();
+
+    if (!personalAccount) {
       throw new Error("Personal wallet does not have an account");
     }
 
-    if (personalWallet.chainId !== chainId) {
+    if (personalWallet.getChainId() !== chainId) {
       throw new Error(
         "Personal account's wallet is on a different chain than the smart wallet.",
       );
@@ -119,7 +146,7 @@ export class SmartWallet implements WalletWithPersonalWallet {
 
     const account = await smartAccount({
       ...this.options,
-      personalAccount: personalWallet.account,
+      personalAccount: personalAccount,
     });
 
     personalWalletToSmartAccountMap.set(connectionOptions.personalWallet, this);

packages/thirdweb/src/wallets/wallet-connect/index.ts

@@ -89,11 +89,11 @@ export function walletConnect(options: WalletConnectCreationOptions) {
 export class WalletConnect implements Wallet {
   private options: WalletConnectCreationOptions;
   private provider: InstanceType<typeof EthereumProvider> | undefined;
+  private chainId: bigint | undefined;
+  private account?: Account | undefined;
 
-  chainId: Wallet["chainId"];
   events: Wallet["events"];
   metadata: Wallet["metadata"];
-  account?: Account | undefined;
 
   /**
    * Create a new WalletConnect instance to connect to a wallet using WalletConnect protocol.
@@ -111,6 +111,30 @@ export class WalletConnect implements Wallet {
     this.metadata = options?.metadata || walletConnectMetadata;
   }
 
+  /**
+   * Get the `chainId` that the wallet is connected to.
+   * @returns The chainId
+   * @example
+   * ```ts
+   * const chainId = wallet.getChainId();
+   * ```
+   */
+  getChainId(): bigint | undefined {
+    return this.chainId;
+  }
+
+  /**
+   * Get the connected `Account` from the wallet.
+   * @returns The connected account
+   * @example
+   * ```ts
+   * const account = wallet.getAccount();
+   * ```
+   */
+  getAccount(): Account | undefined {
+    return this.account;
+  }
+
   /**
    * Auto connect to already connected wallet connect session.
    * @example