Skip to content

Commit 3b0b5cd

Browse files
ashchanashchan
authored
Merge pull request #651 from nervosnetwork/rc/v0.1.0-alpha.7
[ᚬmaster] Release v0.1.0 alpha.7
2 parents c7d64ba + 53edd46 commit 3b0b5cd

File tree

28 files changed

+800
-434
lines changed

28 files changed

+800
-434
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.6",
5+
"version": "0.1.0-alpha.7",
66
"npmClient": "yarn",
77
"useWorkspaces": true
88
}

‎package.json‎

Lines changed: 3 additions & 3 deletions
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.6",
5+
"version": "0.1.0-alpha.7",
66
"private": true,
77
"author": {
88
"name": "Nervos Core Dev",
@@ -30,8 +30,8 @@
3030
"test:e2e": "yarn build && ./scripts/copy-ui-files.sh && lerna run --parallel test:e2e",
3131
"lint": "lerna run --stream lint",
3232
"postinstall": "lerna run rebuild:nativemodules",
33-
"db:migrate": "ts-node ./node_modules/.bin/typeorm migration:generate",
34-
"address-db": "ts-node ./node_modules/.bin/typeorm --config ormconfig-address.json"
33+
"db:chain": "ts-node ./node_modules/.bin/typeorm",
34+
"db:address": "ts-node ./node_modules/.bin/typeorm --config ormconfig-address.json"
3535
},
3636
"husky": {
3737
"hooks": {

‎packages/neuron-ui/package.json‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@nervosnetwork/neuron-ui",
3-
"version": "0.1.0-alpha.6",
3+
"version": "0.1.0-alpha.7",
44
"private": true,
55
"author": {
66
"name": "Nervos Core Dev",
@@ -39,14 +39,14 @@
3939
"last 2 chrome versions"
4040
],
4141
"dependencies": {
42+
"@nervosnetwork/ckb-sdk-core": "0.15.1",
43+
"@uifabric/experiments": "7.4.2",
4244
"@uifabric/styling": "7.1.1",
43-
"bootstrap": "4.3.1",
4445
"grommet-icons": "4.2.0",
4546
"i18next": "15.1.3",
4647
"office-ui-fabric-react": "7.6.1",
4748
"qr.js": "0.0.0",
4849
"react": "16.8.6",
49-
"react-bootstrap": "1.0.0-beta.9",
5050
"react-dom": "16.8.6",
5151
"react-i18next": "10.11.0",
5252
"react-router-dom": "5.0.0",

‎packages/neuron-ui/src/components/History/index.tsx‎

Lines changed: 34 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,15 @@
1-
import React, { useCallback, useMemo } from 'react'
2-
import { NavLink, RouteComponentProps } from 'react-router-dom'
1+
import React, { useCallback } from 'react'
2+
import { RouteComponentProps } from 'react-router-dom'
33
import { useTranslation } from 'react-i18next'
44
import { Stack, SearchBox, getTheme } from 'office-ui-fabric-react'
5-
import { Search as SearchIcon } from 'grommet-icons'
5+
import { Pagination } from '@uifabric/experiments'
6+
import {
7+
Search as SearchIcon,
8+
LinkDown as LinkDownIcon,
9+
LinkBottom as LinkBottomIcon,
10+
LinkTop as LinkTopIcon,
11+
LinkUp as LinkUpIcon,
12+
} from 'grommet-icons'
613

714
import TransactionList from 'components/TransactionList'
815
import { StateWithDispatch } from 'states/stateProvider/reducer'
@@ -17,6 +24,10 @@ const { semanticColors } = theme
1724
registerIcons({
1825
icons: {
1926
Search: <SearchIcon size="16px" color={semanticColors.menuIcon} />,
27+
FirstPage: <LinkTopIcon size="16px" color={semanticColors.menuIcon} style={{ transform: 'rotate(-90deg)' }} />,
28+
LastPage: <LinkBottomIcon size="16px" color={semanticColors.menuIcon} style={{ transform: 'rotate(-90deg)' }} />,
29+
PrevPage: <LinkUpIcon size="16px" color={semanticColors.menuIcon} style={{ transform: 'rotate(-90deg)' }} />,
30+
NextPage: <LinkDownIcon size="16px" color={semanticColors.menuIcon} style={{ transform: 'rotate(-90deg)' }} />,
2031
},
2132
})
2233

@@ -33,7 +44,6 @@ const History = ({
3344

3445
const { keywords, onKeywordsChange } = useSearch(search, incomingKeywords, id, dispatch)
3546
const onSearch = useCallback(() => history.push(`${Routes.History}?keywords=${keywords}`), [history, keywords])
36-
const totalPages = useMemo(() => Math.ceil(totalCount / pageSize) || 1, [totalCount, pageSize])
3747

3848
return (
3949
<Stack>
@@ -48,28 +58,26 @@ const History = ({
4858
/>
4959
</Stack>
5060
<TransactionList walletID={id} items={items} dispatch={dispatch} />
51-
<div style={{ display: 'flex', justifyContent: 'center' }}>
52-
<NavLink to={`${Routes.History}?pageNo=1`}>{t('history.first')}</NavLink>
53-
<NavLink
54-
to={`${Routes.History}?pageNo=${pageNo - 1}`}
55-
style={{
56-
pointerEvents: pageNo - 1 < 1 ? 'none' : 'auto',
57-
color: pageNo - 1 < 1 ? 'grey' : '#007bff',
58-
}}
59-
>
60-
{t('history.previous')}
61-
</NavLink>
62-
<NavLink
63-
to={`${Routes.History}?pageNo=${pageNo + 1}`}
64-
style={{
65-
pointerEvents: pageNo + 1 > totalPages ? 'none' : 'auto',
66-
color: pageNo + 1 > totalPages ? 'grey' : '#007bff',
67-
}}
68-
>
69-
{t('history.next')}
70-
</NavLink>
71-
<NavLink to={`${Routes.History}?pageNo=${totalPages}`}>{t('history.last')}</NavLink>
72-
</div>
61+
<Pagination
62+
selectedPageIndex={pageNo - 1}
63+
pageCount={Math.ceil(totalCount / pageSize)}
64+
itemsPerPage={pageSize}
65+
totalItemCount={totalCount}
66+
previousPageAriaLabel={t('pagination.previous-page')}
67+
nextPageAriaLabel={t('pagination.next-page')}
68+
firstPageAriaLabel={t('pagination.first-page')}
69+
lastPageAriaLabel={t('pagination.last-page')}
70+
pageAriaLabel={t('pagination-page')}
71+
selectedAriaLabel={t('pagination-selected')}
72+
firstPageIconProps={{ iconName: 'FirstPage' }}
73+
previousPageIconProps={{ iconName: 'PrevPage' }}
74+
nextPageIconProps={{ iconName: 'NextPage' }}
75+
lastPageIconProps={{ iconName: 'LastPage' }}
76+
format="buttons"
77+
onPageChange={(idx: number) => {
78+
history.push(`${Routes.History}?pageNo=${idx + 1}`)
79+
}}
80+
/>
7381
</Stack>
7482
)
7583
}

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

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ const PropertyList = ({
7777
{...props}
7878
/>
7979
)
80-
const General = ({
80+
const Overview = ({
8181
dispatch,
8282
wallet: { id, balance = '' },
8383
chain: {
@@ -128,7 +128,7 @@ const General = ({
128128
if (item) {
129129
return (
130130
<Text variant="mediumPlus" as="span">
131-
{item.timestamp ? timeFormatter.format(+item.timestamp).toLocaleString() : '-'}
131+
{timeFormatter.format(+(item.timestamp || item.createdAt)).toLocaleString()}
132132
</Text>
133133
)
134134
}
@@ -183,7 +183,7 @@ const General = ({
183183
},
184184
].map(col => ({
185185
isResizable: true,
186-
minWidth: MIN_CELL_WIDTH,
186+
minWidth: 200,
187187
fieldName: col.key,
188188
ariaLabel: col.name,
189189
...col,
@@ -194,7 +194,7 @@ const General = ({
194194
const balanceItems = useMemo(
195195
() => [
196196
{ label: t('overview.amount'), value: balance },
197-
{ label: t('overview.live-cells'), value: 'mock livigin cells' },
197+
{ label: t('overview.live-cells'), value: 'mock living cells' },
198198
{ label: t('overview.cell-types'), value: 'mock cell typ' },
199199
],
200200
[t, balance]
@@ -243,6 +243,6 @@ const General = ({
243243
)
244244
}
245245

246-
General.displayName = 'General'
246+
Overview.displayName = 'Overview'
247247

248-
export default General
248+
export default Overview

‎packages/neuron-ui/src/components/Receive/index.tsx‎

Lines changed: 41 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import React, { useState, useCallback, useMemo } from 'react'
22
import { RouteComponentProps } from 'react-router-dom'
33
import { useTranslation } from 'react-i18next'
4-
import { Stack, TextField, TooltipHost, Modal } from 'office-ui-fabric-react'
5-
import styled from 'styled-components'
4+
import { Stack, Text, TextField, TooltipHost, Modal } from 'office-ui-fabric-react'
65

76
import { StateWithDispatch } from 'states/stateProvider/reducer'
87
import QRCode from 'widgets/QRCode'
@@ -14,15 +13,6 @@ declare global {
1413
}
1514
}
1615

17-
const QRCodePanel = styled.div`
18-
width: 300px;
19-
margin: 50px 0 0 30px;
20-
`
21-
22-
const QRCodeModal = styled.div`
23-
text-align: center;
24-
`
25-
2616
const Receive = ({
2717
wallet: { addresses = [] },
2818
match: { params },
@@ -32,7 +22,9 @@ const Receive = ({
3222

3323
const accountAddress = useMemo(
3424
() =>
35-
params.address || (addresses.find(addr => addr.type === 0 && addr.txCount === 0) || { address: '' }).address || '',
25+
params.address ||
26+
(addresses.find(addr => addr.type === 0 && addr.txCount === 0) || { address: '' }).address ||
27+
'',
3628
[params, addresses]
3729
)
3830

@@ -45,29 +37,45 @@ const Receive = ({
4537
}
4638

4739
return (
48-
<Stack>
49-
<QRCodePanel onClick={() => setShowLargeQRCode(true)} style={{ alignSelf: 'center' }}>
40+
<Stack tokens={{ childrenGap: 15 }} horizontalAlign="center">
41+
<Stack onClick={() => setShowLargeQRCode(true)} style={{ alignSelf: 'center' }}>
5042
<QRCode value={accountAddress} size={256} />
51-
</QRCodePanel>
52-
<TooltipHost content={t('receive.click-to-copy')} calloutProps={{ gapSpace: 0 }}>
53-
<Stack horizontal horizontalAlign="stretch" tokens={{ childrenGap: 15 }}>
54-
<TextField
55-
styles={{ root: { flex: 1 } }}
56-
readOnly
57-
placeholder={accountAddress}
58-
onClick={copyAddress}
59-
description={t('receive.prompt')}
60-
/>
61-
<Copy onClick={copyAddress} />
62-
</Stack>
63-
</TooltipHost>
43+
</Stack>
44+
<Stack styles={{ root: { maxWidth: 500 } }}>
45+
<TooltipHost content={t('receive.click-to-copy')} calloutProps={{ gapSpace: 0 }}>
46+
<Stack horizontal horizontalAlign="stretch" tokens={{ childrenGap: 15 }}>
47+
<TextField
48+
styles={{ root: { flex: 1 } }}
49+
readOnly
50+
placeholder={accountAddress}
51+
onClick={copyAddress}
52+
description={t('receive.prompt')}
53+
/>
54+
<Copy onClick={copyAddress} />
55+
</Stack>
56+
</TooltipHost>
57+
</Stack>
6458
<Modal isOpen={showLargeQRCode} onDismiss={() => setShowLargeQRCode(false)}>
65-
<div>{t('receive.address-qrcode')}</div>
66-
<div>
67-
<QRCodeModal>
68-
<QRCode value={accountAddress} size={400} />
69-
</QRCodeModal>
70-
</div>
59+
<Stack
60+
styles={{
61+
root: {
62+
background: '#eee',
63+
},
64+
}}
65+
>
66+
<Text
67+
variant="large"
68+
as="h1"
69+
style={{
70+
padding: '0 15px',
71+
}}
72+
>
73+
{t('receive.address-qrcode')}
74+
</Text>
75+
</Stack>
76+
<Stack padding="15px">
77+
<QRCode value={accountAddress} size={400} />
78+
</Stack>
7179
</Modal>
7280
</Stack>
7381
)

0 commit comments

Comments
 (0)