Skip to content

Commit d202c56

Browse files
committed
update market demo: update api key input
1 parent d181ffb commit d202c56

File tree

5 files changed

+76
-39
lines changed

5 files changed

+76
-39
lines changed

brc20-market-demo/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
"@types/node": "^16.7.13",
88
"@types/react": "^18.0.0",
99
"@types/react-dom": "^18.0.0",
10+
"ahooks": "^3.7.10",
1011
"antd": "^5.13.3",
1112
"axios": "^1.6.7",
1213
"buffer": "^6.0.3",

brc20-market-demo/src/App.tsx

Lines changed: 37 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,22 @@ import React from 'react';
22
import './style/App.css';
33
import {ApiKeyInput} from "./components/ApiKeyInput";
44
import {NetworkSwitch} from "./components/NetworkSwitch";
5-
import {Card, Input, Layout, Space, Tabs} from "antd";
5+
import {Card, Input, Layout, Space, Tabs, Typography} from "antd";
66
import {ConnectWallet} from "./components/ConnectWallet";
77
import {Assets} from "./page/Assets";
88
import {useMarket} from "./provider/MarketProvider";
99
import {isTicketValid} from "./utils/utils";
1010
import {Listed} from "./page/Listed";
11+
import {useLocalStorageState} from "ahooks";
1112

