Merge pull request #680 from nervosnetwork/rc/v0.1.0-alpha.9

[ᚬmaster] Release v0.1.0 alpha.9
nervosnetwork · Jul 17, 2019 · ff61c51 · ff61c51
2 parents 9fea146 + 6e3e0f8
commit ff61c51
Show file tree

Hide file tree

Showing 29 changed files with 231 additions and 50 deletions.
diff --git a/lerna.json b/lerna.json
@@ -2,7 +2,7 @@
   "packages": [
     "packages/*"
   ],
-  "version": "0.1.0-alpha.8",
+  "version": "0.1.0-alpha.9",
   "npmClient": "yarn",
   "useWorkspaces": true
 }
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
   "name": "@nervosnetwork/neuron",
   "productName": "Neuron",
   "description": "CKB Neuron Wallet",
-  "version": "0.1.0-alpha.8",
+  "version": "0.1.0-alpha.9",
   "private": true,
   "author": {
     "name": "Nervos Core Dev",

diff --git a/packages/neuron-ui/package.json b/packages/neuron-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@nervosnetwork/neuron-ui",
-  "version": "0.1.0-alpha.8",
+  "version": "0.1.0-alpha.9",
   "private": true,
   "author": {
     "name": "Nervos Core Dev",

diff --git a/packages/neuron-ui/src/components/ErrorBoundary/index.tsx b/packages/neuron-ui/src/components/ErrorBoundary/index.tsx
@@ -0,0 +1,39 @@
+import React, { Component } from 'react'
+import { appCalls } from 'services/UILayer'
+import { Stack, Spinner } from 'office-ui-fabric-react'
+
+const handleError = (error: Error) => {
+  appCalls.handleViewError(error.toString())
+  setTimeout(() => {
+    window.location.reload()
+  }, 0)
+  return { hasError: true }
+}
+
+class ErrorBoundary extends Component<{ children: React.ReactChild }, { hasError: boolean }> {
+  state = {
+    hasError: false,
+  }
+
+  static getDerivedStateFromError(error: Error) {
+    return handleError(error)
+  }
+
+  public componentDidCatch(error: Error) {
+    this.setState(handleError(error))
+  }
+
+  render() {
+    const { hasError } = this.state
+    const { children } = this.props
+    return hasError ? (
+      <Stack verticalFill verticalAlign="center">
+        <Spinner />
+      </Stack>
+    ) : (
+      children
+    )
+  }
+}
+
+export default ErrorBoundary
diff --git a/packages/neuron-ui/src/components/History/index.tsx b/packages/neuron-ui/src/components/History/index.tsx
@@ -50,8 +50,8 @@ const History = ({
       <Stack horizontal horizontalAlign="end" tokens={{ childrenGap: 15 }}>
         <SearchBox
           value={keywords}
-          styles={{ root: { width: 200 } }}
-          placeholder="Search"
+          styles={{ root: { width: 500 } }}
+          placeholder={t('history.search.placeholder')}
           onChange={onKeywordsChange}
           onSearch={onSearch}
           iconProps={{ iconName: 'Search', styles: { root: { height: '18px' } } }}

diff --git a/packages/neuron-ui/src/components/TransactionList/index.tsx b/packages/neuron-ui/src/components/TransactionList/index.tsx
@@ -89,11 +89,11 @@ const TransactionList = ({
           key: 'hash',
           fieldName: 'hash',
           minWidth: 100,
-          maxWidth: 500,
+          maxWidth: 600,
           onRender: (item?: FormatTransaction) => {
             if (item) {
               return (
-                <span className="text-overflow" title={item.hash}>
+                <span className="text-overflow fixedWidth" title={item.hash}>
                   {item.hash}
                 </span>
               )
@@ -187,7 +187,7 @@ const TransactionList = ({
     <DetailsList
       columns={transactionColumns}
       items={txs}
-      groups={groups}
+      groups={groups.filter(group => group.count !== 0)}
       groupProps={{
         onRenderHeader,
       }}

diff --git a/packages/neuron-ui/src/containers/Footer/index.tsx b/packages/neuron-ui/src/containers/Footer/index.tsx
@@ -22,26 +22,33 @@ const stackItemStyles = {
   root: [theme.fonts.small],
 }
 
-const SyncStatus = ({
+export const SyncStatus = ({
   tipBlockNumber = '',
-  syncBlockNumber = '',
-}: React.PropsWithoutRef<{ tipBlockNumber: string; syncBlockNumber: string }>) => {
+  syncedBlockNumber = '',
+  bufferBlockNumber = 10,
+}: React.PropsWithoutRef<{ tipBlockNumber: string; syncedBlockNumber: string; bufferBlockNumber?: number }>) => {
   const [t] = useTranslation()
   if (tipBlockNumber === '') {
     return <Text variant="small">{t('footer.fail-to-fetch-tip-block-number')}</Text>
   }
 
-  const percentage = +syncBlockNumber / +tipBlockNumber
+  const percentage = +syncedBlockNumber / +tipBlockNumber
 
   return (
     <div style={{ display: 'flex', alignItems: 'center', fontSize: theme.fonts.small.fontSize }}>
-      {t('sync.syncing')}
-      <ProgressIndicator percentComplete={percentage} styles={{ root: { width: '120px', marginLeft: '5px' } }} />
+      {+syncedBlockNumber + bufferBlockNumber < +tipBlockNumber ? (
+        <>
+          {t('sync.syncing')}
+          <ProgressIndicator percentComplete={percentage} styles={{ root: { width: '120px', marginLeft: '5px' } }} />
+        </>
+      ) : (
+        t('sync.synced')
+      )}
     </div>
   )
 }
 
-const NetworkStatus = ({ name, online }: { name: string; online: boolean }) => {
+export const NetworkStatus = ({ name, online }: { name: string; online: boolean }) => {
   return (
     <Stack horizontal verticalAlign="center" tokens={{ childrenGap: 5 }}>
       {online ? <ConnectIcon size="small" color="green" /> : <AlertIcon size="small" color="red" />}
@@ -56,7 +63,7 @@ const Footer = ({
 }: React.PropsWithoutRef<StateWithDispatch & RouteComponentProps>) => {
   const {
     app: { tipBlockNumber },
-    chain: { networkID, connectStatus },
+    chain: { networkID, connectStatus, tipBlockNumber: syncedBlockNumber },
     settings: { networks },
   } = useContext(NeuronWalletContext)
   const [t] = useTranslation()
@@ -80,7 +87,7 @@ const Footer = ({
       styles={stackStyles}
     >
       <Stack.Item styles={stackItemStyles}>
-        <SyncStatus tipBlockNumber={tipBlockNumber} syncBlockNumber="100" />
+        <SyncStatus tipBlockNumber={tipBlockNumber} syncedBlockNumber={syncedBlockNumber} />
       </Stack.Item>
 
       <Stack styles={stackItemStyles} onClick={goToNetworksSetting} horizontal>

diff --git a/packages/neuron-ui/src/containers/Main/hooks.ts b/packages/neuron-ui/src/containers/Main/hooks.ts
@@ -52,8 +52,12 @@ export const useChannelListeners = ({
       (
         _e: Event,
         _actionType: 'create' | 'update' | 'delete',
-        dataType: 'address' | 'transaction' | 'wallet' | 'network'
+        dataType: 'address' | 'transaction' | 'wallet' | 'network',
+        walletIDOfMessage?: string
       ) => {
+        if (walletIDOfMessage && walletIDOfMessage !== walletID) {
+          return
+        }
         switch (dataType) {
           case 'address': {
             walletsCall.getAllAddresses(walletID)
@@ -198,7 +202,7 @@ export const useChannelListeners = ({
             dispatch({
               type: NeuronWalletActions.Chain,
               payload: {
-                tipBlockNumber: args.result,
+                tipBlockNumber: args.result || '0',
               },
             })
             break
@@ -335,7 +339,7 @@ export const useChannelListeners = ({
             })
             break
           }
-          case WalletsMethod.AllAddresses: {
+          case WalletsMethod.GetAllAddresses: {
             const addresses = args.result || []
             dispatch({
               type: NeuronWalletActions.Wallet,

diff --git a/packages/neuron-ui/src/index.tsx b/packages/neuron-ui/src/index.tsx
@@ -11,6 +11,7 @@ import Navbar from 'containers/Navbar'
 import Notification from 'containers/Notification'
 import Main from 'containers/Main'
 import Footer from 'containers/Footer'
+import ErrorBoundary from 'components/ErrorBoundary'
 import withProviders from 'states/stateProvider'
 
 loadTheme({
@@ -63,7 +64,11 @@ const App = withProviders(({ dispatch }: any) => (
         <Route
           {...container}
           key={container.name}
-          render={routeProps => <container.comp {...routeProps} dispatch={dispatch} />}
+          render={routeProps => (
+            <ErrorBoundary>
+              <container.comp {...routeProps} dispatch={dispatch} />
+            </ErrorBoundary>
+          )}
         />
       )
     })}

diff --git a/packages/neuron-ui/src/locales/en.json b/packages/neuron-ui/src/locales/en.json
@@ -16,7 +16,7 @@
       "balance": "Balance",
       "live-cells": "Live Cells",
       "cell-types": "Cell Types",
-      "recent-activities": "Recent Activites",
+      "recent-activities": "Recent Activities",
       "no-recent-activities": "No Recent Activities",
       "blockchain-status": "Blockchain Status",
       "blockchain-identity": "Chain Identity",
@@ -71,7 +71,7 @@
     "receive": {
       "click-to-copy": "Click to copy the address",
       "address-not-found": "Address not found",
-      "prompt": "Neuron picks a new receiving address for better privacy. Please go to the Address Book if you want to use a previously used receiving addresses.",
+      "prompt": "Neuron picks a new receiving address for better privacy. Please go to the Address Book if you want to use a previously used receiving address.",
       "address-qrcode": "Address QR Code"
     },
     "history": {
@@ -94,7 +94,10 @@
       "description": "Description",
       "status": "Status",
       "blockNumber": "Block Number",
-      "basic-information": "Basic Information"
+      "basic-information": "Basic Information",
+      "search": {
+        "placeholder": "Search tx hash, address or date (yyyy-mm-dd)"
+      }
     },
     "transaction": {
       "goBack": "Go back"
@@ -207,7 +210,8 @@
       "no-transactions": "No transactions"
     },
     "sync": {
-      "syncing": "Syncing"
+      "syncing": "Syncing",
+      "synced": "Synced"
     },
     "pagination": {
       "previous-page": "Previous page",

diff --git a/packages/neuron-ui/src/locales/zh.json b/packages/neuron-ui/src/locales/zh.json
@@ -94,7 +94,10 @@
       "description": "标签",
       "status": "状态",
       "blockNumber": "区块高度",
-      "basic-information": "基本信息"
+      "basic-information": "基本信息",
+      "search": {
+        "placeholder": "使用交易哈希、地址或日期(yyyy-mm-dd)进行搜索"
+      }
     },
     "transaction": {
       "goBack": "返回"
@@ -207,7 +210,8 @@
       "no-transactions": "没有交易"
     },
     "sync": {
-      "syncing": "同步中"
+      "syncing": "同步中",
+      "synced": "同步完成"
     },
     "pagination": {
       "previous-page": "上一页",

diff --git a/packages/neuron-ui/src/services/UILayer.ts b/packages/neuron-ui/src/services/UILayer.ts
@@ -7,6 +7,7 @@ export enum AppMethod {
   ContextMenu = 'contextMenu',
   NavTo = 'navTo',
   SetUILocale = 'setUILocale',
+  HandleViewError = 'handleViewError',
 }
 
 export enum ChainMethod {
@@ -29,7 +30,6 @@ export enum WalletsMethod {
   Backup = 'backup',
   SendCapacity = 'sendCapacity',
   SendingStatus = 'sendingStatus',
-  AllAddresses = 'allAddresses',
   UpdateAddressDescription = 'updateAddressDescription',
   RequestPassword = 'requestPassword',
   GetAllAddresses = 'getAllAddresses',
@@ -93,7 +93,8 @@ export const app = (method: AppMethod, ...params: any) => {
 }
 
 export const appCalls = instantiateMethodCall(app) as {
-  contextMenu: ({ type, id }: { type: string; id: string }) => Promise<void>
+  contextMenu: ({ type, id }: { type: string; id: string }) => void
+  handleViewError: (errorMessage: string) => void
 }
 
 export const networks = (method: NetworksMethod, ...params: any[]) => {

diff --git a/packages/neuron-ui/src/stories/SyncStatus.stories.tsx b/packages/neuron-ui/src/stories/SyncStatus.stories.tsx
@@ -0,0 +1,42 @@
+import React from 'react'
+import { storiesOf } from '@storybook/react'
+import { SyncStatus } from 'containers/Footer'
+
+const stories = storiesOf('SyncStatus', module)
+
+const states = {
+  '0/0': {
+    tipBlockNumber: '0',
+    syncedBlockNumber: '0',
+    bufferBlockNumber: 10,
+  },
+  '0/100': {
+    tipBlockNumber: '0',
+    syncedBlockNumber: '0',
+    bufferBlockNumber: 10,
+  },
+  'syncing 10/100': {
+    tipBlockNumber: '100',
+    syncedBlockNumber: '10',
+    bufferBlockNumber: 10,
+  },
+  'buffering 89/100': {
+    tipBlockNumber: '100',
+    syncedBlockNumber: '89',
+    bufferBlockNumber: 10,
+  },
+  'synced 90/100': {
+    tipBlockNumber: '100',
+    syncedBlockNumber: '90',
+    bufferBlockNumber: 10,
+  },
+  'synced 100/100': {
+    tipBlockNumber: '100',
+    syncedBlockNumber: '100',
+    bufferBlockNumber: 10,
+  },
+}
+
+Object.entries(states).forEach(([title, props]) => {
+  stories.add(title, () => <SyncStatus {...props} />)
+})
diff --git a/packages/neuron-ui/src/stories/TransactionList.stories.tsx b/packages/neuron-ui/src/stories/TransactionList.stories.tsx
@@ -7,3 +7,11 @@ const stories = storiesOf('TransactionList', module)
 Object.entries(transactions).forEach(([title, list]) => {
   stories.add(title, () => <TransactionList walletID="1" items={list} dispatch={() => {}} />)
 })
+
+stories.add('Wtih empty pending list', () => (
+  <TransactionList
+    walletID="1"
+    items={transactions['Content List'].filter(item => item.status !== 'pending')}
+    dispatch={() => {}}
+  />
+))
diff --git a/packages/neuron-ui/src/stories/index.tsx b/packages/neuron-ui/src/stories/index.tsx
@@ -8,3 +8,4 @@ import './WalletSetting.stories'
 import './NetworkSetting.stories'
 import './PasswordRequest.stories'
 import './TransactionFeePanel.stories'
+import './SyncStatus.stories'
diff --git a/packages/neuron-wallet/package.json b/packages/neuron-wallet/package.json
@@ -3,7 +3,7 @@
   "productName": "Neuron",
   "description": "CKB Neuron Wallet",
   "homepage": "https://www.nervos.org/",
-  "version": "0.1.0-alpha.8",
+  "version": "0.1.0-alpha.9",
   "private": true,
   "author": {
     "name": "Nervos Core Dev",
@@ -48,7 +48,7 @@
   },
   "devDependencies": {
     "@nervosnetwork/ckb-types": "0.15.1",
-    "@nervosnetwork/neuron-ui": "0.1.0-alpha.8",
+    "@nervosnetwork/neuron-ui": "0.1.0-alpha.9",
     "@types/async": "3.0.0",
     "@types/electron-devtools-installer": "2.2.0",
     "@types/elliptic": "6.4.8",