Skip to content

Commit 090cc3f

Browse files
slient-coderslient-coder
committed
chore: update new UI
1 parent fa766bf commit 090cc3f

File tree

22 files changed

+358
-249
lines changed

22 files changed

+358
-249
lines changed

‎build/_raw/images/artifacts/top-linear-gradient.png

20.7 KB
Loading

‎build/_raw/images/icons/right.svg

+3
Loading

‎build/webpack.common.config.js

+12-12
Original file line numberDiff line numberDiff line change
@@ -72,18 +72,18 @@ const config = (env) => {
7272
config: false,
7373
plugins: !useTailwind
7474
? [
75-
'postcss-flexbugs-fixes',
76-
['postcss-preset-env', { autoprefixer: { flexbox: 'no-2009' }, stage: 3 }],
77-
// Adds PostCSS Normalize as the reset css with default options,
78-
// so that it honors browserslist config in package.json
79-
// which in turn let's users customize the target behavior as per their needs.
80-
'postcss-normalize'
81-
]
75+
'postcss-flexbugs-fixes',
76+
['postcss-preset-env', { autoprefixer: { flexbox: 'no-2009' }, stage: 3 }],
77+
// Adds PostCSS Normalize as the reset css with default options,
78+
// so that it honors browserslist config in package.json
79+
// which in turn let's users customize the target behavior as per their needs.
80+
'postcss-normalize'
81+
]
8282
: [
83-
'tailwindcss',
84-
'postcss-flexbugs-fixes',
85-
['postcss-preset-env', { autoprefixer: { flexbox: 'no-2009' }, stage: 3 }]
86-
]
83+
'tailwindcss',
84+
'postcss-flexbugs-fixes',
85+
['postcss-preset-env', { autoprefixer: { flexbox: 'no-2009' }, stage: 3 }]
86+
]
8787
},
8888
sourceMap: isEnvProduction ? shouldUseSourceMap : isEnvDevelopment
8989
}
@@ -102,7 +102,7 @@ const config = (env) => {
102102
'primary-color': 'rgb(234,202,68)',
103103
'primary-color-active': '#383535',
104104
'input-icon-hover-color': '#FFFFFF',
105-
'component-background': '#1C1919',
105+
'component-background': '#070606',
106106
'select-dropdown-bg': '#2A2626',
107107
'select-item-selected-bg': '#332F2F',
108108
'select-item-active-bg': '#332F2F',

‎src/background/controller/provider/controller.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -69,8 +69,7 @@ class ProviderController extends BaseController {
6969

7070
@Reflect.metadata('SAFE', true)
7171
getNetwork = async () => {
72-
const networkType = wallet.getNetworkType()
73-
return NETWORK_TYPES[networkType].name
72+
return wallet.getLegacyNetworkName()
7473
};
7574

7675
@Reflect.metadata('APPROVAL', ['SwitchNetwork', (req) => {

‎src/shared/constant/index.ts

+53-18
Original file line numberDiff line numberDiff line change
@@ -233,8 +233,9 @@ type TypeChain = {
233233
unisatExplorerUrl: string;
234234
okxExplorerUrl: string;
235235
isViewTxHistoryInternally?: boolean;
236-
foldIn?:string,
237-
disable?:boolean
236+
foldIn?: string;
237+
disable?: boolean;
238+
isFractal?: boolean;
238239
};
239240

240241
export const CHAINS_MAP: { [key: string]: TypeChain } = {
@@ -263,7 +264,7 @@ export const CHAINS_MAP: { [key: string]: TypeChain } = {
263264
ordinalsUrl: 'https://testnet.ordinals.com',
264265
unisatExplorerUrl: '',
265266
okxExplorerUrl: '',
266-
foldIn:"Bitcoin Testnet"
267+
foldIn: 'Bitcoin Testnet'
267268
},
268269
[ChainType.BITCOIN_TESTNET4]: {
269270
enum: ChainType.BITCOIN_TESTNET4,
@@ -277,7 +278,7 @@ export const CHAINS_MAP: { [key: string]: TypeChain } = {
277278
ordinalsUrl: 'https://testnet4.ordinals.com',
278279
unisatExplorerUrl: '',
279280
okxExplorerUrl: '',
280-
foldIn:"Bitcoin Testnet",
281+
foldIn: 'Bitcoin Testnet'
281282
},
282283
[ChainType.BITCOIN_SIGNET]: {
283284
enum: ChainType.BITCOIN_SIGNET,
@@ -291,11 +292,11 @@ export const CHAINS_MAP: { [key: string]: TypeChain } = {
291292
ordinalsUrl: 'https://signet.ordinals.com',
292293
unisatExplorerUrl: '',
293294
okxExplorerUrl: '',
294-
foldIn:"Bitcoin Testnet",
295+
foldIn: 'Bitcoin Testnet'
295296
},
296297
[ChainType.FRACTAL_BITCOIN_MAINNET]: {
297298
enum: ChainType.FRACTAL_BITCOIN_MAINNET,
298-
label: 'Fractal Bitcoin Mainnet (Beta)',
299+
label: 'Fractal Bitcoin Mainnet (Not Ready)',
299300
icon: './images/artifacts/fractalbitcoin-mainnet.svg',
300301
unit: 'FB',
301302
networkType: NetworkType.MAINNET,
@@ -305,28 +306,62 @@ export const CHAINS_MAP: { [key: string]: TypeChain } = {
305306
ordinalsUrl: 'https://ordinals.fractalbitcoin.io',
306307
unisatExplorerUrl: 'https://explorer.fractalbitcoin.io',
307308
okxExplorerUrl: '',
308-
isViewTxHistoryInternally: false
309+
isViewTxHistoryInternally: false,
310+
disable: true,
311+
isFractal: true
309312
},
310313
[ChainType.FRACTAL_BITCOIN_TESTNET]: {
311314
enum: ChainType.FRACTAL_BITCOIN_TESTNET,
312-
label: 'Fractal Bitcoin Testnet (Beta)',
315+
label: 'Fractal Bitcoin Testnet',
313316
icon: './images/artifacts/fractalbitcoin-mainnet.svg',
314-
unit: 'FB',
315-
networkType: NetworkType.TESTNET,
316-
endpoints: ['https://wallet-api-fractal.unisat.io'],
317-
mempoolSpaceUrl: 'https://mempool.fractalbitcoin.io',
318-
unisatUrl: 'https://fractal.unisat.io',
319-
ordinalsUrl: 'https://ordinals.fractalbitcoin.io',
320-
unisatExplorerUrl: 'https://explorer.fractalbitcoin.io',
317+
unit: 'tFB',
318+
networkType: NetworkType.MAINNET,
319+
endpoints: ['https://fractal-testnet.unisat.io/wallet-api'],
320+
mempoolSpaceUrl: 'https://mempool-testnet.fractalbitcoin.io',
321+
unisatUrl: 'https://fractal-testnet.unisat.io',
322+
ordinalsUrl: 'https://ordinals-testnet.fractalbitcoin.io',
323+
unisatExplorerUrl: 'https://explorer-testnet.fractalbitcoin.io',
321324
okxExplorerUrl: '',
322325
isViewTxHistoryInternally: false,
323-
disable:true,
324-
},
326+
isFractal: true
327+
}
325328
};
326329

327-
// 将 CHAINS_MAP 转换为数组
328330
export const CHAINS = Object.values(CHAINS_MAP);
329331

332+
export type TypeChainGroup = {
333+
type: 'single' | 'list';
334+
chain?: TypeChain;
335+
label?: string;
336+
icon?: string;
337+
items?: TypeChain[];
338+
};
339+
340+
export const CHAIN_GROUPS: TypeChainGroup[] = [
341+
{
342+
type: 'single',
343+
chain: CHAINS_MAP[ChainType.BITCOIN_MAINNET]
344+
},
345+
{
346+
type: 'list',
347+
label: 'Bitcoin Testnet',
348+
icon: './images/artifacts/bitcoin-testnet.svg',
349+
items: [
350+
CHAINS_MAP[ChainType.BITCOIN_TESTNET],
351+
CHAINS_MAP[ChainType.BITCOIN_TESTNET4],
352+
CHAINS_MAP[ChainType.BITCOIN_SIGNET]
353+
]
354+
},
355+
{
356+
type: 'single',
357+
chain: CHAINS_MAP[ChainType.FRACTAL_BITCOIN_MAINNET]
358+
},
359+
{
360+
type: 'single',
361+
chain: CHAINS_MAP[ChainType.FRACTAL_BITCOIN_TESTNET]
362+
}
363+
];
364+
330365
export const MINIMUM_GAS_LIMIT = 21000;
331366

332367
export enum WATCH_ADDRESS_CONNECT_TYPE {

‎src/ui/components/AccountSelect/index.tsx

+29-13
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
import { useNavigate } from '@/ui/pages/MainRoute';
22
import { useCurrentAccount } from '@/ui/state/accounts/hooks';
3-
import { shortAddress } from '@/ui/utils';
3+
import { copyToClipboard, shortAddress } from '@/ui/utils';
4+
import { CopyOutlined } from '@ant-design/icons';
45

6+
import { useTools } from '../ActionComponent';
7+
import { Column } from '../Column';
58
import { Icon } from '../Icon';
69
import { Row } from '../Row';
710
import { Text } from '../Text';
@@ -10,20 +13,33 @@ import './index.less';
1013
const AccountSelect = () => {
1114
const navigate = useNavigate();
1215
const currentAccount = useCurrentAccount();
13-
16+
const tools = useTools();
17+
const address = currentAccount.address;
1418
return (
15-
<Row
16-
justifyBetween
17-
px="md"
18-
py="md"
19-
bg="card"
20-
rounded
21-
onClick={(e) => {
22-
navigate('SwitchAccountScreen');
23-
}}>
19+
<Row justifyBetween px="md" py="md" bg="card" rounded itemsCenter>
2420
<Icon icon="user" />
25-
<Text text={shortAddress(currentAccount?.alianName, 8)} />
26-
<Icon icon="down" />
21+
<Column
22+
justifyCenter
23+
rounded
24+
px="sm"
25+
onClick={(e) => {
26+
copyToClipboard(address).then(() => {
27+
tools.toastSuccess('Copied');
28+
});
29+
}}>
30+
<Text text={shortAddress(currentAccount?.alianName, 8)} textCenter />
31+
<Row selfItemsCenter itemsCenter>
32+
<Text text={shortAddress(address)} color="textDim" />
33+
<CopyOutlined style={{ color: '#888', fontSize: 14 }} />
34+
</Row>
35+
</Column>
36+
37+
<Icon
38+
icon="right"
39+
onClick={(e) => {
40+
navigate('SwitchAccountScreen');
41+
}}
42+
/>
2743
</Row>
2844
);
2945
};

‎src/ui/components/BRC20BalanceCard2/index.tsx

+13-14
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { useState } from 'react';
22

33
import { AddressTokenSummary, TickPriceItem, TokenBalance } from '@/shared/types';
4+
import { TickPriceChange, TickUsd } from '@/ui/components/TickUsd';
45
import { useCurrentAccount } from '@/ui/state/accounts/hooks';
56
import { useWallet } from '@/ui/utils';
67
import { LoadingOutlined } from '@ant-design/icons';
@@ -11,14 +12,12 @@ import { Column } from '../Column';
1112
import { Icon } from '../Icon';
1213
import { Row } from '../Row';
1314
import { Text } from '../Text';
14-
import { TickPriceChange, TickUsd } from '@/ui/components/TickUsd';
15-
import { BtcUsd } from '@/ui/components/BtcUsd';
1615

1716
export interface BRC20BalanceCard2Props {
18-
tokenBalance: TokenBalance,
19-
onClick?: () => void,
20-
showPrice?: boolean,
21-
price?: TickPriceItem
17+
tokenBalance: TokenBalance;
18+
onClick?: () => void;
19+
showPrice?: boolean;
20+
price?: TickPriceItem;
2221
}
2322

2423
export default function BRC20BalanceCard2(props: BRC20BalanceCard2Props) {
@@ -36,7 +35,6 @@ export default function BRC20BalanceCard2(props: BRC20BalanceCard2Props) {
3635
onClick
3736
} = props;
3837

39-
4038
const account = useCurrentAccount();
4139
const [detailVisible, setDetailVisible] = useState(false);
4240
const [tokenSummary, setTokenSummary] = useState<AddressTokenSummary>();
@@ -75,9 +73,9 @@ export default function BRC20BalanceCard2(props: BRC20BalanceCard2Props) {
7573
return (
7674
<Card
7775
style={{
78-
backgroundColor: '#141414',
76+
backgroundColor: '#1E1F24',
7977
borderColor: 'rgba(255,255,255,0.1)',
80-
borderWidth: 1
78+
borderRadius: 12
8179
}}
8280
fullX
8381
onClick={() => {
@@ -119,12 +117,12 @@ export default function BRC20BalanceCard2(props: BRC20BalanceCard2Props) {
119117
</Row>
120118
</Row>
121119
</Row>
122-
{
123-
showPrice && <Row justifyBetween mt={'xs'}>
120+
{showPrice && (
121+
<Row justifyBetween mt={'xs'}>
124122
<TickPriceChange price={price} />
125123
<TickUsd price={price} balance={overallBalance} />
126124
</Row>
127-
}
125+
)}
128126
{detailVisible ? (
129127
loading ? (
130128
<Column style={{ minHeight: 130 }} itemsCenter justifyCenter>
@@ -148,8 +146,9 @@ export default function BRC20BalanceCard2(props: BRC20BalanceCard2Props) {
148146
bg={v === 'Transfer' ? 'brc20_transfer' : v === 'Deploy' ? 'brc20_deploy' : 'brc20_other'}>
149147
<Column gap="zero">
150148
<Text text={v} size={v === 'Transfer' ? 'sm' : v === 'Deploy' ? 'sm' : 'md'} />
151-
{v === 'Transfer' ?
152-
<Text text={`(${_amounts[index]})`} size="xxs" textCenter wrap digital /> : null}
149+
{v === 'Transfer' ? (
150+
<Text text={`(${_amounts[index]})`} size="xxs" textCenter wrap digital />
151+
) : null}
153152
</Column>
154153
</Card>
155154
))}

‎src/ui/components/BRC20Ticker/index.tsx

+2-3
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import { Text } from '../Text';
55

66
// eslint-disable-next-line no-control-regex
77
const regex = /[\u0000-\u001F\u007F-\u009F\s]/;
8-
98
const $tickerPresets: { sm: { textSize: any }; md: { textSize: any }; lg: { textSize: any } } = {
109
sm: {
1110
textSize: 'xs'
@@ -31,11 +30,11 @@ export function BRC20Ticker({ tick, preset }: { tick: string | undefined; preset
3130
if (regex.test(char)) {
3231
return <Text key={index} text={encodeURIComponent(char)} color="textDim" size={style.textSize} />;
3332
}
34-
return <Text key={index} text={char} size={style.textSize} color="gold" />;
33+
return <Text key={index} text={char} size={style.textSize} wrap color="ticker_color" />;
3534
})}
3635
</Row>
3736
);
3837
}
39-
return <Text text={tick} size={style.textSize} color="gold" />;
38+
return <Text text={tick} size={style.textSize} wrap color="ticker_color" />;
4039
}, [tick]);
4140
}

‎src/ui/components/BottomModal/index.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,11 @@ export const BottomModal = ({ children, onClose }: { children: React.ReactNode;
55
<div
66
className="popover-container"
77
style={{
8-
backgroundColor: 'rgba(255,255,255,0.1)'
8+
backgroundColor: 'rgba(0,0,0,0.7)'
99
}}>
1010
<div
1111
style={{
12-
backgroundColor: '#181A1F',
12+
backgroundColor: '#24282F',
1313
width: '100%',
1414
padding: 20,
1515
borderRadius: 15,

0 commit comments

Comments
 (0)