1213
function App() {
1314
const {tick, setTick} = useMarket();
1415

16+
17+
const [apiKey, setApiKey] = useLocalStorageState<string>('apiKey',
18+
{defaultValue: '', deserializer: (val) => val, serializer: (val) => val})
19+
20+
1521
return (
1622
<Layout style={{minHeight: "100vh"}}>
1723
<Layout.Content style={{padding: 16}}>
@@ -22,29 +28,38 @@ function App() {
2228
flexDirection: 'column',
2329
gap: 16,
2430
}}>
25-
<ApiKeyInput/>
31+
<ApiKeyInput apiKey={apiKey} setKey={setApiKey}/>
2632
<NetworkSwitch/>
2733
<ConnectWallet/>
28-
<Card size={'small'}>
29-
<Tabs
30-
destroyInactiveTabPane
31-
items={[
32-
{key: "1", label: "Listed", children: <Listed/>},
33-
{key: "2", label: "Assets", children: <Assets/>},
34-
]}
35-
tabBarExtraContent={{
36-
right: <Space align={'center'}>
37-
Tick
38-
<Input
39-
style={{width: 100}}
40-
value={tick}
41-
onChange={(e) => setTick(e.target.value)}
42-
status={isTicketValid(tick) ? '' : 'error'}
43-
/>
44-
</Space>
45-
}}
46-
/>
47-
</Card>
34+
{
35+
apiKey?<>
36+
<Card size={'small'}>
37+
<Tabs
38+
destroyInactiveTabPane
39+
items={[
40+
{key: "1", label: "Listed", children: <Listed/>},
41+
{key: "2", label: "Assets", children: <Assets/>},
42+
]}
43+
tabBarExtraContent={{
44+
right: <Space align={'center'}>
45+
Tick
46+
<Input
47+
style={{width: 100}}
48+
value={tick}
49+
onChange={(e) => setTick(e.target.value)}
50+
status={isTicketValid(tick) ? '' : 'error'}
51+
/>
52+
</Space>
53+
}}
54+
/>
55+
</Card>
56+
</>: <>
57+
<Typography.Title>
58+
Please set API key to continue
59+
</Typography.Title>
60+
</>
61+
}
62+
4863
</div>
4964
</Layout.Content>
5065
</Layout>
Lines changed: 7 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,11 @@
11
import {Card, Input} from "antd";
2-
import React, {useEffect, useState} from "react";
2+
import React from "react";
33
import {setApiKey} from "../utils/httpUtils";
44

5-
export function ApiKeyInput() {
6-
const [key, setKey] = useState<string>("")
7-
8-
useEffect(() => {
9-
const temp = localStorage.getItem("apiKey") || "";
10-
if (temp) {
11-
setKey(temp)
12-
setApiKey(temp)
13-
}
14-
}, []);
5+
export function ApiKeyInput({apiKey,setKey}:{
6+
apiKey: string |undefined,
7+
setKey: (apiKey: string) => void
8+
}) {
159

1610
return <Card size={'small'}>
1711
<div className={'flex-row-v-center gap-16 bold'}>
@@ -20,16 +14,15 @@ export function ApiKeyInput() {
2014
<div className="api-key-input">
2115
<Input type="text"
2216
placeholder="Enter API key"
23-
value={key}
17+
value={apiKey}
2418
onChange={(e) => {
2519
const key = e.target.value;
2620
setKey(key);
2721
setApiKey(key);
28-
localStorage.setItem("apiKey", key);
2922
}}
3023
/>
3124
</div>
3225
</div>
3326
</div>
3427
</Card>
35-
}
28+
}

brc20-market-demo/yarn.lock

Lines changed: 31 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2585,6 +2585,20 @@ agent-base@6:
25852585
dependencies:
25862586
debug "4"
25872587

2588+
ahooks@^3.7.10:
2589+
version "3.7.10"
2590+
resolved "https://registry.yarnpkg.com/ahooks/-/ahooks-3.7.10.tgz#6ac1dfbcedff8c673367c044ffef41ffae6da483"
2591+
integrity sha512-/HLYif7sFA/5qSuWKrwvjDbf3bq+sdaMrUWS7XGCDRWdC2FrG/i+u5LZdakMYc6UIgJTMQ7tGiJCV7sdU4kSIw==
2592+
dependencies:
2593+
"@babel/runtime" "^7.21.0"
2594+
dayjs "^1.9.1"
2595+
intersection-observer "^0.12.0"
2596+
js-cookie "^2.x.x"
2597+
lodash "^4.17.21"
2598+
resize-observer-polyfill "^1.5.1"
2599+
screenfull "^5.0.0"
2600+
tslib "^2.4.1"
2601+
25882602
ajv-formats@^2.1.1:
25892603
version "2.1.1"
25902604
resolved "https://registry.yarnpkg.com/ajv-formats/-/ajv-formats-2.1.1.tgz#6e669400659eb74973bbf2e33327180a0996b520"
@@ -3791,7 +3805,7 @@ data-urls@^2.0.0:
37913805
whatwg-mimetype "^2.3.0"
37923806
whatwg-url "^8.0.0"
37933807

3794-
dayjs@^1.11.10:
3808+
dayjs@^1.11.10, dayjs@^1.9.1:
37953809
version "1.11.10"
37963810
resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.11.10.tgz#68acea85317a6e164457d6d6947564029a6a16a0"
37973811
integrity sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ==
@@ -5335,6 +5349,11 @@ internal-slot@^1.0.5:
53355349
hasown "^2.0.0"
53365350
side-channel "^1.0.4"
53375351

5352+
intersection-observer@^0.12.0:
5353+
version "0.12.2"
5354+
resolved "https://registry.yarnpkg.com/intersection-observer/-/intersection-observer-0.12.2.tgz#4a45349cc0cd91916682b1f44c28d7ec737dc375"
5355+
integrity sha512-7m1vEcPCxXYI8HqnL8CKI6siDyD+eIWSwgB3DZA+ZTogxk9I4CDnj4wilt9x/+/QbHI4YG5YZNmC6458/e9Ktg==
5356+
53385357
ipaddr.js@1.9.1:
53395358
version "1.9.1"
53405359
resolved "https://registry.yarnpkg.com/ipaddr.js/-/ipaddr.js-1.9.1.tgz#bff38543eeb8984825079ff3a2a8e6cbd46781b3"
@@ -6157,6 +6176,11 @@ jiti@^1.19.1:
61576176
resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.0.tgz#7c97f8fe045724e136a397f7340475244156105d"
61586177
integrity sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==
61596178

6179+
js-cookie@^2.x.x:
6180+
version "2.2.1"
6181+
resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-2.2.1.tgz#69e106dc5d5806894562902aa5baec3744e9b2b8"
6182+
integrity sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ==
6183+
61606184
"js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
61616185
version "4.0.0"
61626186
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
@@ -8619,6 +8643,11 @@ schema-utils@^4.0.0:
86198643
ajv-formats "^2.1.1"
86208644
ajv-keywords "^5.1.0"
86218645

8646+
screenfull@^5.0.0:
8647+
version "5.2.0"
8648+
resolved "https://registry.yarnpkg.com/screenfull/-/screenfull-5.2.0.tgz#6533d524d30621fc1283b9692146f3f13a93d1ba"
8649+
integrity sha512-9BakfsO2aUQN2K9Fdbj87RJIEZ82Q9IGim7FqM5OsebfoFC6ZHXgDq/KvniuLTPdeM8wY2o6Dj3WQ7KeQCj3cA==
8650+
86228651
scroll-into-view-if-needed@^3.1.0:
86238652
version "3.1.0"
86248653
resolved "https://registry.yarnpkg.com/scroll-into-view-if-needed/-/scroll-into-view-if-needed-3.1.0.tgz#fa9524518c799b45a2ef6bbffb92bcad0296d01f"
@@ -9364,7 +9393,7 @@ tslib@^1.8.1:
93649393
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
93659394
integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
93669395

9367-
tslib@^2.0.3:
9396+
tslib@^2.0.3, tslib@^2.4.1:
93689397
version "2.6.2"
93699398
resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
93709399
integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==

unisat-inscribe-demo/src/App.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ import {useEventEmitter, useLocalStorageState} from "ahooks";
66
import {Inscribe} from "./pages/Inscribe";
77
import {ApiKeyInput} from "./components/ApiKeyInput";
88
import {NetworkSwitch} from "./components/NetworkSwitch";
9-
import {api} from "./utils/api";
109
import {OrderList} from "./pages/OrderList";
1110

1211
function App() {

0 commit comments

Comments
 (0)