Merge pull request #985 from nervosnetwork/rc/v0.22.1

[ᚬmaster] Rc/v0.22.1

CHANGELOG.md

@@ -1,3 +1,25 @@
+## [0.22.1](https://github.com/nervosnetwork/neuron/compare/v0.22.0...v0.22.1) (2019-10-15)
+
+
+### Bug Fixes
+
+* not sync after switch network ([be5a014](https://github.com/nervosnetwork/neuron/commit/be5a014))
+* **neuron-ui:** fix the type of script.args from string[] to string ([aa34515](https://github.com/nervosnetwork/neuron/commit/aa34515))
+
+
+### Features
+
+* **neuron-ui:** add loading effects on creating/import wallets ([8508965](https://github.com/nervosnetwork/neuron/commit/8508965))
+* **neuron-ui:** add loading on creating networks ([8b89b1e](https://github.com/nervosnetwork/neuron/commit/8b89b1e))
+* **neuron-ui:** dismiss pinned top alert if it's related to auto-dismissed notifications ([b1ea6d5](https://github.com/nervosnetwork/neuron/commit/b1ea6d5))
+* **neuron-ui:** make the alert of lacking remote module more clear ([a36abba](https://github.com/nervosnetwork/neuron/commit/a36abba))
+* **neuron-ui:** remove eslint rule of no-bitwise ([c5c5101](https://github.com/nervosnetwork/neuron/commit/c5c5101))
+* **neuron-ui:** update loading style of submit button for importing/creating wallets ([7469911](https://github.com/nervosnetwork/neuron/commit/7469911))
+* **neuron-ui:** update the epoch index ([7599cb7](https://github.com/nervosnetwork/neuron/commit/7599cb7))
+* add lock to input ([436b388](https://github.com/nervosnetwork/neuron/commit/436b388))
+
+
+
 # [0.22.0](https://github.com/nervosnetwork/neuron/compare/v0.21.0-beta.1...v0.22.0) (2019-10-09)
 
 

lerna.json

@@ -2,7 +2,7 @@
   "packages": [
     "packages/*"
   ],
-  "version": "0.22.0",
+  "version": "0.22.1",
   "npmClient": "yarn",
   "useWorkspaces": true
 }

package.json

@@ -2,7 +2,7 @@
   "name": "neuron",
   "productName": "Neuron",
   "description": "CKB Neuron Wallet",
-  "version": "0.22.0",
+  "version": "0.22.1",
   "private": true,
   "author": {
     "name": "Nervos Core Dev",

packages/neuron-ui/.eslintrc.js

@@ -72,7 +72,8 @@ module.exports = {
     "no-alert": [0],
     "no-console": [2, {
       "allow": ["info", "warn", "error", "group", "groupEnd"]
-    }]
+    }],
+    "no-bitwise": [0]
   },
   "env": {
     "jest": true,

packages/neuron-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "neuron-ui",
-  "version": "0.22.0",
+  "version": "0.22.1",
   "private": true,
   "author": {
     "name": "Nervos Core Dev",

packages/neuron-ui/src/components/History/hooks.ts

@@ -1,6 +1,6 @@
 import { useState, useEffect } from 'react'
 import { updateTransactionList } from 'states/stateProvider/actionCreators/transactions'
-import { queryParsers } from 'utils/parser'
+import { queryParsers } from 'utils/parsers'
 import { backToTop } from 'utils/animations'
 
 export const useSearch = (search: string = '', walletID: string = '', dispatch: React.Dispatch<any>) => {

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

@@ -1,6 +1,6 @@
 import React, { useState, useCallback, useMemo, useEffect } from 'react'
 import { RouteComponentProps } from 'react-router-dom'
-import { Stack, DefaultButton, PrimaryButton, TextField } from 'office-ui-fabric-react'
+import { Stack, DefaultButton, PrimaryButton, TextField, Spinner } from 'office-ui-fabric-react'
 import { useTranslation } from 'react-i18next'
 import { showOpenDialog } from 'services/remote'
 import { importWalletWithKeystore } from 'states/stateProvider/actionCreators'
@@ -29,6 +29,7 @@ const ImportKeystore = (props: React.PropsWithoutRef<StateWithDispatch & RouteCo
     settings: { wallets },
   } = props
   const [fields, setFields] = useState(defaultFields)
+  const [loading, setLoading] = useState(false)
   const goBack = useGoBack(history)
 
   useEffect(() => {
@@ -66,12 +67,18 @@ const ImportKeystore = (props: React.PropsWithoutRef<StateWithDispatch & RouteCo
   }, [fields])
 
   const onSubmit = useCallback(() => {
-    importWalletWithKeystore({
-      name: fields.name || '',
-      keystorePath: fields.path,
-      password: fields.password,
-    })(dispatch, history)
-  }, [fields.name, fields.password, fields.path, history, dispatch])
+    if (loading) {
+      return
+    }
+    setLoading(true)
+    setTimeout(() => {
+      importWalletWithKeystore({
+        name: fields.name || '',
+        keystorePath: fields.path,
+        password: fields.password,
+      })(dispatch, history).finally(() => setLoading(false))
+    }, 200)
+  }, [fields.name, fields.password, fields.path, history, dispatch, loading])
 
   return (
     <Stack verticalFill verticalAlign="center" tokens={{ childrenGap: 15 }}>
@@ -117,9 +124,15 @@ const ImportKeystore = (props: React.PropsWithoutRef<StateWithDispatch & RouteCo
       </Stack>
       <Stack horizontal horizontalAlign="end" tokens={{ childrenGap: 15 }}>
         <DefaultButton onClick={goBack}>{t('import-keystore.button.back')}</DefaultButton>
-        <PrimaryButton disabled={!(fields.name && fields.path && fields.password && !isNameUsed)} onClick={onSubmit}>
-          {t('import-keystore.button.submit')}
-        </PrimaryButton>
+        {loading ? (
+          <PrimaryButton disabled>
+            <Spinner />
+          </PrimaryButton>
+        ) : (
+          <PrimaryButton disabled={!(fields.name && fields.path && fields.password && !isNameUsed)} onClick={onSubmit}>
+            {t('import-keystore.button.submit')}
+          </PrimaryButton>
+        )}
       </Stack>
     </Stack>
   )

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

@@ -26,6 +26,7 @@ import { updateTransactionList } from 'states/stateProvider/actionCreators'
 import { showTransactionDetails } from 'services/remote'
 
 import { localNumberFormatter, shannonToCKBFormatter, uniformTimeFormatter as timeFormatter } from 'utils/formatters'
+import { epochParser } from 'utils/parsers'
 import { PAGE_SIZE, Routes, CONFIRMATION_THRESHOLD } from 'utils/const'
 import { backToTop } from 'utils/animations'
 
@@ -250,7 +251,7 @@ const Overview = ({
       },
       {
         label: t('overview.epoch'),
-        value: epoch,
+        value: epochParser(epoch).index,
       },
       {
         label: t('overview.difficulty'),

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

@@ -95,7 +95,7 @@ const Transaction = () => {
               return null
             }
             try {
-              const address = ckbCore.utils.bech32Address(output.lock.args[0], {
+              const address = ckbCore.utils.bech32Address(output.lock.args, {
                 prefix: addressPrefix,
                 type: ckbCore.utils.AddressType.HashIdx,
                 codeHashIndex: '0x00',

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

@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect, useMemo } from 'react'
+import React, { useState, useCallback, useEffect, useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
 import {
   Stack,
@@ -10,6 +10,7 @@ import {
   DefaultButton,
   TextField,
   FontSizes,
+  Spinner,
 } from 'office-ui-fabric-react'
 
 import withWizard, { WizardElementProps, WithWizardState } from 'components/withWizard'
@@ -224,9 +225,13 @@ const Submission = ({
 }: WizardElementProps<{ type: string }>) => {
   const { name, password, confirmPassword, imported } = state
   const [t] = useTranslation()
+  const [loading, setLoading] = useState(false)
   const message = 'wizard.set-wallet-name-and-password'
 
   useEffect(() => {
+    if (loading) {
+      return
+    }
     dispatch({
       type: 'name',
       payload: generateWalletName(wallets, wallets.length + 1, t),
@@ -239,7 +244,7 @@ const Submission = ({
       type: 'confirmPassword',
       payload: '',
     })
-  }, [dispatch, wallets, t])
+  }, [loading, dispatch, wallets, t])
 
   const onChange = useCallback(
     (e: any, value?: string) => {
@@ -258,17 +263,23 @@ const Submission = ({
   )
 
   const onNext = useCallback(() => {
+    if (loading) {
+      return
+    }
     const p = {
       name,
       password,
       mnemonic: imported,
     }
-    if (type === MnemonicAction.Create) {
-      createWalletWithMnemonic(p)(dispatch, history)
-    } else {
-      importWalletWithMnemonic(p)(dispatch, history)
-    }
-  }, [type, name, password, imported, history, dispatch])
+    setLoading(true)
+    setTimeout(() => {
+      if (type === MnemonicAction.Create) {
+        createWalletWithMnemonic(p)(dispatch, history).finally(() => setLoading(false))
+      } else {
+        importWalletWithMnemonic(p)(dispatch, history).finally(() => setLoading(false))
+      }
+    }, 0)
+  }, [type, name, password, imported, history, dispatch, loading])
 
   const isNameUnused = useMemo(() => name && !wallets.find(w => w.name === name), [name, wallets])
   const isPwdComplex = useMemo(() => verifyPasswordComplexity(password) === true, [password])
@@ -310,7 +321,13 @@ const Submission = ({
 
       <Stack horizontal horizontalAlign="end" tokens={{ childrenGap: 10 }}>
         <DefaultButton onClick={history.goBack} text={t('wizard.back')} />
-        <PrimaryButton type="submit" onClick={onNext} disabled={disableNext} text={t('wizard.next')} />
+        {loading ? (
+          <PrimaryButton disabled>
+            <Spinner />
+          </PrimaryButton>
+        ) : (
+          <PrimaryButton type="submit" onClick={onNext} disabled={disableNext} text={t('wizard.next')} />
+        )}
       </Stack>
     </Stack>
   )

packages/neuron-ui/src/locales/en.json

@@ -274,6 +274,8 @@
         "100": "Amount is not enough",
         "101": "The amount {{amount}} CKB is too small, please enter an amount no less than 61 CKB",
         "102": "$t(messages.fields.{{fieldName}}) is invalid",
+        "103": "$t(messages.fields.keystore-password) is incorrect",
+        "104": "Connection to the node is failed",
         "201": "$t(messages.fields.{{fieldName}}) is required",
         "202": "$t(messages.fields.{{fieldName}}) {{fieldValue}} is used",
         "203": "$t(messages.fields.{{fieldName}}) {{fieldValue}} is too long, it should be shorter than or equal to {{length}}",

packages/neuron-ui/src/locales/zh.json

@@ -274,6 +274,8 @@
         "100": "余额不足",
         "101": "金额 {{amount}} CKB 太小, 请输入一个不小于 61 CKB 的值",
         "102": "$t(messages.fields.{{fieldName}})无效",
+        "103": "$t(messages.fields.keystore-password) 不正确",
+        "104": "未连接到节点",
         "201": "缺少$t(messages.fields.{{fieldName}})",
         "202": "$t(messages.fields.{{fieldName}}) {{fieldValue}} 已被使用",
         "203": "$t(messages.fields.{{fieldName}}) {{fieldValue}} 太长, 其长度应不超过 {{length}}",

packages/neuron-ui/src/services/remote/controllerMethodWrapper.ts

@@ -17,7 +17,7 @@ export type ControllerResponse = SuccessFromController | FailureFromController
 export const RemoteNotLoadError = {
   status: 0 as 0,
   message: {
-    content: 'remote is not supported',
+    content: 'The remote module is not found, please make sure the UI is running inside the Electron App',
   },
 }
 
@@ -60,15 +60,15 @@ export const controllerMethodWrapper = (controllerName: string) => (
     }
   }
 
-  if (res.status) {
+  if (res.status === 1) {
     return {
       status: 1,
       result: res.result || null,
     }
   }
 
   return {
-    status: 0,
+    status: res.status || 0,
     message: typeof res.message === 'string' ? { content: res.message } : res.message || '',
   }
 }

packages/neuron-ui/src/services/remote/index.ts

@@ -4,25 +4,28 @@ export * from './networks'
 export * from './transactions'
 export * from './skipDataAndType'
 
+const REMOTE_MODULE_NOT_FOUND =
+  'The remote module is not found, please make sure the UI is running inside the Electron App'
+
 export const getLocale = () => {
   if (!window.remote) {
-    console.warn('remote is not supported')
+    console.warn(REMOTE_MODULE_NOT_FOUND)
     return window.navigator.language
   }
   return window.remote.require('electron').app.getLocale()
 }
 
 export const getWinID = () => {
   if (!window.remote) {
-    console.warn('remote is not supported')
+    console.warn(REMOTE_MODULE_NOT_FOUND)
     return -1
   }
   return window.remote.getCurrentWindow().id
 }
 
 export const validateMnemonic = (mnemonic: string): boolean => {
   if (!window.remote) {
-    console.warn('remote is not supported')
+    console.warn(REMOTE_MODULE_NOT_FOUND)
     return true
   }
   const { validateMnemonic: remoteValidateMnemonic } = window.remote.require('./models/keys/mnemonic')
@@ -31,7 +34,7 @@ export const validateMnemonic = (mnemonic: string): boolean => {
 
 export const generateMnemonic = (): string => {
   if (!window.remote) {
-    console.warn('remote is not supported')
+    console.warn(REMOTE_MODULE_NOT_FOUND)
     return ''
   }
   const { generateMnemonic: remoteGenerateMnemonic } = window.remote.require('./models/keys/key')
@@ -40,7 +43,7 @@ export const generateMnemonic = (): string => {
 
 export const showMessage = (options: any, callback: Function) => {
   if (!window.remote) {
-    console.warn('remote is not supported')
+    console.warn(REMOTE_MODULE_NOT_FOUND)
     window.alert(options.message)
   } else {
     window.remote.require('electron').dialog.showMessageBox(options, callback)
@@ -49,7 +52,7 @@ export const showMessage = (options: any, callback: Function) => {
 
 export const showErrorMessage = (title: string, content: string) => {
   if (!window.remote) {
-    console.warn('remote is not supported')
+    console.warn(REMOTE_MODULE_NOT_FOUND)
     window.alert(`${title}: ${content}`)
   } else {
     window.remote.require('electron').dialog.showErrorBox(title, content)
@@ -58,7 +61,7 @@ export const showErrorMessage = (title: string, content: string) => {
 
 export const showOpenDialog = (opt: { title: string; message?: string; onUpload: Function }) => {
   if (!window.remote) {
-    window.alert('remote is not supported')
+    window.alert(REMOTE_MODULE_NOT_FOUND)
   }
   const { onUpload, ...options } = opt
   return window.remote.require('electron').dialog.showOpenDialog(

packages/neuron-ui/src/services/subjects.ts

@@ -1,6 +1,6 @@
 const FallbackSubject = {
   subscribe: (args: any) => {
-    console.warn('remote is not supported')
+    console.warn('The remote module is not found, please make sure the UI is running inside the Electron App')
     console.info(JSON.stringify(args))
     return {
       unsubscribe: () => {

packages/neuron-ui/src/states/stateProvider/actionCreators/app.ts

@@ -15,7 +15,7 @@ import {
 export const initAppState = () => (dispatch: StateDispatch, history: any) => {
   getNeuronWalletState()
     .then(res => {
-      if (res.status) {
+      if (res.status === 1) {
         const {
           wallets = [],
           currentWallet: wallet = initStates.wallet,