[ᚬmaster] Rc/v0.18.0 beta.0

CHANGELOG.md

@@ -1,3 +1,22 @@
+# [0.18.0-beta.0](https://github.com/nervosnetwork/neuron/compare/v0.18.0-alpha.1...v0.18.0-beta.0) (2019-08-16)
+
+
+### Bug Fixes
+
+* generate address and notify wallet created when import keystore ([9eaf2f3](https://github.com/nervosnetwork/neuron/commit/9eaf2f3))
+
+
+### Features
+
+* **neuron-ui:** update display of recent activities ([57c13c9](https://github.com/nervosnetwork/neuron/commit/57c13c9))
+* Add report issue menu item ([a3e49ff](https://github.com/nervosnetwork/neuron/commit/a3e49ff))
+* **neuron-ui:** add import keystore ([d3a917c](https://github.com/nervosnetwork/neuron/commit/d3a917c))
+* **neuron-ui:** check the JSON format before keystore validation ([d5621e5](https://github.com/nervosnetwork/neuron/commit/d5621e5))
+* **neuron-ui:** memorize lists for performance ([07c8667](https://github.com/nervosnetwork/neuron/commit/07c8667))
+* Show available update's version ([37c8639](https://github.com/nervosnetwork/neuron/commit/37c8639))
+
+
+
 # [0.18.0-alpha.1](https://github.com/nervosnetwork/neuron/compare/v0.18.0-alpha.0...v0.18.0-alpha.1) (2019-08-12)
 
 

azure-pipelines.yml

@@ -85,11 +85,6 @@ jobs:
       name: Test
 
   - job: Integration
-    condition: |
-      or(
-        eq(variables['build.sourceBranch'], 'refs/heads/e2e-tests'),
-        startsWith(variables['Build.SourceBranch'], 'refs/heads/rc/')
-      )
     pool:
       vmImage: 'macos-10.14'
     steps:

lerna.json

@@ -2,7 +2,7 @@
   "packages": [
     "packages/*"
   ],
-  "version": "0.18.0-alpha.1",
+  "version": "0.18.0-beta.0",
   "npmClient": "yarn",
   "useWorkspaces": true
 }

package.json

@@ -2,7 +2,7 @@
   "name": "neuron",
   "productName": "Neuron",
   "description": "CKB Neuron Wallet",
-  "version": "0.18.0-alpha.1",
+  "version": "0.18.0-beta.0",
   "private": true,
   "author": {
     "name": "Nervos Core Dev",

packages/neuron-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "neuron-ui",
-  "version": "0.18.0-alpha.1",
+  "version": "0.18.0-beta.0",
   "private": true,
   "author": {
     "name": "Nervos Core Dev",

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

@@ -158,20 +158,24 @@ const Addresses = ({
       semanticColors,
     ]
   )
-
-  return (
-    <ShimmeredDetailsList
-      enableShimmer={isLoading}
-      checkboxVisibility={CheckboxVisibility.hidden}
-      columns={addressColumns.map(col => ({ ...col, name: t(col.name) }))}
-      items={addresses}
-      onItemContextMenu={item => {
-        contextMenu({ type: 'addressList', id: item.identifier })
-      }}
-      className="listWithDesc"
-      onRenderRow={onRenderRow}
-    />
+  const List = useMemo(
+    () => (
+      <ShimmeredDetailsList
+        enableShimmer={isLoading}
+        checkboxVisibility={CheckboxVisibility.hidden}
+        columns={addressColumns.map(col => ({ ...col, name: t(col.name) }))}
+        items={addresses}
+        onItemContextMenu={item => {
+          contextMenu({ type: 'addressList', id: item.identifier })
+        }}
+        className="listWithDesc"
+        onRenderRow={onRenderRow}
+      />
+    ),
+    [isLoading, addressColumns, addresses, t]
   )
+
+  return List
 }
 
 Addresses.displayName = 'Addresses'

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

@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect } from 'react'
+import React, { useCallback, useEffect, useMemo } from 'react'
 import { RouteComponentProps } from 'react-router-dom'
 import { useTranslation } from 'react-i18next'
 import { Stack, SearchBox } from 'office-ui-fabric-react'
@@ -33,47 +33,65 @@ const History = ({
   }, [id, history])
   const onSearch = useCallback(() => history.push(`${Routes.History}?keywords=${keywords}`), [history, keywords])
 
-  return (
-    <Stack>
-      <Stack horizontal horizontalAlign="end" tokens={{ childrenGap: 15 }}>
-        <SearchBox
-          value={keywords}
-          styles={{ root: { width: 500 } }}
-          placeholder={t('history.search.placeholder')}
-          onChange={onKeywordsChange}
-          onSearch={onSearch}
-          iconProps={{ iconName: 'Search', styles: { root: { height: '18px' } } }}
+  const List = useMemo(() => {
+    return (
+      <Stack>
+        <Stack horizontal horizontalAlign="end" tokens={{ childrenGap: 15 }}>
+          <SearchBox
+            value={keywords}
+            styles={{ root: { width: 500 } }}
+            placeholder={t('history.search.placeholder')}
+            onChange={onKeywordsChange}
+            onSearch={onSearch}
+            iconProps={{ iconName: 'Search', styles: { root: { height: '18px' } } }}
+          />
+        </Stack>
+        <TransactionList
+          isLoading={isLoading}
+          isUpdatingDescription={isUpdatingDescription}
+          walletID={id}
+          items={items}
+          dispatch={dispatch}
+        />
+        <Pagination
+          selectedPageIndex={pageNo - 1}
+          pageCount={Math.ceil(totalCount / pageSize)}
+          itemsPerPage={pageSize}
+          totalItemCount={totalCount}
+          previousPageAriaLabel={t('pagination.previous-page')}
+          nextPageAriaLabel={t('pagination.next-page')}
+          firstPageAriaLabel={t('pagination.first-page')}
+          lastPageAriaLabel={t('pagination.last-page')}
+          pageAriaLabel={t('pagination-page')}
+          selectedAriaLabel={t('pagination-selected')}
+          firstPageIconProps={{ iconName: 'FirstPage' }}
+          previousPageIconProps={{ iconName: 'PrevPage' }}
+          nextPageIconProps={{ iconName: 'NextPage' }}
+          lastPageIconProps={{ iconName: 'LastPage' }}
+          format="buttons"
+          onPageChange={(idx: number) => {
+            history.push(`${Routes.History}?pageNo=${idx + 1}`)
+          }}
         />
       </Stack>
-      <TransactionList
-        isLoading={isLoading}
-        isUpdatingDescription={isUpdatingDescription}
-        walletID={id}
-        items={items}
-        dispatch={dispatch}
-      />
-      <Pagination
-        selectedPageIndex={pageNo - 1}
-        pageCount={Math.ceil(totalCount / pageSize)}
-        itemsPerPage={pageSize}
-        totalItemCount={totalCount}
-        previousPageAriaLabel={t('pagination.previous-page')}
-        nextPageAriaLabel={t('pagination.next-page')}
-        firstPageAriaLabel={t('pagination.first-page')}
-        lastPageAriaLabel={t('pagination.last-page')}
-        pageAriaLabel={t('pagination-page')}
-        selectedAriaLabel={t('pagination-selected')}
-        firstPageIconProps={{ iconName: 'FirstPage' }}
-        previousPageIconProps={{ iconName: 'PrevPage' }}
-        nextPageIconProps={{ iconName: 'NextPage' }}
-        lastPageIconProps={{ iconName: 'LastPage' }}
-        format="buttons"
-        onPageChange={(idx: number) => {
-          history.push(`${Routes.History}?pageNo=${idx + 1}`)
-        }}
-      />
-    </Stack>
-  )
+    )
+  }, [
+    keywords,
+    onKeywordsChange,
+    onSearch,
+    isLoading,
+    isUpdatingDescription,
+    id,
+    items,
+    dispatch,
+    pageNo,
+    totalCount,
+    pageSize,
+    history,
+    t,
+  ])
+
+  return List
 }
 
 History.displayName = 'History'

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

@@ -0,0 +1,106 @@
+import React, { useState, useCallback, useMemo } from 'react'
+import { RouteComponentProps } from 'react-router-dom'
+import { Stack, DefaultButton, PrimaryButton, TextField } from 'office-ui-fabric-react'
+import { useTranslation } from 'react-i18next'
+import { showOpenDialog } from 'services/remote'
+import { importWalletWithKeystore } from 'states/stateProvider/actionCreators'
+import { StateWithDispatch } from 'states/stateProvider/reducer'
+import { useGoBack } from 'utils/hooks'
+
+const defaultFields = {
+  path: '',
+  name: '',
+  password: '',
+}
+
+const ImportKeystore = (props: React.PropsWithoutRef<StateWithDispatch & RouteComponentProps>) => {
+  const [t] = useTranslation()
+  const {
+    history,
+    dispatch,
+    settings: { wallets },
+  } = props
+  const [fields, setFields] = useState(defaultFields)
+  const goBack = useGoBack(history)
+
+  const exsitingNames = useMemo(() => {
+    return wallets.map(w => w.name)
+  }, [wallets])
+
+  const isNameUsed = useMemo(() => {
+    return exsitingNames.includes(fields.name || '')
+  }, [exsitingNames, fields.name])
+
+  const onFileClick = useCallback(() => {
+    showOpenDialog({
+      title: 'import keystore',
+      onUpload: (filePaths: string[]) => {
+        if (!filePaths || filePaths.length === 0) {
+          return
+        }
+        const filePath = filePaths[0]
+        const filename = filePath.split('/').pop() || 'Imported wallet'
+        setFields({
+          ...fields,
+          path: filePath,
+          name: filename,
+        })
+      },
+    })
+  }, [fields])
+
+  const onSubmit = useCallback(() => {
+    importWalletWithKeystore({
+      name: fields.name,
+      keystorePath: fields.path,
+      password: fields.password,
+    })(dispatch, history)
+  }, [fields.name, fields.password, fields.path, history, dispatch])
+
+  return (
+    <Stack verticalFill verticalAlign="center" tokens={{ childrenGap: 15 }}>
+      <Stack tokens={{ childrenGap: 15 }}>
+        {Object.entries(fields).map(([key, value]) => {
+          return (
+            <TextField
+              key={key}
+              onClick={key === 'path' ? onFileClick : undefined}
+              label={t(`import-keystore.label.${key}`)}
+              placeholder={t(`import-keystore.placeholder.${key}`)}
+              type={key === 'password' ? 'password' : 'text'}
+              readOnly={key === 'path'}
+              value={value}
+              validateOnLoad={false}
+              onGetErrorMessage={(text?: string) => {
+                if (text === '') {
+                  return t('messages.is-required', { field: t(`import-keystore.label.${key}`) })
+                }
+                if (key === 'name' && isNameUsed) {
+                  return t('messages.is-used', { field: t(`import-keystore.label.${key}`) })
+                }
+                return ''
+              }}
+              onChange={(_e: React.FormEvent<HTMLInputElement | HTMLTextAreaElement>, newValue?: string) => {
+                if (newValue !== undefined) {
+                  setFields({
+                    ...fields,
+                    [key]: newValue,
+                  })
+                }
+              }}
+            />
+          )
+        })}
+      </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>
+      </Stack>
+    </Stack>
+  )
+}
+
+ImportKeystore.displayName = 'ImportKeystore'
+export default ImportKeystore

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

@@ -34,16 +34,26 @@ import { backToTop } from 'utils/animations'
 const TITLE_FONT_SIZE = 'xxLarge'
 export type ActivityItem = State.Transaction & { confirmations: string; typeLabel: string }
 
-const genTypeLabel = (type: 'send' | 'receive', confirmationCount: number) => {
+const genTypeLabel = (
+  type: 'send' | 'receive',
+  confirmationCount: number,
+  status: 'pending' | 'success' | 'failed'
+) => {
   switch (type) {
     case 'send': {
-      if (confirmationCount < CONFIRMATION_THRESHOLD) {
+      if (status === 'failed') {
+        return 'sent'
+      }
+      if (status === 'pending' || confirmationCount < CONFIRMATION_THRESHOLD) {
         return 'sending'
       }
       return 'sent'
     }
     case 'receive': {
-      if (confirmationCount < CONFIRMATION_THRESHOLD) {
+      if (status === 'failed') {
+        return 'received'
+      }
+      if (status === 'pending' || confirmationCount < CONFIRMATION_THRESHOLD) {
         return 'receiving'
       }
       return 'received'
@@ -287,13 +297,14 @@ const Overview = ({
         let typeLabel: string = item.type
         let { status } = item
         if (item.blockNumber !== undefined) {
-          const confirmationCount = 1 + Math.max(+syncedBlockNumber, +tipBlockNumber) - +item.blockNumber
+          const confirmationCount =
+            item.blockNumber === undefined ? 0 : 1 + Math.max(+syncedBlockNumber, +tipBlockNumber) - +item.blockNumber
 
           if (status === 'success' && confirmationCount < CONFIRMATION_THRESHOLD) {
             status = 'pending'
           }
 
-          typeLabel = genTypeLabel(item.type, confirmationCount)
+          typeLabel = genTypeLabel(item.type, confirmationCount, status)
 
           if (confirmationCount === 1) {
             confirmations = `(${t('overview.confirmation', {
@@ -309,6 +320,7 @@ const Overview = ({
         return {
           ...item,
           status,
+          value: item.value.replace(/^-/, ''),
           confirmations: item.status === 'success' ? confirmations : '',
           typeLabel: t(`overview.${typeLabel}`),
         }

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

@@ -17,9 +17,13 @@ const buttons = [
     url: `${Routes.WalletWizard}${WalletWizardPath.Mnemonic}/${MnemonicAction.Create}`,
   },
   {
-    label: 'wizard.import-wallet',
+    label: 'wizard.import-mnemonic',
     url: `${Routes.WalletWizard}${WalletWizardPath.Mnemonic}/${MnemonicAction.Import}`,
   },
+  {
+    label: 'wizard.import-keystore',
+    url: Routes.ImportKeystore,
+  },
 ]
 
 const WalletSetting = ({