Skip to content

Commit 501f8b4

Browse files
authored
Merge pull request #688 from nervosnetwork/rc/v0.1.0-alpha.10
[ᚬmaster] Release v0.1.0 alpha.10
2 parents ff61c51 + 09506fa commit 501f8b4

File tree

22 files changed

+293
-130
lines changed

22 files changed

+293
-130
lines changed

lerna.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"packages": [
33
"packages/*"
44
],
5-
"version": "0.1.0-alpha.9",
5+
"version": "0.1.0-alpha.10",
66
"npmClient": "yarn",
77
"useWorkspaces": true
88
}

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@nervosnetwork/neuron",
33
"productName": "Neuron",
44
"description": "CKB Neuron Wallet",
5-
"version": "0.1.0-alpha.9",
5+
"version": "0.1.0-alpha.10",
66
"private": true,
77
"author": {
88
"name": "Nervos Core Dev",

packages/neuron-ui/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@nervosnetwork/neuron-ui",
3-
"version": "0.1.0-alpha.9",
3+
"version": "0.1.0-alpha.10",
44
"private": true,
55
"author": {
66
"name": "Nervos Core Dev",

packages/neuron-ui/src/components/LaunchScreen/index.tsx

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,21 +9,17 @@ import { Routes } from 'utils/const'
99

1010
export const LaunchScreen = ({
1111
wallet: { id = '' },
12-
settings: { networks = [] },
1312
history,
1413
}: React.PropsWithoutRef<StateWithDispatch & RouteComponentProps>) => {
1514
const { t } = useTranslation()
1615

1716
useEffect(() => {
18-
if (!networks.length) {
19-
return
20-
}
2117
if (id) {
2218
history.push(Routes.Overview)
2319
} else {
2420
history.push(`${Routes.WalletWizard}${WalletWizardPath.Welcome}`)
2521
}
26-
}, [networks.length, id, history])
22+
}, [id, history])
2723

2824
return (
2925
<Panel isOpen type={PanelType.custom} customWidth="100vw">

packages/neuron-ui/src/components/Overview/index.tsx

Lines changed: 108 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import React, { useCallback, useMemo, useEffect } from 'react'
1+
import React, { useState, useCallback, useMemo, useEffect, useRef } from 'react'
22
import { RouteComponentProps } from 'react-router-dom'
33
import { useTranslation } from 'react-i18next'
44
import {
55
Stack,
66
Text,
7+
DefaultButton,
78
DetailsList,
89
DetailsRow,
910
IColumn,
@@ -13,6 +14,7 @@ import {
1314
IDetailsRowProps,
1415
IDetailsRowStyles,
1516
FontSizes,
17+
Callout,
1618
} from 'office-ui-fabric-react'
1719

1820
import { StateWithDispatch } from 'states/stateProvider/reducer'
@@ -79,16 +81,18 @@ const PropertyList = ({
7981
)
8082
const Overview = ({
8183
dispatch,
82-
wallet: { id, balance = '' },
84+
app: { tipBlockNumber, chain, epoch, difficulty },
85+
wallet: { id, name, balance = '' },
8386
chain: {
84-
networkID = '',
8587
transactions: { items = [] },
86-
tipBlockNumber = '0',
8788
},
88-
settings: { networks = [] },
8989
}: React.PropsWithoutRef<StateWithDispatch & RouteComponentProps>) => {
9090
const [t] = useTranslation()
91-
const currentNetwork = useMemo(() => networks.find(n => n.id === networkID), [networkID, networks])
91+
const [displayBlockchainInfo, setDisplayBlockchainInfo] = useState(false)
92+
const [displayMinerInfo, setDisplayMinerInfo] = useState(false)
93+
94+
const blockchainInfoRef = useRef<HTMLDivElement>(null)
95+
const minerInfoRef = useRef<HTMLDivElement>(null)
9296

9397
useEffect(() => {
9498
dispatch(actionCreators.getTransactions({ pageNo: 1, pageSize: PAGE_SIZE, keywords: '', walletID: id }))
@@ -182,6 +186,31 @@ const Overview = ({
182186
key: 'label',
183187
name: 'label',
184188
fieldName: 'label',
189+
maxWidth: 100,
190+
},
191+
{
192+
key: 'value',
193+
name: 'value',
194+
fieldName: 'value',
195+
},
196+
].map(col => ({
197+
isResizable: true,
198+
minWidth: 200,
199+
fieldName: col.key,
200+
ariaLabel: col.name,
201+
...col,
202+
})),
203+
[]
204+
)
205+
206+
const blockchainStatusColumns: IColumn[] = useMemo(
207+
() =>
208+
[
209+
{
210+
key: 'label',
211+
name: 'label',
212+
fieldName: 'label',
213+
maxWidth: 100,
185214
},
186215
{
187216
key: 'value',
@@ -201,70 +230,92 @@ const Overview = ({
201230
const balanceItems = useMemo(
202231
() => [
203232
{
204-
label: t('overview.amount'),
233+
label: t('overview.balance'),
205234
value: <span title={`${balance} shannon`}>{`${shannonToCKBFormatter(balance)} CKB`}</span>,
206235
},
207-
{ label: t('overview.live-cells'), value: 'mock living cells' },
208-
{ label: t('overview.cell-types'), value: 'mock cell typ' },
209236
],
210237
[t, balance]
211238
)
212-
213-
const blockchainStatusColumns = balanceColumns
214-
215239
const blockchainStatusItems = useMemo(
216240
() => [
217-
{ label: t('overview.blockchain-identity'), value: 'mock chain id' },
218-
{ label: t('overview.block-number'), value: localNumberFormatter(tipBlockNumber) },
219-
{ label: t('overview.rpc-service'), value: currentNetwork ? currentNetwork.name : '' },
241+
{
242+
label: t('overview.chain-identity'),
243+
value: chain,
244+
},
245+
{
246+
label: t('overview.tip-block-number'),
247+
value: localNumberFormatter(tipBlockNumber),
248+
},
249+
{
250+
label: t('overview.epoch'),
251+
value: epoch,
252+
},
253+
{
254+
label: t('overview.difficulty'),
255+
value: difficulty,
256+
},
220257
],
221-
[t, currentNetwork, tipBlockNumber]
258+
[t, chain, epoch, difficulty, tipBlockNumber]
222259
)
223260

261+
const showBlockchainStatus = useCallback(() => {
262+
setDisplayBlockchainInfo(true)
263+
}, [setDisplayBlockchainInfo])
264+
const hideBlockchainStatus = useCallback(() => {
265+
setDisplayBlockchainInfo(false)
266+
}, [setDisplayBlockchainInfo])
267+
const showMinerInfo = useCallback(() => {
268+
setDisplayMinerInfo(true)
269+
}, [setDisplayMinerInfo])
270+
const hideMinerInfo = useCallback(() => {
271+
setDisplayMinerInfo(false)
272+
}, [setDisplayMinerInfo])
273+
224274
return (
225-
<Stack horizontal horizontalAlign="space-evenly" verticalFill tokens={{ childrenGap: 15 }} wrap>
226-
<Stack
227-
tokens={{
228-
childrenGap: 15,
229-
}}
230-
styles={{
231-
root: {
232-
minWidth: '680px',
233-
},
234-
}}
235-
>
236-
<Stack>
237-
<Text as="h1" variant={TITLE_FONT_SIZE}>
238-
{t('overview.balance')}
239-
</Text>
240-
<PropertyList columns={balanceColumns} items={balanceItems} isHeaderVisible={false} />
275+
<Stack tokens={{ childrenGap: 15 }} verticalFill horizontalAlign="stretch">
276+
<Text as="h1" variant={TITLE_FONT_SIZE}>
277+
{name}
278+
</Text>
279+
<Stack horizontal>
280+
<PropertyList columns={balanceColumns} items={balanceItems} isHeaderVisible={false} />
281+
<Stack tokens={{ childrenGap: 15 }}>
282+
<div ref={blockchainInfoRef}>
283+
<DefaultButton onClick={showBlockchainStatus} styles={{ root: { width: '200px' } }}>
284+
Blockchain Status
285+
</DefaultButton>
286+
</div>
287+
<div ref={minerInfoRef}>
288+
<DefaultButton onClick={showMinerInfo} styles={{ root: { width: '200px' } }}>
289+
Miner Info
290+
</DefaultButton>
291+
</div>
241292
</Stack>
242-
<Stack.Item>
243-
<Text as="h1" variant={TITLE_FONT_SIZE}>
244-
{t('overview.blockchain-status')}
245-
</Text>
246-
{currentNetwork ? (
247-
<PropertyList columns={blockchainStatusColumns} items={blockchainStatusItems} isHeaderVisible={false} />
248-
) : null}
249-
</Stack.Item>
250-
</Stack>
251-
<Stack
252-
horizontalAlign="stretch"
253-
styles={{
254-
root: {
255-
minWidth: '680px',
256-
},
257-
}}
258-
>
259-
<Text as="h1" variant={TITLE_FONT_SIZE}>
260-
{t('overview.recent-activities')}
261-
</Text>
262-
{items.length ? (
263-
<PropertyList columns={activityColumns} items={items} onRenderRow={onTransactionRowRender} />
264-
) : (
265-
<div>{t('overview.no-recent-activities')}</div>
266-
)}
267293
</Stack>
294+
<Text as="h2" variant={TITLE_FONT_SIZE}>
295+
{t('overview.recent-activities')}
296+
</Text>
297+
{items.length ? (
298+
<PropertyList columns={activityColumns} items={items} onRenderRow={onTransactionRowRender} />
299+
) : (
300+
<div>{t('overview.no-recent-activities')}</div>
301+
)}
302+
{blockchainInfoRef.current ? (
303+
<Callout
304+
target={blockchainInfoRef.current}
305+
hidden={!displayBlockchainInfo}
306+
onDismiss={hideBlockchainStatus}
307+
gapSpace={0}
308+
>
309+
<Stack>
310+
<PropertyList columns={blockchainStatusColumns} items={blockchainStatusItems} isHeaderVisible={false} />
311+
</Stack>
312+
</Callout>
313+
) : null}
314+
{minerInfoRef.current ? (
315+
<Callout target={minerInfoRef.current} hidden={!displayMinerInfo} onDismiss={hideMinerInfo} gapSpace={0}>
316+
Miner Info
317+
</Callout>
318+
) : null}
268319
</Stack>
269320
)
270321
}

packages/neuron-ui/src/components/WalletWizard/index.tsx

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import withWizard, { WizardElementProps, WithWizardState } from 'components/with
88
import { MnemonicAction, BUTTON_GAP } from 'utils/const'
99
import { verifyWalletSubmission } from 'utils/validators'
1010
import { helpersCall, walletsCall } from 'services/UILayer'
11+
import { validateMnemonic, showErrorMessage } from 'services/remote'
1112
import { registerIcons, buttonGrommetIconStyles } from 'utils/icons'
1213

1314
export enum WalletWizardPath {
@@ -138,13 +139,18 @@ const Mnemonic = ({
138139
if (isCreate) {
139140
history.push(`${rootPath}${WalletWizardPath.Mnemonic}/${MnemonicAction.Verify}`)
140141
} else {
141-
history.push(
142-
`${rootPath}${WalletWizardPath.Submission}/${
143-
type === MnemonicAction.Verify ? MnemonicAction.Create : MnemonicAction.Import
144-
}`
145-
)
142+
const isMnemonicValid = validateMnemonic(imported)
143+
if (isMnemonicValid) {
144+
history.push(
145+
`${rootPath}${WalletWizardPath.Submission}/${
146+
type === MnemonicAction.Verify ? MnemonicAction.Create : MnemonicAction.Import
147+
}`
148+
)
149+
} else {
150+
showErrorMessage(t('messages.error'), t('messages.invalid-mnemonic'))
151+
}
146152
}
147-
}, [isCreate, history, rootPath, type])
153+
}, [isCreate, history, rootPath, type, imported, t])
148154

149155
return (
150156
<Stack verticalFill verticalAlign="center" horizontalAlign="stretch" tokens={{ childrenGap: 15 }}>

packages/neuron-ui/src/containers/Footer/index.tsx

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { Alert as AlertIcon, Nodes as ConnectIcon } from 'grommet-icons'
77

88
import { StateWithDispatch } from 'states/stateProvider/reducer'
99
import { ConnectStatus, FULL_SCREENS, Routes } from 'utils/const'
10+
import { localNumberFormatter } from 'utils/formatters'
1011
import { NeuronWalletContext } from 'states/stateProvider'
1112

1213
const theme = getTheme()
@@ -39,10 +40,14 @@ export const SyncStatus = ({
3940
{+syncedBlockNumber + bufferBlockNumber < +tipBlockNumber ? (
4041
<>
4142
{t('sync.syncing')}
42-
<ProgressIndicator percentComplete={percentage} styles={{ root: { width: '120px', marginLeft: '5px' } }} />
43+
<ProgressIndicator
44+
percentComplete={percentage}
45+
styles={{ root: { width: '120px', marginLeft: '5px', marginRight: '5px' } }}
46+
/>
47+
{`${localNumberFormatter(syncedBlockNumber) || '0'}/${localNumberFormatter(tipBlockNumber) || '0'}`}
4348
</>
4449
) : (
45-
t('sync.synced')
50+
<>{`${t('sync.synced')}, ${t('sync.block-number')}: ${localNumberFormatter(tipBlockNumber)}`}</>
4651
)}
4752
</div>
4853
)

0 commit comments

Comments
 (0)