Skip to content

Commit 3937d48

Browse files
committed
feat: update imports to use @tonconnect/ui-react and modify header text
1 parent 4e5b3a0 commit 3937d48

File tree

13 files changed

+938
-2172
lines changed

13 files changed

+938
-2172
lines changed
Lines changed: 169 additions & 186 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
<title>Demo Dapp with @tonkeeper/tonconnect-ui-react</title>
99

1010
<!-- <script data-consolejs-channel="57e95ad4-4a89-7cf9-106a-51106eb4d73d" src="https://remotejs.com/agent/agent.js"></script> -->
11-
<script type="module" crossorigin src="/demo-dapp-with-wallet/assets/index-8932de6a.js"></script>
11+
<script type="module" crossorigin src="/demo-dapp-with-wallet/assets/index-1aeb8eaf.js"></script>
1212
<link rel="stylesheet" href="/demo-dapp-with-wallet/assets/index-f6cd27ed.css">
1313
</head>
1414
<body>

package-lock.json

Lines changed: 712 additions & 1926 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,11 @@
77
"dev": "vite --host --force",
88
"build": "tsc && GH_PAGES=true vite build",
99
"build:dev": "tsc && vite build",
10+
"deploy": "npm run build && gh-pages -d docs",
1011
"preview": "vite preview"
1112
},
1213
"dependencies": {
13-
"@tonkeeper/tonconnect-ui-react": "2.0.12-alpha.0",
14+
"@tonconnect/ui-react": "npm:@tonkeeper/tonconnect-ui-react@2.0.13-alpha.1",
1415
"eruda": "^2.11.2",
1516
"react": "^17.0.0",
1617
"react-dom": "^17.0.0",

src/App.tsx

Lines changed: 43 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
11
import './App.scss';
22
import './trackers';
33
// @ts-ignore
4-
import { RequireFeature, THEME, TonConnectUIProvider, SendTransactionFeature } from '@tonkeeper/tonconnect-ui-react';
4+
import {
5+
RequireFeature,
6+
THEME,
7+
TonConnectUIProvider,
8+
} from '@tonconnect/ui-react';
59
import { Footer } from './components/Footer/Footer';
610
import { Header } from './components/Header/Header';
711
import { TxForm } from './components/TxForm/TxForm';
@@ -24,29 +28,45 @@ function App() {
2428
uiPreferences={{ theme: THEME.DARK }}
2529
walletsRequiredFeatures={walletsRequiredFeatures}
2630
walletsListConfiguration={{
27-
includeWallets: [
28-
{
29-
appName: "tonkeeper_ec",
30-
name: "Tonkeeper EC",
31-
imageUrl: "https://tonkeeper.com/assets/tonconnect-icon.png",
32-
tondns: "tonkeeper.ton",
33-
aboutUrl: "https://tonkeeper.com",
34-
deepLink: "tonkeeper-tc://",
35-
universalLink: 'https://app.tonkeeper.com/ton-connect',
36-
// @ts-ignore
37-
features: [
38-
{
39-
name: "SendTransaction",
40-
maxMessages: 255,
41-
extraCurrencySupported: true
42-
}
43-
],
44-
jsBridgeKey: 'tonkeeper',
45-
platforms: ["chrome", "firefox"]
46-
},
47-
]
31+
includeWallets: [
32+
{
33+
appName: 'Tonkeeper',
34+
name: 'TonkeeperWeb',
35+
imageUrl:
36+
'https://raw.githubusercontent.com/tonkeeper/tonkeeper-web/0f197474c57937787608697e794ef2b20a62f0d4/apps/twa/public/logo-128x128.png',
37+
aboutUrl: 'https://9adbe24e.tonkeeper-web.pages.dev',
38+
universalLink:
39+
'https://9adbe24e.tonkeeper-web.pages.dev/ton-connect',
40+
// deepLink: 'tonkeeper-tc://',
41+
bridgeUrl: 'https://bridge.tonapi.io/bridge',
42+
platforms: [
43+
'ios',
44+
'android',
45+
'macos',
46+
'windows',
47+
'linux',
48+
],
49+
},
50+
{
51+
appName: 'mytonwallet',
52+
name: 'MyTonWallet',
53+
imageUrl: 'https://static.mytonwallet.io/icon-256.png',
54+
aboutUrl: 'https://mytonwallet.io',
55+
universalLink: 'https://connect.mytonwallet.org',
56+
bridgeUrl:
57+
'https://tonconnectbridge.mytonwallet.org/bridge',
58+
platforms: [
59+
'chrome',
60+
'windows',
61+
'macos',
62+
'linux',
63+
'ios',
64+
'android',
65+
'firefox',
66+
],
67+
},
68+
],
4869
}}
49-
// primaryWalletAppName={'tonkeeper'}
5070
actionsConfiguration={{
5171
twaReturnUrl: 'https://t.me/tc_twa_demo_bot/start',
5272
}}

src/TonProofDemoApi.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {Account, ConnectAdditionalRequest, TonProofItemReplySuccess} from "@tonkeeper/tonconnect-ui-react";
1+
import {Account, ConnectAdditionalRequest, TonProofItemReplySuccess} from "@tonconnect/ui-react";
22
import './patch-local-storage-for-github-pages';
33

44
class TonProofDemoApiService {

src/components/Footer/ColorsModal/ColorsModal.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { THEME } from "@tonkeeper/tonconnect-ui-react";
1+
import { THEME } from "@tonconnect/ui-react";
22
import {useState} from "react";
33
import {ColorsSelect} from "../ColorsSelect/ColorsSelect";
44
import './style.scss';

src/components/Footer/ColorsSelect/ColorsSelect.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {ColorsSet, THEME, useTonConnectUI} from "@tonkeeper/tonconnect-ui-react";
1+
import {ColorsSet, THEME, useTonConnectUI} from "@tonconnect/ui-react";
22
import {FunctionComponent, useEffect, useState} from "react";
33
import './style.scss';
44

src/components/Footer/Footer.tsx

Lines changed: 1 addition & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,22 @@
1-
import {BorderRadius, Locales, ReturnStrategy, Theme, THEME, useTonConnectUI, WalletInfo} from "@tonkeeper/tonconnect-ui-react";
1+
import {BorderRadius, Locales, ReturnStrategy, Theme, THEME, useTonConnectUI} from "@tonconnect/ui-react";
22
import './footer.scss';
33
import {useEffect, useState} from "react";
44
import {ColorsModal} from "./ColorsModal/ColorsModal";
55

6-
const defaultWalletsSelectValue = '["Tonkeeper", "OpenMask"]';
7-
86
export const Footer = () => {
97
const [checkboxes, setCheckboxes] = useState(
108
[true, false, false, true, true, true]
119
);
1210

1311
const [returnStrategy, setReturnStrategy] = useState('back');
1412
const [skipRedirect, setSkipRedirect] = useState('ios');
15-
const [wallets, setWallets] = useState<WalletInfo[]>([]);
1613

1714
const [tonConnectUI, setOptions] = useTonConnectUI();
1815

1916
const onLangChange = (lang: string) => {
2017
setOptions({language: lang as Locales})
2118
}
2219

23-
const onPrimaryChange = (value: string) => {
24-
setOptions({ primaryWalletAppName: value })
25-
};
26-
2720
const onThemeChange = (theme: string) => {
2821
setOptions({uiPreferences: {theme: theme as Theme}})
2922
}
@@ -64,24 +57,7 @@ export const Footer = () => {
6457
setOptions({ actionsConfiguration: { modals, notifications } })
6558
}, [checkboxes])
6659

67-
useEffect(() => {
68-
tonConnectUI.getWallets().then(setWallets)
69-
}, [])
70-
7160
return <footer className="footer">
72-
<div>
73-
<label>primary wallet</label>
74-
<select onChange={e => onPrimaryChange(e.target.value)}>
75-
<option value="unset">unset</option>
76-
<option value="disabled">disabled</option>
77-
{wallets.map((wallet) => (
78-
<option key={wallet.appName} value={wallet.appName}>
79-
{wallet.name}
80-
</option>
81-
))}
82-
</select>
83-
</div>
84-
8561
<div>
8662
<label>language</label>
8763
<select onChange={e => onLangChange(e.target.value)}>

src/components/Header/Header.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import {TonConnectButton} from "@tonkeeper/tonconnect-ui-react";
1+
import {TonConnectButton} from "@tonconnect/ui-react";
22
import './header.scss';
33

44
export const Header = () => {
55
return <header>
6-
<span>My App with React UI</span>
6+
<span>TonConnect React reference</span>
77
<TonConnectButton />
88
</header>
99
}

0 commit comments

Comments
 (0)