Skip to content

Commit 9316a7c

Browse files
web3iocoreweb3iocore
authored
Merge pull request #42 from tronweb3/release/v1.2.8
Release/v1.2.8
2 parents 70f3cd4 + 1c807d9 commit 9316a7c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

55 files changed

+2210
-892
lines changed

‎README.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ This repository contains wallet adapters and components for Tron DApps. With out
1919
| |Browser Extension | >= 3.0.0 |
2020
| [TokenPocket](https://www.tokenpocket.pro/) | Android | >= 1.1.2 |
2121
| | IOS | >= 3.1.3 |
22-
| |Browser Extension | Not Support |
22+
| |Browser Extension | >= 2.0.3 |
2323
| [imToken](https://token.im/) | Android | >= 2.5.0 |
2424
| | IOS | >= 2.5.0 |
2525
| |Browser Extension | Not Support |
@@ -42,6 +42,8 @@ Follow these steps to support new wallets:
4242
1. List your wallet to [Tron Wallet](https://tron.network/wallet) .
4343
2. Open an issue in this repository or fork the repository and implement the according adapter.
4444

45+
### Tron Wallets Features Report
46+
Please refer to [this document](https://github.com/tronweb3/tronwallet-adapter-docs/blob/main/wallet-feature.md) to see the features of Tron wallets.
4547
## Introduction
4648

4749
### Adapters

‎demos/dev-demo/index.html

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,19 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6-
<title>Vite + React + TS</title>
7-
</head>
8-
<body>
9-
<div id="root"></div>
10-
<script type="module" src="/src/main.tsx"></script>
11-
</body>
12-
</html>
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
7+
<link rel="preconnect" href="https://fonts.googleapis.com" />
8+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
9+
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" />
10+
<link href="https://fonts.googleapis.com/css2?family=Wix+Madefor+Display:wght@700..800&display=swap" rel="stylesheet">
11+
<title>Tron WalletAdapter Basic Usage Example</title>
12+
</head>
13+
14+
<body>
15+
<div id="root"></div>
16+
<script type="module" src="/src/main.tsx"></script>
17+
</body>
18+
19+
</html>

‎demos/dev-demo/package.json

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,23 @@
11
{
22
"name": "dev-demo",
33
"private": true,
4-
"version": "0.0.2",
4+
"version": "0.0.3",
55
"type": "module",
66
"scripts": {
77
"dev": "vite --force",
88
"build": "tsc && vite build",
99
"preview": "vite preview",
10-
"ganache": "node scripts/ganache.cjs"
10+
"ganache": "node scripts/ganache.cjs",
11+
"build-pages": "vite build --base=/tronwallet-adapter"
1112
},
1213
"dependencies": {
1314
"@emotion/react": "^11.10.4",
1415
"@emotion/styled": "^11.10.4",
1516
"@ethersproject/properties": "^5.7.0",
1617
"@ethersproject/strings": "^5.7.0",
1718
"@metamask/eth-sig-util": "^6.0.0",
18-
"@mui/material": "^5.10.10",
19+
"@mui/icons-material": "^6.4.6",
20+
"@mui/material": "^6.4.8",
1921
"@noble/secp256k1": "1.7.1",
2022
"@tronweb3/abstract-adapter-evm": "latest",
2123
"@tronweb3/tronwallet-abstract-adapter": "latest",
@@ -45,7 +47,7 @@
4547
"@vitejs/plugin-react": "^4.2.1",
4648
"dotenv": "^16.3.1",
4749
"typescript": "^5.5.4",
48-
"vite": "^5.2.11",
50+
"vite": "latest",
4951
"vite-plugin-node-polyfills": "0.17.0"
5052
},
5153
"overrides": {

‎demos/dev-demo/src/AdapterBasicTest.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ export const AdapterBasicTest = memo(function AdapterBasicTest() {
117117
() =>
118118
adapters.map((adapter) => (
119119
<MenuItem value={adapter.name} key={adapter.name}>
120-
<Stack direction="row" spacing={2}>
120+
<Stack spacing={2}>
121121
<img src={adapter.icon} alt={adapter.name} style={{ width: 20, height: 20, marginRight: 8 }} />
122122
{adapter.name}
123123
</Stack>

‎demos/dev-demo/src/AdapterBasicUsage.tsx

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
import React from 'react';
2+
import { styled } from '@mui/material/styles';
3+
import AdapterSelect from './components/AdapterSelect';
4+
import ConnectionState from './components/ConnectionState';
5+
import { Button, Typography } from '@mui/material';
6+
import LinkIcon from './components/ConnectedIcon';
7+
import LinkOffIcon from './components/DisconnectedIcon';
8+
import { useWallet } from './components/WalletProvider';
9+
import SignUsage from './components/SignUsage';
10+
import SwitchChain from './components/SwitchChain';
11+
import BgImg from './images/bg.png';
12+
13+
const Container = styled('div')({
14+
height: '100vh',
15+
boxSizing: 'border-box',
16+
margin: '0',
17+
paddingTop: '100px',
18+
display: 'flex',
19+
flexDirection: 'column',
20+
background: `url(${BgImg}) no-repeat center bottom/100% 100%`,
21+
'@media (max-width: 780px)': {
22+
paddingTop: '50px',
23+
}
24+
});
25+
const Title = styled(Typography)({
26+
fontFamily: 'Wix Madefor Display, sans-serif',
27+
fontSize: '40px',
28+
fontWeight: 800,
29+
marginBottom: '20px',
30+
textAlign: 'center',
31+
color: 'rgba(7, 9, 76, 1)',
32+
});
33+
34+
const MainContent = styled('div')({
35+
width: '100%',
36+
maxWidth: '1200px',
37+
margin: '20px auto',
38+
display: 'flex',
39+
40+
"@media (max-width: 780px)": {
41+
flexDirection: 'column',
42+
alignItems: 'center',
43+
}
44+
});
45+
46+
const BasicInfoWrap = styled('div')(({ width = '610px', marginLeft = '0px' }: {
47+
width?: string,
48+
marginLeft?: string | number,
49+
}) => ({
50+
width,
51+
marginLeft,
52+
flex: '1 0 auto',
53+
"@media (max-width: 780px)": {
54+
width: '100%',
55+
}
56+
}));
57+
58+
const ConnectButton = styled(Button)({
59+
width: '100%',
60+
lineHeight: '60px',
61+
textAlign: 'center',
62+
backgroundColor: '#000000',
63+
color: '#fff',
64+
border: 'none',
65+
borderRadius: '10px',
66+
cursor: 'pointer',
67+
fontSize: '16px',
68+
fontWeight: 700,
69+
padding: 0,
70+
transition: 'background-color 0.5s ease',
71+
marginLeft: 0,
72+
backdropFilter: 'blur(30px)',
73+
boxShadow: '0px 30px 30px -20px rgba(0, 0, 0, 0.40)',
74+
'&:hover': {
75+
backgroundColor: '#07094c',
76+
},
77+
'&.Mui-disabled': {
78+
color: '#fff',
79+
}
80+
})
81+
const AdapterBasicUsage: React.FC = () => {
82+
const { connectionState, connect, disconnect } = useWallet();
83+
84+
85+
return (
86+
<Container>
87+
<Title>Adapter Basic Usage</Title>
88+
<MainContent>
89+
<BasicInfoWrap>
90+
<AdapterSelect />
91+
<ConnectionState />
92+
<ConnectButton onClick={connectionState.connected ? disconnect : connect} disabled={connectionState.connecting}>
93+
{connectionState.connected ? <LinkOffIcon /> : <LinkIcon /> }
94+
<span style={{ marginLeft: '10px' }}>{connectionState.connected ? 'Disconnect' : 'Connect'}</span>
95+
</ConnectButton>
96+
</BasicInfoWrap>
97+
<SignUsage/>
98+
<SwitchChain />
99+
</MainContent>
100+
</Container>
101+
);
102+
};
103+
104+
export default AdapterBasicUsage;

‎demos/dev-demo/src/App.tsx

Lines changed: 7 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,16 @@
1-
import { Box, Tab, Tabs } from '@mui/material';
2-
import React from 'react';
3-
import { CustomConnectWithSelectAccount } from './LedgerDemo/CustomConnectWithSelectAccount.js';
4-
import { CustomConnectWithGetAccounts } from './LedgerDemo/CustomConnectWithGetAccounts.js';
5-
import { TronLinkAdapterDemo } from './TronLinkAdapterDemo.js';
6-
import { ReactHooksDemo } from './ReactHooksDemo.js';
7-
import { TronLinkEvmAdapter } from '@tronweb3/tronwallet-adapter-tronlink-evm';
8-
import { AdapterBasicTest } from './AdapterBasicTest.js';
9-
interface TabPanelProps {
10-
children?: React.ReactNode;
11-
index: number;
12-
value: number;
13-
}
1+
import { Box } from '@mui/material';
142

15-
function TabPanel(props: TabPanelProps) {
16-
const { children, value, index, ...other } = props;
3+
import AdapterBasicUsage from './AdapterBasicUsage.js';
4+
import WalletProvider from './components/WalletProvider.js';
175

18-
return (
19-
<div role="tabpanel" hidden={value !== index} id={`simple-tabpanel-${index}`} aria-labelledby={`simple-tab-${index}`} {...other}>
20-
{value === index && <Box sx={{ p: 3 }}>{children}</Box>}
21-
</div>
22-
);
23-
}
246
function App() {
25-
const [value, setValue] = React.useState(() => {
26-
return Number(localStorage.getItem('tab')) || 0;
27-
});
28-
29-
const handleChange = (event: React.SyntheticEvent, newValue: number) => {
30-
localStorage.setItem('tab', String(newValue));
31-
setValue(newValue);
32-
};
337
return (
348
<div className="App">
35-
<Box sx={{ width: '100%' }}>
36-
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
37-
<Tabs scrollButtons="auto" variant="scrollable" value={value} onChange={handleChange} aria-label="basic tabs example">
38-
<Tab label="Adapter Basic Usage" />
39-
</Tabs>
9+
<WalletProvider >
10+
<Box sx={{ width: '100%' }}>
11+
<AdapterBasicUsage />
4012
</Box>
41-
<TabPanel value={value} index={0}>
42-
<AdapterBasicTest />
43-
</TabPanel>
44-
</Box>
13+
</WalletProvider>
4514
</div>
4615
);
4716
}

‎demos/dev-demo/src/AppWraper.tsx

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎demos/dev-demo/src/components/AdapterSelect.tsx

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
import styled from "@emotion/styled";
2+
import type { SelectChangeEvent} from "@mui/material";
3+
import { Box, Divider, MenuItem, Select, Stack, Typography } from "@mui/material";
4+
import { useMemo } from "react";
5+
import { useWallet } from "./WalletProvider";
6+
import type { AdapterName } from "@tronweb3/tronwallet-abstract-adapter";
7+
8+
const SelectBox = styled(Box)({
9+
width: '100%',
10+
boxSizing: 'border-box',
11+
backgroundColor: '#e8e8ef',
12+
borderRadius: 10,
13+
padding: '0px 0px 0px 20px',
14+
display: 'flex',
15+
justifyContent: 'space-between',
16+
alignItems: 'center',
17+
marginBottom: '25px',
18+
'& fieldset': { border: 'none' },
19+
'&:hover fieldset': { border: 'none' },
20+
'&.Mui-focused fieldset': { border: 'none' },
21+
});
22+
23+
const MySelect = styled(Select)({
24+
width: '200px',
25+
border: 'none',
26+
});
27+
export default function AdapterSelect() {
28+
const { adapters, setSelectedAdapterName, selectedAdapterName } = useWallet();
29+
const Items = useMemo(
30+
() =>
31+
adapters.map((adapter) => (
32+
<MenuItem value={adapter.name} key={adapter.name}>
33+
<Stack direction="row" spacing={2} alignItems={'center'}>
34+
<img src={adapter.icon} alt={adapter.name} style={{ width: 24, height: 24, marginRight: 10 }} />
35+
{adapter.name}
36+
</Stack>
37+
</MenuItem>
38+
)),
39+
[adapters]
40+
);
41+
42+
function handleChange(e: SelectChangeEvent<unknown>, child: React.ReactNode) {
43+
setSelectedAdapterName(e.target.value as AdapterName);
44+
}
45+
const menuProps = {
46+
PaperProps: {
47+
style: {
48+
backgroundColor: '#e8e8ef',
49+
borderRadius: '10px',
50+
},
51+
},
52+
MenuListProps: {
53+
sx: {
54+
'& .MuiMenuItem-root': {
55+
backgroundColor: '#e8e8ef',
56+
margin: '0 5px',
57+
borderRadius: '10px',
58+
lineHeight: '40px',
59+
transition: 'all 0.5s ease',
60+
'&:hover': {
61+
backgroundColor: '#c9c9da',
62+
},
63+
'&.Mui-selected': {
64+
backgroundColor: '#c9c9da',
65+
},
66+
},
67+
},
68+
},
69+
};
70+
return <SelectBox>
71+
<Typography sx={{ lineHeight: '60px', color: '#7b7c9d', flex: 1, fontWeight: 500, }}>Select the Adapter</Typography>
72+
<Divider orientation="vertical" sx={{ height: '20px' }}/>
73+
<MySelect size="small" value={selectedAdapterName} onChange={handleChange} MenuProps={menuProps}>
74+
{Items}
75+
</MySelect>
76+
</SelectBox>
77+
}

‎demos/dev-demo/src/components/ConnectedIcon.tsx

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
export default function ConnectedIcon() {
2+
return (
3+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
4+
<path d="M17.155 16.7125C17.8149 16.7492 18.4754 16.6509 19.096 16.4236C19.7167 16.1964 20.2844 15.8449 20.7646 15.3907C21.2448 14.9365 21.6273 14.3891 21.8886 13.782C22.15 13.175 22.2849 12.521 22.2849 11.86C22.2849 11.199 22.15 10.545 21.8886 9.93797C21.6273 9.3309 21.2448 8.78353 20.7646 8.32933C20.2844 7.87513 19.7167 7.52364 19.096 7.29636C18.4754 7.06909 17.8149 6.9708 17.155 7.0075L14.035 7.0075C14.9642 7.53376 15.724 8.31434 16.225 9.2575L17.155 9.2575C17.5133 9.23027 17.8735 9.27736 18.2128 9.3958C18.5521 9.51425 18.8634 9.7015 19.1269 9.94582C19.3905 10.1901 19.6008 10.4863 19.7446 10.8157C19.8885 11.1451 19.9627 11.5006 19.9627 11.86C19.9627 12.2194 19.8885 12.5749 19.7446 12.9043C19.6008 13.2337 19.3905 13.5299 19.1269 13.7742C18.8634 14.0185 18.5521 14.2058 18.2128 14.3242C17.8735 14.4426 17.5133 14.4897 17.155 14.4625L12.445 14.4625C12.1022 14.4625 11.7628 14.395 11.4462 14.2638C11.1295 14.1327 10.8418 13.9404 10.5994 13.698C10.3571 13.4557 10.1648 13.168 10.0336 12.8513C9.90247 12.5346 9.83496 12.1953 9.83496 11.8525C9.8394 11.2544 10.0515 10.6765 10.435 10.2175L7.88496 10.2175C7.69004 10.7407 7.58849 11.2941 7.58496 11.8525C7.58496 13.1415 8.097 14.3776 9.00842 15.289C9.91985 16.2005 11.156 16.7125 12.445 16.7125L17.155 16.7125Z" fill="#10E368" />
5+
<path d="M7.5249 14.4625L6.1449 14.4625C5.78652 14.4897 5.42638 14.4426 5.08705 14.3242C4.74771 14.2058 4.4365 14.0185 4.17291 13.7742C3.90931 13.5299 3.69903 13.2337 3.55521 12.9043C3.4114 12.5749 3.33717 12.2194 3.33717 11.86C3.33717 11.5006 3.4114 11.1451 3.55522 10.8157C3.69903 10.4863 3.90932 10.1901 4.17291 9.94582C4.4365 9.7015 4.74771 9.51425 5.08705 9.3958C5.42638 9.27736 5.78652 9.23027 6.1449 9.2575L11.2749 9.2575C11.9645 9.25749 12.6261 9.53041 13.1152 10.0166C13.6042 10.5029 13.8809 11.1629 13.8849 11.8525C13.8829 12.1982 13.8115 12.54 13.6749 12.8575C13.5752 13.0848 13.4439 13.2969 13.2849 13.4875L15.8349 13.4875C16.0292 12.9641 16.1307 12.4108 16.1349 11.8525C16.1309 10.5661 15.6171 9.33384 14.7061 8.42565C13.7951 7.51747 12.5613 7.00749 11.2749 7.0075L6.1299 7.0075C5.46996 6.97079 4.80948 7.06909 4.18883 7.29636C3.56818 7.52364 3.00041 7.87513 2.52025 8.32933C2.04008 8.78353 1.65761 9.3309 1.39621 9.93797C1.13482 10.545 1 11.199 1 11.86C1 12.521 1.13482 13.175 1.39621 13.782C1.65761 14.3891 2.04008 14.9365 2.52025 15.3907C3.00041 15.8449 3.56818 16.1964 4.18883 16.4236C4.80948 16.6509 5.46996 16.7492 6.1299 16.7125L9.6849 16.7125C8.76618 16.1824 8.01707 15.4021 7.5249 14.4625Z" fill="#10E368" />
6+
</svg>
7+
)
8+
}

0 commit comments

Comments
 (0)