fix: moile wallet

src/App.tsx

@@ -158,7 +158,7 @@ function App() {
 
             <div className="flex items-center gap-4">
               <ActiveAccount />
-              <ConnectWallet />
+              {isMobile() ? null : <ConnectWallet />}
 
               <div className="hidden lg:flex items-center">
                 {/* <ThemeSwitch mode="btn" network={network.name} onThemeChange={setTheme} /> */}

src/components/widget/account/ActiveAccount.tsx

@@ -4,11 +4,13 @@ import React, { CSSProperties, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { CopyToClipboard } from 'react-copy-to-clipboard';
 import { delay, of } from 'rxjs';
+import isMobile from 'is-mobile';
 import { useApi, useWallet, useAccount } from '../../../hooks';
 import { toShortAddress } from '../../../utils';
 import { ViewBrowserIcon, CopyIcon } from '../../icons';
 import { SHORT_DURATION, SEARCH_PARAMS_SOURCE } from '../../../config';
 import { AccountName } from '../account/AccountName';
+import { IdentAccountName } from '../account/IdentAccountName';
 import { Account } from '../../../model';
 import { AccountSelector } from './AccountSelector';
 
@@ -50,6 +52,7 @@ function AccountWithNetwork({
   );
 }
 
+// eslint-disable-next-line complexity
 export const ActiveAccount = () => {
   const { network } = useApi();
   const { walletToUse } = useWallet();
@@ -66,7 +69,9 @@ export const ActiveAccount = () => {
     }
   }, [isCopied]);
 
-  if (!walletToUse) {
+  if (isMobile()) {
+    return account ? <IdentAccountName account={account.displayAddress} iconSize={18} /> : null;
+  } else if (!walletToUse) {
     return null;
   }
 

src/providers/account.tsx

@@ -1,5 +1,6 @@
 import { createContext, useEffect, useState, useCallback } from 'react';
 import keyring from '@polkadot/ui-keyring';
+import isMobile from 'is-mobile';
 import { useAssets, useWallet } from '../hooks';
 import { Asset, Account } from '../model';
 import { readStorage, updateStorage } from '../utils';
@@ -37,7 +38,7 @@ export const AccountProvider = ({ children }: React.PropsWithChildren<unknown>)
     const storageAccount = accounts.find(({ address }) => address === storageAddress);
     const readOnlyAccount = accounts.find(({ meta }) => meta.source === SEARCH_PARAMS_SOURCE);
 
-    setAccount(readOnlyAccount ?? storageAccount);
+    setAccount(readOnlyAccount ?? storageAccount ?? (isMobile() ? accounts[0] : null));
   }, [accounts]);
 
   useEffect(() => {

src/providers/wallet.tsx

@@ -3,7 +3,9 @@ import type { Signer as InjectedSigner } from '@polkadot/api/types';
 import { accounts as accountsObs } from '@polkadot/ui-keyring/observable/accounts';
 import type { SubjectInfo } from '@polkadot/ui-keyring/observable/types';
 import type { Injected } from '@polkadot/extension-inject/types';
-import { from } from 'rxjs';
+import { web3Enable, web3Accounts } from '@polkadot/extension-dapp';
+import { from, switchMap, tap } from 'rxjs';
+import isMobile from 'is-mobile';
 import type { Wallet, Account, WalletSource } from '../model';
 import { DAPP_NAME, LOCAL_SOURCE, SEARCH_PARAMS_SOURCE, supportedWallets } from '../config';
 import { convertToSS58, isValidAddress, updateStorage, readStorage } from '../utils';
@@ -158,6 +160,36 @@ export const WalletProvider = ({ children }: PropsWithChildren<unknown>) => {
     }
   }, [walletToUse]);
 
+  useEffect(() => {
+    if (!isMobile()) {
+      return;
+    }
+
+    const sub$$ = from(web3Enable(DAPP_NAME))
+      .pipe(
+        tap((extensions) => {
+          if (extensions.length) {
+            setSigner(extensions[0].signer);
+          }
+        }),
+        switchMap(() => {
+          return from(web3Accounts());
+        })
+      )
+      .subscribe((accs) => {
+        setAccounts(
+          accs.map((acc) => ({
+            address: acc.address,
+            meta: acc.meta,
+            type: acc.type,
+            displayAddress: convertToSS58(acc.address, network.ss58Prefix),
+          }))
+        );
+      });
+
+    return () => sub$$.unsubscribe();
+  }, [network.ss58Prefix]);
+
   return (
     <WalletContext.Provider
       value={{