From 2492eeb962f911480f9aa2e466bdf5e530c37c8c Mon Sep 17 00:00:00 2001
From: Thiendekaco <thienguo@gmail.com>
Date: Mon, 26 Feb 2024 21:46:19 +0700
Subject: [PATCH] Resolve ui bug #3

---
 .../modal/selectors/NetworkSelector.tsx       |  5 ++-
 packages/demo/src/web3-onboard.ts             | 43 +++++++++++--------
 2 files changed, 29 insertions(+), 19 deletions(-)

diff --git a/packages/demo/src/components/modal/selectors/NetworkSelector.tsx b/packages/demo/src/components/modal/selectors/NetworkSelector.tsx
index 1a41c43ad..7caeb9391 100644
--- a/packages/demo/src/components/modal/selectors/NetworkSelector.tsx
+++ b/packages/demo/src/components/modal/selectors/NetworkSelector.tsx
@@ -7,6 +7,7 @@ import { NetworkItemType, Theme, ThemeProps} from '../../../types';
 import { GeneralEmptyList } from "../../empty";
 import { BaseSelectModal } from "../../modal";
 import {ScreenContext} from "../../../context/ScreenContext";
+import {useConnectWallet} from "@subwallet_connect/react";
 
 interface Props extends ThemeProps {
   items: NetworkItemType[];
@@ -20,7 +21,9 @@ function Component (props: Props): React.ReactElement<Props> {
   const { className = '', itemSelected, items, modalId, disabled, onSelectItem } = props;
   const { token } = useTheme() as Theme;
   const { isWebUI } = useContext(ScreenContext);
+  const [{ wallet},] = useConnectWallet();
   const renderEmpty = useCallback(() => <GeneralEmptyList />, []);
+  const isLedgerWallet = useMemo(()=>  wallet?.label === 'Ledger' && wallet?.type === 'substrate' , [])
   const renderChainSelected = useCallback((item: NetworkItemType) => {
     return (
       <>
@@ -72,7 +75,7 @@ function Component (props: Props): React.ReactElement<Props> {
     <BaseSelectModal
       className={`${className} network-selector-modal ${disabled && '-disabled'}`}
       id={modalId}
-      disabled={disabled}
+      disabled={disabled || isLedgerWallet}
       inputClassName={`${className} network-selector-input`}
       itemKey={'slug'}
       items={items}
diff --git a/packages/demo/src/web3-onboard.ts b/packages/demo/src/web3-onboard.ts
index 6f8fe2e9c..337c954c2 100644
--- a/packages/demo/src/web3-onboard.ts
+++ b/packages/demo/src/web3-onboard.ts
@@ -9,6 +9,8 @@ import talismanModule from '@subwallet_connect/talisman';
 import polkadot_jsModule from '@subwallet_connect/polkadot_js';
 import subwalletPolkadotModule from '@subwallet_connect/subwallet-polkadot';
 import polkadotVaultModule from '@subwallet_connect/polkadot-vault';
+import ledgerModule from '@subwallet_connect/ledger';
+import walletConnectModule from '@subwallet_connect/walletconnect';
 import {TransactionHandlerReturn} from "@subwallet_connect/core/dist/types";
 import { SubWallet } from "../assets";
 
@@ -50,7 +52,11 @@ const polkadotWallet = polkadot_jsModule();
 const subwalletPolkadotWalet = subwalletPolkadotModule();
 const talismanWallet = talismanModule();
 const polkadotVaultWallet = polkadotVaultModule();
-
+const ledger = ledgerModule({ projectId : '762e91498a11e0acc664cdd0fd2af181',   walletConnectVersion: 2 })
+const walletConnect = walletConnectModule({
+  projectId: '762e91498a11e0acc664cdd0fd2af181',
+  dappUrl: 'https://w3o-demo.subwallet.app/'
+})
 
 export default init({
   theme: "dark",
@@ -70,11 +76,13 @@ export default init({
 
   // An array of wallet modules that you would like to be presented to the user to select from when connecting a wallet.
   wallets: [
-    subwalletWallet,
     subwalletPolkadotWalet,
+    subwalletWallet,
     walletConnectPolkadot,
+    walletConnect,
     metamaskSDKWallet,
     ledgerPolkadot_,
+    ledger,
     talismanWallet,
     polkadotWallet,
     polkadotVaultWallet,
@@ -82,6 +90,13 @@ export default init({
   ],
   // An array of Chains that your app supports
   chains: [
+    {
+      id: '0x507',
+      rpcUrl: 'https://rpc.api.moonbase.moonbeam.network',
+      label: 'Moonbase Alpha',
+      token:  'DEV',
+      namespace : 'evm'
+    },
     {
       // hex encoded string, eg '0x1' for Ethereum Mainnet
       id: '0x1',
@@ -108,13 +123,6 @@ export default init({
       namespace: 'evm',
       token : 'MOVR'
     },
-    {
-      id: '0x507',
-      rpcUrl: 'https://rpc.api.moonbase.moonbeam.network',
-      label: 'Moonbase Alpha',
-      token:  'DEV',
-      namespace : 'evm'
-    },
     {
       id: '0x250',
       rpcUrl: 'https://astar.public.blastapi.io',
@@ -134,6 +142,14 @@ export default init({
 
 
   chainsPolkadot:[
+    {
+      id: '0xe143f23803ac50e8f6f8e62695d1ce9e4e1d68aa36c1cd2cfd15340213f3423e' ,
+      token: 'WND',
+      decimal : 12,
+      label: 'Westend',
+      rpcUrl: 'westend.subscan.io',
+      namespace: 'substrate'
+    },
     {
       // hex encoded string, eg '0x1' for Ethereum Mainnet
       id: '0x91b171bb158e2d3848fa23a9f1c25182fb8e20313b2c1eb49219da7a70ce90c3',
@@ -147,15 +163,6 @@ export default init({
       rpcUrl: `polkadot.api.subscan.io`,
       decimal: 10
     },
-    {
-      id: '0xe143f23803ac50e8f6f8e62695d1ce9e4e1d68aa36c1cd2cfd15340213f3423e' ,
-      token: 'WND',
-      decimal : 12,
-      label: 'Westend',
-      rpcUrl: 'westend.subscan.io',
-      namespace: 'substrate'
-    },
-
     {
       id: '0x68d56f15f85d3136970ec16946040bc1752654e906147f7e43e9d539d7c3de2f',
       label: 'Polkadot Asset Hub',