Merge pull request #591 from nervosnetwork/rc/v0.1.0-alpha.1

[ᚬmaster] Rc/v0.1.0 alpha.1

Author: ashchan

.travis.yml

@@ -19,8 +19,8 @@ cache:
   - yarn
 
 before_install:
-  - curl -o- -L https://yarnpkg.com/install.sh | bash -s -- --version 1.13.0
-  - export PATH=$HOME/.yarn/bin:$PATH
+  # - curl -o- -L https://yarnpkg.com/install.sh | bash -s -- --version 1.13.0
+  # - export PATH=$HOME/.yarn/bin:$PATH
   - yarn global add lerna
 
 install:

azure-pipelines.yml

@@ -4,7 +4,11 @@ trigger:
     include:
       - master
       - develop
+      - e2e-tests
       - rc/*
+  tags:
+    include:
+      - '*'
 
 pr:
   autoCancel: true
@@ -87,3 +91,69 @@ jobs:
         set CI=true
         yarn test
       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:
+    - task: NodeTool@0
+      inputs:
+        versionSpec: 12.x
+      displayName: 'Install Node.js'
+    - script: yarn global add lerna
+      name: Install
+    - script: yarn bootstrap
+      name: Bootstrap
+    - script: yarn test:e2e
+      name: Test
+
+  - job: Package
+    condition: startsWith(variables['Build.SourceBranch'], 'refs/tags/')
+    pool:
+      vmImage: 'macos-10.14'
+    steps:
+    - task: NodeTool@0
+      inputs:
+        versionSpec: 12.x
+      displayName: 'Install Node.js'
+    - script: |
+        yarn global add lerna
+        yarn bootstrap
+    - task: DownloadSecureFile@1
+      name: macSiginingCertificate
+      displayName: 'Download macOS Signing Certificate'
+      inputs:
+        secureFile: Neuron_mac.p12
+    - task: DownloadSecureFile@1
+      name: winSiginingCertificate
+      displayName: 'Download Windows Signing Certificate'
+      inputs:
+        secureFile: Neuron_win.p12
+    - script: yarn package
+      name: Build
+      env:
+        CSC_LINK: $(macSiginingCertificate.secureFilePath)
+        CSC_KEY_PASSWORD: $(macSiginingCertificatePassword)
+        CSC_IDENTITY_AUTO_DISCOVERY: false
+        WIN_CSC_LINK: $(winSiginingCertificate.secureFilePath)
+        WIN_CSC_KEY_PASSWORD: $(winSiginingCertificatePassword)
+        WIN_CSC_IDENTITY_AUTO_DISCOVERY: false
+    - task: GitHubRelease@0
+      inputs:
+        gitHubConnection: nervos-bot
+        repositoryName: nervosnetwork/neuron
+        action: edit
+        tag: $(Build.SourceBranchName)
+        assets: |
+          $(Build.ArtifactStagingDirectory)/release/*.zip
+          $(Build.ArtifactStagingDirectory)/release/*.exe
+          $(Build.ArtifactStagingDirectory)/release/*.deb
+          $(Build.ArtifactStagingDirectory)/release/*.AppImage
+        assetUploadMode: replace
+        isPreRelease: true
+        addChangeLog: false

lerna.json

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

package.json

@@ -2,7 +2,7 @@
   "name": "@nervosnetwork/neuron",
   "productName": "Neuron",
   "description": "CKB Neuron Wallet",
-  "version": "0.1.0-alpha.0",
+  "version": "0.1.0-alpha.1",
   "private": true,
   "author": {
     "name": "Nervos Core Dev",
@@ -20,12 +20,14 @@
   "scripts": {
     "bootstrap": "lerna bootstrap && lerna link",
     "start:ui": "lerna run --scope=@nervosnetwork/neuron-ui start",
-    "start": "concurrently \"cross-env BROWSER=none yarn run start:ui\" \"wait-on http://localhost:3000 && cd packages/neuron-wallet && yarn run start:dev\"",
+    "start:wallet": "lerna run --scope=@nervosnetwork/neuron-wallet start:dev",
+    "start": "concurrently \"cross-env BROWSER=none yarn run start:ui\" \"wait-on http://localhost:3000 && yarn run start:wallet\"",
     "clean": "lerna run --stream clean",
     "prebuild": "yarn clean",
     "build": "lerna run --stream build",
-    "package": "yarn build && ./packages/neuron-wallet/script/package.sh",
+    "package": "yarn build && ./scripts/copy-ui-files.sh && ./scripts/package.sh",
     "test": "lerna run --parallel test",
+    "test:e2e": "yarn build && ./scripts/copy-ui-files.sh && lerna run --parallel test:e2e",
     "lint": "lerna run --stream lint",
     "postinstall": "lerna run rebuild:nativemodules",
     "db:migrate": "ts-node ./node_modules/.bin/typeorm migration:generate",
@@ -53,10 +55,11 @@
     "eslint-plugin-react": "7.13.0",
     "husky": "2.3.0",
     "lerna": "3.15.0",
+    "ncp": "2.0.0",
     "nodemon": "1.19.1",
     "prettier": "1.17.1",
     "ts-jest": "24.0.2",
-    "typescript": "3.5.1",
+    "typescript": "3.5.2",
     "wait-on": "3.2.0"
   },
   "dependencies": {},

packages/neuron-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nervosnetwork/neuron-ui",
-  "version": "0.1.0-alpha.0",
+  "version": "0.1.0-alpha.1",
   "private": true,
   "author": {
     "name": "Nervos Core Dev",
@@ -31,15 +31,14 @@
     ]
   },
   "jest": {
-    "displayName": "Neuron UI"
+    "displayName": "UI Tests"
   },
   "browserslist": [
     "last 2 chrome versions"
   ],
   "dependencies": {
     "bootstrap": "4.3.1",
     "grommet-icons": "4.2.0",
-    "history": "4.9.0",
     "i18next": "15.1.3",
     "office-ui-fabric-react": "7.6.1",
     "qr.js": "0.0.0",

packages/neuron-ui/public/index.html

@@ -11,7 +11,6 @@
       homescreen on Android. See https://developers.google.com/web/fundamentals/web-app-manifest/
     -->
   <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-  <link rel="stylesheet" href="%PUBLIC_URL%/styles/bootstrap.min.css" />
   <!--
       Notice the use of %PUBLIC_URL% in the tags above.
       It will be replaced with the URL of the `public` folder during the build.
@@ -28,7 +27,7 @@
   <header class="header"></header>
   <navbar class="navbar"></navbar>
   <div id="notification" class="notification"></div>
-  <div id="root" class="main-content"></div>
+  <main id="root" class="main-content"></main>
   <footer class="footer"></footer>
   <div id="dialog" class="dialog"></div>
 </body>

packages/neuron-ui/public/styles/bootstrap.min.css

@@ -1,60 +1,84 @@
 import React, { useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
+import { DetailsList, IColumn, DetailsListLayoutMode, CheckboxVisibility } from 'office-ui-fabric-react'
+
+import { StateWithDispatch } from 'states/stateProvider/reducer'
 
-import Table from 'widgets/Table'
 import { appCalls } from 'services/UILayer'
-import { useNeuronWallet, useLocalDescription } from 'utils/hooks'
-import { ContentProps } from 'containers/MainContent'
 
+import { useLocalDescription } from 'utils/hooks'
 import DescriptionField from 'widgets/InlineInput/DescriptionField'
+import { MIN_CELL_WIDTH } from 'utils/const'
 
-const headers = [
+const addressColumns: IColumn[] = [
   {
-    label: 'addresses.type',
+    name: 'addresses.type',
     key: 'type',
+    fieldName: 'type',
+    minWidth: MIN_CELL_WIDTH,
+    maxWidth: 120,
+    isResizable: true,
+    isCollapsible: false,
   },
   {
-    label: 'addresses.address',
+    name: 'addresses.address',
     key: 'address',
+    fieldName: 'address',
+    className: 'fixedWidth',
+    minWidth: MIN_CELL_WIDTH,
+    maxWidth: 450,
+    isResizable: true,
+    isCollapsible: false,
   },
   {
-    label: 'addresses.identifier',
-    key: 'identifier',
-  },
-  {
-    label: 'addresses.description',
+    name: 'addresses.description',
     key: 'description',
+    fieldName: 'description',
+    minWidth: MIN_CELL_WIDTH,
+    maxWidth: 350,
+    isResizable: true,
+    isCollapsible: false,
   },
   {
-    label: 'addresses.balance',
+    name: 'addresses.balance',
     key: 'balance',
+    fieldName: 'balance',
+    minWidth: MIN_CELL_WIDTH,
+    maxWidth: 250,
+    isResizable: true,
+    isCollapsible: false,
   },
   {
-    label: 'addresses.transactions',
+    name: 'addresses.transactions',
     key: 'transactions',
+    fieldName: 'transactions',
+    minWidth: MIN_CELL_WIDTH,
+    maxWidth: 150,
+    isResizable: true,
+    isCollapsible: false,
   },
 ]
 
-const onPageChange = () => {}
-
-const Addresses = ({ dispatch }: React.PropsWithoutRef<ContentProps>) => {
-  const {
-    wallet: { addresses },
-  } = useNeuronWallet()
+const Addresses = ({ dispatch, wallet: { addresses = [] } }: React.PropsWithoutRef<StateWithDispatch>) => {
   const [t] = useTranslation()
 
   const { localDescription, onDescriptionPress, onDescriptionFieldBlur, onDescriptionChange } = useLocalDescription(
     'address',
-    addresses.map(({ address: key, description }) => ({
-      key,
-      description,
-    })),
+    useMemo(
+      () =>
+        addresses.map(({ address: key, description }) => ({
+          key,
+          description,
+        })),
+      [addresses]
+    ),
     dispatch
   )
 
   const addressesItems = useMemo(
     () =>
       addresses.map(({ type, identifier, address, txCount, balance, description }, idx) => ({
+        key: identifier,
         type: type === 0 ? t('addresses.receiving-address') : t('addresses.change-address'),
         address,
         identifier,
@@ -66,37 +90,28 @@ const Addresses = ({ dispatch }: React.PropsWithoutRef<ContentProps>) => {
             onKeyPress={onDescriptionPress(idx)}
             onBlur={onDescriptionFieldBlur(idx)}
             onChange={onDescriptionChange(idx)}
-            maxLength={100}
+            maxLength={300}
           />
         ),
         balance,
         transactions: txCount,
-        key: identifier,
       })),
     [addresses, onDescriptionChange, localDescription, onDescriptionFieldBlur, onDescriptionPress, t]
   )
 
   return (
-    <>
-      <h2>{t('addresses.addresses')}</h2>
-      <Table
-        headers={headers.map(header => ({
-          ...header,
-          label: t(header.label),
-        }))}
-        items={addressesItems}
-        pageNo={0}
-        pageSize={addressesItems.length}
-        totalCount={addressesItems.length}
-        onPageChange={onPageChange}
-        tableAttrs={{
-          bordered: false,
-          striped: true,
-        }}
-        onContextMenu={(key: string) => () => appCalls.contextMenu({ type: 'addressList', id: key })}
-      />
-    </>
+    <DetailsList
+      checkboxVisibility={CheckboxVisibility.hidden}
+      layoutMode={DetailsListLayoutMode.justified}
+      columns={addressColumns.map(col => ({ ...col, name: t(col.name) }))}
+      items={addressesItems}
+      onItemContextMenu={item => {
+        appCalls.contextMenu({ type: 'addressList', id: item.key })
+      }}
+    />
   )
 }
 
+Addresses.displayName = 'Addresses'
+
 export default Addresses