('');
+ const [selectedChainId, setSelectedChainId] = useState('0xcd8690dc');
+ const [open, setOpen] = useState(false);
+ const [signMessage, setSignMessage] = useState('Hello, Adapter');
+ const [signedMessage, setSignedMessage] = useState('');
+ const adapter = useMemo(() => new BitKeepAdapter({
+ openUrlWhenWalletNotFound: false,
+ checkTimeout: 3000
+ }), []);
+
+ useEffect(() => {
+ setConnectState(adapter.state);
+ setAccount(adapter.address || '');
+ setReadyState(adapter.readyState);
+ adapter.network().then(async (res) => {
+ console.log(res);
+ setChainId(res.chainId);
+ const balance = await tronWeb.trx.getBalance(adapter.address)
+ }).catch(e => {
+ console.log(e)
+ })
+
+ adapter.on('readyStateChanged', async () => {
+ console.log('readyState: ', adapter.readyState)
+ setReadyState(adapter.readyState)
+ setConnectState(adapter.state)
+ })
+ adapter.on('connect', () => {
+ console.log('connect: ', adapter.address);
+ setAccount(adapter.address || '');
+ setConnectState(AdapterState.Connected)
+ adapter.network().then((res) => {
+ console.log(res);
+ setChainId(res.chainId)
+ }).catch(e => {
+ console.log(e)
+ })
+ });
+ adapter.on('accountsChanged', (data, preaddr) => {
+ console.log('accountsChanged: current', data,' pre: ', preaddr);
+ setAccount(data as string);
+ });
+
+ adapter.on('chainChanged', (data) => {
+ console.log('chainChanged: ', data);
+ setChainId((data as any).chainId);
+ });
+
+ adapter.on('disconnect', () => {
+ console.log('disconnect');
+ setConnectState(AdapterState.Disconnect)
+ setAccount(adapter.address || '');
+ });
+
+ return () => {
+ adapter.removeAllListeners();
+ };
+ }, [adapter]);
+
+ // function onSwitchChain() {
+ // adapter.switchChain(selectedChainId);
+ // }
+
+ async function onSignTransaction() {
+ const tronWeb = (window as any).tronWeb as any;
+ console.log(adapter.address)
+ const transaction = await tronWeb.transactionBuilder.sendTrx(receiver, tronWeb.toSun(0.001), adapter.address);
+ console.log('before signtransaction')
+ const signedTransaction = await adapter.signTransaction(transaction);
+ // const signedTransaction = await tronWeb.trx.sign(transaction);
+ console.log('after signtransaction')
+ const res = await tronWeb.trx.sendRawTransaction(signedTransaction);
+ setOpen(true);
+ }
+
+ const onSignMessage = useCallback(
+ async function () {
+ const res = await adapter.signMessage(signMessage);
+ setSignedMessage(res);
+ },
+ [adapter, signMessage, setSignedMessage]
+ );
+
+ const onVerifyMessage = useCallback(
+ async function () {
+ const address = await tronWeb.trx.verifyMessage(tronWeb.toHex(signMessage), signedMessage);
+ alert(address === adapter.address ? 'success verify' : 'failed verify');
+ },
+ [signMessage, signedMessage, adapter]
+ );
+
+ async function handleConnect() {
+ try {
+ await adapter?.connect()
+ } catch(e: any) {
+ console.log(e.error?.message || e.message);
+ }
+ }
+ return (
+
+ BitKeep Demo
+
+ Your account address:
+
+ {account}
+
+
+ Current network you choose: {chainId}
+
+
+
+ ReadyState: {readyState}
+
+
+ Current connection status:
+ {connectState}
+
+
+ setSignMessage(e.target.value)}>
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {open && (
+ setOpen(false)} severity="success" sx={{ width: '100%', marginTop: 1 }}>
+ Success! You can confirm your transfer on{' '}
+
+ Tron Scan
+
+
+ )}
+ {/*
+
+ */}
+ {/* */}
+
+ );
+}
+
+export function Detail(props: { children: ReactNode }) {
+ return {props.children}
;
+}
+
+function MultiSignDemo(props: { address: string; adapter: Adapter }) {
+ const [address1, setAddress1] = useState('');
+ const [open, setOpen] = useState(false);
+
+ const [transferTransaction, setTransferTransaction] = useState(null);
+ const [canSend, setCanSend] = useState(false);
+
+ const multiSignWithAddress1 = useCallback(
+ async function () {
+ const tronWeb = (window as any).tronWeb1 as any;
+ const transaction = await tronWeb.transactionBuilder.sendTrx(receiver, tronWeb.toSun(0.1), props.address, { permissionId: 2 });
+ // debugger;
+ console.log('before multiSign', transaction)
+ const signedTransaction = await props.adapter.multiSign(transaction, null, 2);
+ console.log('after multiSign', signedTransaction)
+ setTransferTransaction(signedTransaction);
+ },
+ [props.adapter, setTransferTransaction, props.address]
+ );
+ async function broadcast() {
+ const res = await tronWeb.trx.broadcast(transferTransaction);
+ setOpen(true);
+ }
+ return (
+ <>
+ MultiSign Demo
+ {/* You can input two address and click approve button to give them permission.
+
+ setAddress1(e.target.value)}>
+
+
*/}
+
+ You can click following buttons to multiSign and send the Transaction
+
+
+ {/* */}
+
+
+ {open && (
+ setOpen(false)} severity="success" sx={{ width: '100%', marginTop: 1 }}>
+ Success! You can confirm your transfer on{' '}
+
+ Tron Scan
+
+
+ )}
+
+ );
+}
diff --git a/demos/dev-demo/src/OkxWalletAdapterDemo.tsx b/demos/dev-demo/src/OkxWalletAdapterDemo.tsx
new file mode 100644
index 0000000..a382849
--- /dev/null
+++ b/demos/dev-demo/src/OkxWalletAdapterDemo.tsx
@@ -0,0 +1,274 @@
+import type { ReactNode } from 'react';
+import { useEffect, useMemo, useState, useCallback } from 'react';
+// import './App.css';
+import { OkxWalletAdapter } from '@tronweb3/tronwallet-adapters';
+import type { Adapter } from '@tronweb3/tronwallet-abstract-adapter';
+import { AdapterState } from '@tronweb3/tronwallet-abstract-adapter';
+import { Box, Button, Typography, Tooltip, Select, MenuItem, Alert, FormControl, TextField } from '@mui/material';
+import { tronWeb } from './tronweb.js';
+const receiver = 'TMDKznuDWaZwfZHcM61FVFstyYNmK6Njk1';
+const getTronWeb = () => window.okxwallet?.tronLink?.tronWeb as any || null;
+// const getTronWeb = () => tronWeb;
+
+export function OkxWalletAdapterDemo() {
+ const [connectState, setConnectState] = useState(AdapterState.NotFound);
+ const [account, setAccount] = useState('');
+ const [readyState, setReadyState] = useState('');
+ const [chainId, setChainId] = useState('');
+ const [selectedChainId, setSelectedChainId] = useState('0xcd8690dc');
+ const [open, setOpen] = useState(false);
+ const [signMessage, setSignMessage] = useState('Hello, Adapter');
+ const [signedMessage, setSignedMessage] = useState('');
+ const adapter = useMemo(() => new OkxWalletAdapter(), []);
+
+ useEffect(() => {
+ setConnectState(adapter.state);
+ setAccount(adapter.address || '');
+ setReadyState(adapter.readyState);
+ if (adapter.connected) {
+ adapter.network().then((res) => {
+ console.log(res);
+ setChainId(res.chainId)
+ }).catch(e => {
+ console.log(e)
+ })
+ }
+
+ adapter.on('readyStateChanged', () => {
+ console.log('readyState: ', adapter.readyState)
+ setReadyState(adapter.readyState)
+ })
+ adapter.on('connect', () => {
+ console.log('connect: ', adapter.address);
+ setAccount(adapter.address || '');
+ adapter.network().then((res) => {
+ console.log(res);
+ setChainId(res.chainId)
+ }).catch(e => {
+ console.log(e)
+ })
+ });
+ adapter.on('stateChanged', (state) => {
+ console.log('stateChanged: ', state);
+ setConnectState(state);
+ });
+ adapter.on('accountsChanged', (data, preaddr) => {
+ console.log('accountsChanged: current', data,' pre: ', preaddr);
+ setAccount(data as string);
+ });
+
+ adapter.on('chainChanged', (data) => {
+ console.log('chainChanged: ', data);
+ setChainId((data as any).chainId);
+ });
+
+ adapter.on('disconnect', () => {
+ console.log('disconnect');
+ });
+
+ return () => {
+ adapter.removeAllListeners();
+ };
+ }, [adapter]);
+
+ function onSwitchChain() {
+ adapter.switchChain(selectedChainId);
+ }
+
+ async function onSignTransaction() {
+ const tronWeb = getTronWeb();
+ const transaction = await tronWeb.transactionBuilder.sendTrx(receiver, tronWeb.toSun(0.001), adapter.address);
+ const signedTransaction = await adapter.signTransaction(transaction);
+ console.log('signedTx', signedTransaction)
+
+ // const signedTransaction = await tronWeb.trx.sign(transaction);
+ const res = await tronWeb.trx.sendRawTransaction(signedTransaction);
+ setOpen(true);
+ }
+
+ const onSignMessage = useCallback(
+ async function () {
+ const res = await adapter.signMessage(signMessage);
+ setSignedMessage(res);
+ },
+ [adapter, signMessage, setSignedMessage]
+ );
+
+ const onVerifyMessage = useCallback(
+ async function () {
+ const tronWeb = getTronWeb();
+ const address = await tronWeb.trx.verifyMessageV2(signMessage, signedMessage);
+ alert(address === adapter.address ? 'success verify' : 'failed verify');
+ },
+ [signMessage, signedMessage, adapter]
+ );
+
+ async function handleConnect() {
+ try {
+ await adapter?.connect()
+ } catch(e: any) {
+ console.log(e.error?.message || e.message);
+ }
+ }
+ return (
+
+ OkxWallet Demo
+
+ Your account address:
+
+ {account}
+
+
+ Current network you choose: {chainId}
+
+
+
+ ReadyState: {readyState}
+
+
+ Current connection status:
+ {connectState}
+
+
+ setSignMessage(e.target.value)}>
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {open && (
+ setOpen(false)} severity="success" sx={{ width: '100%', marginTop: 1 }}>
+ Success! You can confirm your transfer on{' '}
+
+ Tron Scan
+
+
+ )}
+
+
+ );
+}
+
+export function Detail(props: { children: ReactNode }) {
+ return {props.children}
;
+}
+
+function MultiSignDemo(props: { address: string; adapter: Adapter }) {
+ const [address1, setAddress1] = useState('');
+ const [open, setOpen] = useState(false);
+
+ async function onApprove() {
+ const tronWeb = getTronWeb();
+ const ownerAddress = tronWeb.address.toHex(props.address);
+ const ownerPermission = {
+ type: 0,
+ permission_name: 'owner',
+ threshold: 1,
+ keys: [
+ {
+ address: ownerAddress,
+ weight: 1,
+ },
+ ],
+ };
+ const activePermission = {
+ type: 2,
+ permission_name: 'ActivePermission',
+ threshold: 2,
+ keys: [],
+ operations: '7fff1fc0037e0000000000000000000000000000000000000000000000000000',
+ } as any;
+
+ activePermission.keys.push({ address: ownerAddress, weight: 1 });
+ activePermission.keys.push({ address: tronWeb.address.toHex(address1), weight: 1 });
+
+ const updateTransaction = await tronWeb.transactionBuilder.updateAccountPermissions(ownerAddress, ownerPermission, null, [activePermission]);
+ const signed = await props.adapter.signTransaction(updateTransaction);
+ const res = await tronWeb.trx.sendRawTransaction(signed);
+ alert('update successfully.');
+ }
+
+ const [transferTransaction, setTransferTransaction] = useState(null);
+ const [canSend, setCanSend] = useState(false);
+
+ const multiSignWithAddress1 = useCallback(
+ async function () {
+ const tronWeb = getTronWeb();
+ const transaction = await tronWeb.transactionBuilder.sendTrx(receiver, tronWeb.toSun(0.1), props.address, { permissionId: 2 });
+ const signedTransaction = await props.adapter.multiSign(transaction, null, 2);
+ setTransferTransaction(signedTransaction);
+ },
+ [props.adapter, setTransferTransaction, props.address]
+ );
+ const multiSignWithAddress2 = useCallback(
+ async function () {
+ console.log('first multi signed tx:', transferTransaction);
+ const signedTransaction = await props.adapter.multiSign(transferTransaction as any, null, 2);
+ console.log('second multi signed tx:', signedTransaction);
+ setTransferTransaction(signedTransaction);
+ const tronWeb = getTronWeb();
+ const signWeight = await tronWeb.trx.getSignWeight(signedTransaction, 2);
+ console.log('signWeight: ', signWeight);
+ if (signWeight.current_weight >= 2) {
+ setCanSend(true);
+ }
+ },
+ [transferTransaction, setTransferTransaction, setCanSend, props.adapter]
+ );
+ async function broadcast() {
+ const tronWeb = getTronWeb();
+ const res = await tronWeb.trx.broadcast(transferTransaction);
+ setOpen(true);
+ }
+ return (
+ <>
+ MultiSign Demo
+ {/* You can input two address and click approve button to give them permission.
+
+ setAddress1(e.target.value)}>
+
+
*/}
+
+ You can click following buttons to multiSign and send the Transaction
+
+
+
+
+
+ {open && (
+ setOpen(false)} severity="success" sx={{ width: '100%', marginTop: 1 }}>
+ Success! You can confirm your transfer on{' '}
+
+ Tron Scan
+
+
+ )}
+
+ );
+}
diff --git a/demos/dev-demo/src/TokenPocketAdapterDemo.tsx b/demos/dev-demo/src/TokenPocketAdapterDemo.tsx
new file mode 100644
index 0000000..f66eee2
--- /dev/null
+++ b/demos/dev-demo/src/TokenPocketAdapterDemo.tsx
@@ -0,0 +1,245 @@
+import type { ReactNode } from 'react';
+import { useEffect, useMemo, useState, useCallback } from 'react';
+// import './App.css';
+import type { Adapter } from '@tronweb3/tronwallet-abstract-adapter';
+import { AdapterState } from '@tronweb3/tronwallet-abstract-adapter';
+import { TokenPocketAdapter } from '@tronweb3/tronwallet-adapter-tokenpocket';
+import { Box, Button, Typography, Tooltip, Select, MenuItem, Alert, FormControl, TextField } from '@mui/material';
+import { tronWeb } from './tronweb.js';
+const receiver = 'TMDKznuDWaZwfZHcM61FVFstyYNmK6Njk1';
+
+export function TokenPocketAdapterDemo() {
+ const [connectState, setConnectState] = useState(AdapterState.NotFound);
+ const [account, setAccount] = useState('');
+ const [readyState, setReadyState] = useState('');
+ const [chainId, setChainId] = useState('');
+ const [selectedChainId, setSelectedChainId] = useState('0xcd8690dc');
+ const [open, setOpen] = useState(false);
+ const [signMessage, setSignMessage] = useState('Hello, Adapter');
+ const [signedMessage, setSignedMessage] = useState('');
+ const adapter = useMemo(() => new TokenPocketAdapter({
+ openAppWithDeeplink: true,
+ openUrlWhenWalletNotFound: false,
+ checkTimeout: 3000
+ }), []);
+
+ useEffect(() => {
+ setConnectState(adapter.state);
+ setAccount(adapter.address || '');
+ setReadyState(adapter.readyState);
+ adapter.network().then(async (res) => {
+ console.log(res);
+ setChainId(res.chainId);
+ const balance = await tronWeb.trx.getBalance(adapter.address)
+ }).catch(e => {
+ console.log(e)
+ })
+
+ adapter.on('readyStateChanged', async () => {
+ console.log('readyState: ', adapter.readyState)
+ setReadyState(adapter.readyState)
+ })
+ adapter.on('connect', () => {
+ console.log('connect: ', adapter.address);
+ setAccount(adapter.address || '');
+ setConnectState(AdapterState.Connected)
+ adapter.network().then((res) => {
+ console.log(res);
+ setChainId(res.chainId)
+ }).catch(e => {
+ console.log(e)
+ })
+ });
+ adapter.on('accountsChanged', (data, preaddr) => {
+ console.log('accountsChanged: current', data,' pre: ', preaddr);
+ setAccount(data as string);
+ });
+
+ adapter.on('chainChanged', (data) => {
+ console.log('chainChanged: ', data);
+ setChainId((data as any).chainId);
+ });
+
+ adapter.on('disconnect', () => {
+ console.log('disconnect');
+ setConnectState(AdapterState.Disconnect)
+ });
+
+ return () => {
+ adapter.removeAllListeners();
+ };
+ }, [adapter]);
+
+ // function onSwitchChain() {
+ // adapter.switchChain(selectedChainId);
+ // }
+
+ async function onSignTransaction() {
+ const tronWeb = (window as any).tronWeb1 as any;
+ console.log(adapter.address)
+ const transaction = await tronWeb.transactionBuilder.sendTrx(receiver, tronWeb.toSun(0.1), adapter.address);
+ console.log('before signtransaction')
+ const signedTransaction = await adapter.signTransaction(transaction);
+ // const signedTransaction = await tronWeb.trx.sign(transaction);
+ console.log('after signtransaction')
+ const res = await tronWeb.trx.sendRawTransaction(signedTransaction);
+ setOpen(true);
+ }
+
+ const onSignMessage = useCallback(
+ async function () {
+ const res = await adapter.signMessage(signMessage);
+ setSignedMessage(res);
+ },
+ [adapter, signMessage, setSignedMessage]
+ );
+
+ const onVerifyMessage = useCallback(
+ async function () {
+ const address = await tronWeb.trx.verifyMessage(tronWeb.toHex(signMessage), signedMessage);
+ alert(address === adapter.address ? 'success verify' : 'failed verify');
+ },
+ [signMessage, signedMessage, adapter]
+ );
+
+ async function handleConnect() {
+ try {
+ await adapter?.connect()
+ } catch(e: any) {
+ console.log(e.error?.message || e.message);
+ }
+ }
+ return (
+
+ TokenPocket Demo
+
+ Your account address:
+
+ {account}
+
+
+ Current network you choose: {chainId}
+
+
+
+ ReadyState: {readyState}
+
+
+ Current connection status:
+ {connectState}
+
+
+ setSignMessage(e.target.value)}>
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {open && (
+ setOpen(false)} severity="success" sx={{ width: '100%', marginTop: 1 }}>
+ Success! You can confirm your transfer on{' '}
+
+ Tron Scan
+
+
+ )}
+ {/*
+
+ */}
+ {/* */}
+
+ );
+}
+
+export function Detail(props: { children: ReactNode }) {
+ return {props.children}
;
+}
+
+function MultiSignDemo(props: { address: string; adapter: Adapter }) {
+ const [address1, setAddress1] = useState('');
+ const [open, setOpen] = useState(false);
+
+ const [transferTransaction, setTransferTransaction] = useState(null);
+ const [canSend, setCanSend] = useState(false);
+
+ const multiSignWithAddress1 = useCallback(
+ async function () {
+ const tronWeb = (window as any).tronWeb1 as any;
+ const transaction = await tronWeb.transactionBuilder.sendTrx(receiver, tronWeb.toSun(0.1), props.address, { permissionId: 2 });
+ // debugger;
+ console.log('before multiSign', transaction)
+ const signedTransaction = await props.adapter.multiSign(transaction, null, 2);
+ console.log('after multiSign', signedTransaction)
+ setTransferTransaction(signedTransaction);
+ },
+ [props.adapter, setTransferTransaction, props.address]
+ );
+ async function broadcast() {
+ const res = await tronWeb.trx.broadcast(transferTransaction);
+ setOpen(true);
+ }
+ return (
+ <>
+ MultiSign Demo
+ {/* You can input two address and click approve button to give them permission.
+
+ setAddress1(e.target.value)}>
+
+
*/}
+
+ You can click following buttons to multiSign and send the Transaction
+
+
+ {/* */}
+
+
+ {open && (
+ setOpen(false)} severity="success" sx={{ width: '100%', marginTop: 1 }}>
+ Success! You can confirm your transfer on{' '}
+
+ Tron Scan
+
+
+ )}
+
+ );
+}
diff --git a/demos/dev-demo/src/TronLinkAdapterDemo.tsx b/demos/dev-demo/src/TronLinkAdapterDemo.tsx
index 43ba1c4..668baf2 100644
--- a/demos/dev-demo/src/TronLinkAdapterDemo.tsx
+++ b/demos/dev-demo/src/TronLinkAdapterDemo.tsx
@@ -27,12 +27,14 @@ export function TronLinkAdapterDemo() {
setConnectState(adapter.state);
setAccount(adapter.address || '');
setReadyState(adapter.readyState);
- adapter.network().then((res) => {
- console.log(res);
- setChainId(res.chainId)
- }).catch(e => {
- console.log(e)
- })
+ if (adapter.connected) {
+ adapter.network().then((res) => {
+ console.log(res);
+ setChainId(res.chainId)
+ }).catch(e => {
+ console.log(e)
+ })
+ }
adapter.on('readyStateChanged', () => {
console.log('readyState: ', adapter.readyState)
@@ -64,6 +66,7 @@ export function TronLinkAdapterDemo() {
adapter.on('disconnect', () => {
console.log('disconnect');
+ setAccount(adapter.address || '')
});
return () => {
diff --git a/demos/dev-demo/src/main.tsx b/demos/dev-demo/src/main.tsx
index 2efce84..be5e831 100644
--- a/demos/dev-demo/src/main.tsx
+++ b/demos/dev-demo/src/main.tsx
@@ -10,6 +10,7 @@ import VConsole from 'vconsole';
import './index.css';
import { AppWraper } from './AppWraper.js';
const vConsole = new VConsole();
+// console.log('load', window.tronWeb?.defaultAddress, window.okxwallet?.tronLink.tronWeb.defaultAddress);
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
diff --git a/demos/dev-demo/src/tronweb.ts b/demos/dev-demo/src/tronweb.ts
index 9447019..5d2d428 100644
--- a/demos/dev-demo/src/tronweb.ts
+++ b/demos/dev-demo/src/tronweb.ts
@@ -3,5 +3,6 @@ import TronWeb from 'tronweb';
export const tronWeb: any = new TronWeb({
fullHost: 'https://api.nileex.io',
+ // fullHost: 'https://api.trongrid.io'
});
(window as any).tronWeb1 = tronWeb;
diff --git a/demos/dev-demo/vite.config.ts b/demos/dev-demo/vite.config.ts
index 36e00b7..349f423 100644
--- a/demos/dev-demo/vite.config.ts
+++ b/demos/dev-demo/vite.config.ts
@@ -18,6 +18,7 @@ export default defineConfig({
server: {
host: '0.0.0.0',
port: 3003,
+ https: false
},
build: {
minify: false,
diff --git a/demos/react-ui/create-react-app/package.json b/demos/react-ui/create-react-app/package.json
index 44f7a42..75f0233 100644
--- a/demos/react-ui/create-react-app/package.json
+++ b/demos/react-ui/create-react-app/package.json
@@ -33,8 +33,8 @@
"stream-http": "^3.2.0",
"tronweb": "^4.4.0",
"typescript": "^4.8.4",
- "web-vitals": "^2.1.4",
- "webpack": "^5.75.0"
+ "vconsole": "^3.15.0",
+ "web-vitals": "^2.1.4"
},
"scripts": {
"start": "GENERATE_SOURCEMAP=false react-app-rewired start",
@@ -59,5 +59,8 @@
"last 1 firefox version",
"last 1 safari version"
]
+ },
+ "devDependencies": {
+ "webpack": "^5.78.0"
}
}
diff --git a/demos/react-ui/create-react-app/src/App.tsx b/demos/react-ui/create-react-app/src/App.tsx
index 8711bc9..2f8706b 100644
--- a/demos/react-ui/create-react-app/src/App.tsx
+++ b/demos/react-ui/create-react-app/src/App.tsx
@@ -11,7 +11,7 @@ import {
} from '@tronweb3/tronwallet-adapter-react-ui';
import toast from 'react-hot-toast';
import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow, TextField, Alert } from '@mui/material';
-import { TronLinkAdapter } from '@tronweb3/tronwallet-adapters';
+import { BitKeepAdapter, OkxWalletAdapter, TokenPocketAdapter, TronLinkAdapter } from '@tronweb3/tronwallet-adapters';
import { WalletConnectAdapter } from '@tronweb3/tronwallet-adapter-walletconnect';
import { tronWeb } from './tronweb';
import { LedgerAdapter } from '@tronweb3/tronwallet-adapter-ledger';
@@ -38,8 +38,8 @@ export function App() {
} else toast.error(e.message);
}
const adapters = useMemo(function () {
- const tronLink1 = new TronLinkAdapter();
- const walletConnect1 = new WalletConnectAdapter({
+ const tronLinkAdapter = new TronLinkAdapter();
+ const walletConnectAdapter = new WalletConnectAdapter({
network: 'Nile',
options: {
relayUrl: 'wss://relay.walletconnect.com',
@@ -56,7 +56,10 @@ export function App() {
const ledger = new LedgerAdapter({
accountNumber: 2,
});
- return [tronLink1, walletConnect1, ledger];
+ const bitKeepAdapter = new BitKeepAdapter();
+ const tokenPocketAdapter = new TokenPocketAdapter();
+ const okxwalletAdapter = new OkxWalletAdapter();
+ return [tronLinkAdapter, bitKeepAdapter, tokenPocketAdapter, okxwalletAdapter, walletConnectAdapter, ledger];
}, []);
return (
diff --git a/demos/react-ui/create-react-app/src/index.tsx b/demos/react-ui/create-react-app/src/index.tsx
index 0ed992d..a8052dc 100644
--- a/demos/react-ui/create-react-app/src/index.tsx
+++ b/demos/react-ui/create-react-app/src/index.tsx
@@ -7,7 +7,9 @@ import reportWebVitals from './reportWebVitals';
import { Toaster } from 'react-hot-toast';
import { ThemeProvider } from '@mui/material/styles';
import theme from './theme';
+import vConsole from 'vconsole'
const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);
+new vConsole();
root.render(
diff --git a/demos/react-ui/next-app/package.json b/demos/react-ui/next-app/package.json
index e774eea..3e66982 100644
--- a/demos/react-ui/next-app/package.json
+++ b/demos/react-ui/next-app/package.json
@@ -13,9 +13,11 @@
"@emotion/styled": "^11.10.4",
"@mui/material": "^5.10.10",
"@tronweb3/tronwallet-abstract-adapter": "^1.1.0",
+ "@tronweb3/tronwallet-adapter-bitkeep": "^1.0.0",
"@tronweb3/tronwallet-adapter-ledger": "^1.1.1",
"@tronweb3/tronwallet-adapter-react-hooks": "^1.0.0",
"@tronweb3/tronwallet-adapter-react-ui": "^1.1.0",
+ "@tronweb3/tronwallet-adapter-tokenpocket": "^1.0.0",
"@tronweb3/tronwallet-adapters": "^1.1.1",
"@types/node": "18.11.9",
"@types/react": "18.0.26",
@@ -27,6 +29,7 @@
"react-dom": "^18.2.0",
"react-hot-toast": "^2.4.0",
"tronweb": "^4.4.0",
+ "tslib": "^2.5.0",
"typescript": "4.9.3"
},
"devDependencies": {
diff --git a/demos/react-ui/next-app/pages/_app.tsx b/demos/react-ui/next-app/pages/_app.tsx
index 43228bc..e80a9fa 100644
--- a/demos/react-ui/next-app/pages/_app.tsx
+++ b/demos/react-ui/next-app/pages/_app.tsx
@@ -4,12 +4,13 @@ import type { WalletError } from '@tronweb3/tronwallet-abstract-adapter';
import { WalletDisconnectedError, WalletNotFoundError } from '@tronweb3/tronwallet-abstract-adapter';
// @ts-ignore
import { toast } from 'react-hot-toast';
-import { TronLinkAdapter, WalletConnectAdapter } from '@tronweb3/tronwallet-adapters';
+import { BitKeepAdapter, OkxWalletAdapter, TokenPocketAdapter, TronLinkAdapter, WalletConnectAdapter } from '@tronweb3/tronwallet-adapters';
import { useMemo } from 'react';
import { WalletProvider } from '@tronweb3/tronwallet-adapter-react-hooks';
import { WalletModalProvider } from '@tronweb3/tronwallet-adapter-react-ui';
import '@tronweb3/tronwallet-adapter-react-ui/style.css';
import { LedgerAdapter } from '@tronweb3/tronwallet-adapter-ledger';
+
export default function App({ Component, pageProps }: AppProps) {
function onError(e: WalletError) {
if (e instanceof WalletNotFoundError) {
@@ -19,11 +20,11 @@ export default function App({ Component, pageProps }: AppProps) {
} else toast.error(e.message);
}
const adapters = useMemo(function () {
- const tronLink1 = new TronLinkAdapter();
+ const tronLinkAdapter = new TronLinkAdapter();
const ledger = new LedgerAdapter({
accountNumber: 2,
});
- const walletConnect1 = new WalletConnectAdapter({
+ const walletConnectAdapter = new WalletConnectAdapter({
network: 'Nile',
options: {
relayUrl: 'wss://relay.walletconnect.com',
@@ -37,7 +38,10 @@ export default function App({ Component, pageProps }: AppProps) {
},
},
});
- return [tronLink1, walletConnect1, ledger];
+ const bitKeepAdapter = new BitKeepAdapter();
+ const tokenPocketAdapter = new TokenPocketAdapter();
+ const okxwalletAdapter = new OkxWalletAdapter();
+ return [tronLinkAdapter, bitKeepAdapter, tokenPocketAdapter, okxwalletAdapter, walletConnectAdapter, ledger];
}, []);
/**
diff --git a/demos/react-ui/vite-app/index.html b/demos/react-ui/vite-app/index.html
index 81aefab..25063d3 100644
--- a/demos/react-ui/vite-app/index.html
+++ b/demos/react-ui/vite-app/index.html
@@ -5,9 +5,24 @@
Vite + React + TS
+
+