From fbb03b19d3a90e6598f4cc06842e9485608615d1 Mon Sep 17 00:00:00 2001 From: "Valentin D. Pinkman" Date: Mon, 14 May 2018 16:44:13 +0200 Subject: [PATCH 1/9] refactor icons to move react element into constants --- .gitignore | 3 +- src/icons/Activity.js | 12 +++-- src/icons/AngleDown.js | 12 +++-- src/icons/AngleLeft.js | 12 +++-- src/icons/ArrowDown.js | 14 +++-- src/icons/ArrowUp.js | 12 +++-- src/icons/Bottom.js | 12 +++-- src/icons/Check.js | 12 +++-- src/icons/CheckCircle.js | 11 ++-- src/icons/ChevronRight.js | 12 +++-- src/icons/Clock.js | 12 +++-- src/icons/Controls.js | 12 +++-- src/icons/Copy.js | 12 +++-- src/icons/Cross.js | 12 +++-- src/icons/Currencies.js | 12 +++-- src/icons/Devices.js | 12 +++-- src/icons/Display.js | 12 +++-- src/icons/Edit.js | 12 +++-- src/icons/ExclamationCircle.js | 12 +++-- src/icons/ExclamationCircleThin.js | 12 +++-- src/icons/ExternalLink.js | 12 +++-- src/icons/Eye.js | 12 +++-- src/icons/Help.js | 12 +++-- src/icons/InfoCircle.js | 12 +++-- src/icons/Loader.js | 6 ++- src/icons/Lock.js | 12 +++-- src/icons/LockScreen.js | 72 ++++++++++++++----------- src/icons/Manager.js | 12 +++-- src/icons/PieChart.js | 12 +++-- src/icons/Plus.js | 12 +++-- src/icons/Print.js | 12 +++-- src/icons/QrCode.js | 12 +++-- src/icons/Receive.js | 12 +++-- src/icons/Search.js | 12 +++-- src/icons/Send.js | 12 +++-- src/icons/Settings.js | 12 +++-- src/icons/Share.js | 12 +++-- src/icons/Shield.js | 86 ++++++++++++++++-------------- src/icons/Top.js | 12 +++-- src/icons/Usb.js | 16 +++--- src/icons/User.js | 12 +++-- src/icons/device/Blue.js | 12 +++-- src/icons/device/NanoS.js | 12 +++-- 43 files changed, 408 insertions(+), 232 deletions(-) diff --git a/.gitignore b/.gitignore index b4bb8107..649b19be 100644 --- a/.gitignore +++ b/.gitignore @@ -7,4 +7,5 @@ /static/fonts/museosans/ /storybook-static/ thumbs.db -.vscode \ No newline at end of file +.vscode +jsconfig.json \ No newline at end of file diff --git a/src/icons/Activity.js b/src/icons/Activity.js index 44761b3a..8eb643e8 100644 --- a/src/icons/Activity.js +++ b/src/icons/Activity.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/AngleDown.js b/src/icons/AngleDown.js index 5ee5f712..dc5928dd 100644 --- a/src/icons/AngleDown.js +++ b/src/icons/AngleDown.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/AngleLeft.js b/src/icons/AngleLeft.js index f973c06f..9bc3d76a 100644 --- a/src/icons/AngleLeft.js +++ b/src/icons/AngleLeft.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/ArrowDown.js b/src/icons/ArrowDown.js index 197bc15f..bf471aba 100644 --- a/src/icons/ArrowDown.js +++ b/src/icons/ArrowDown.js @@ -2,12 +2,16 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/ArrowUp.js b/src/icons/ArrowUp.js index c44bb480..2699f48d 100644 --- a/src/icons/ArrowUp.js +++ b/src/icons/ArrowUp.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Bottom.js b/src/icons/Bottom.js index cc14334a..e693b4e6 100644 --- a/src/icons/Bottom.js +++ b/src/icons/Bottom.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Check.js b/src/icons/Check.js index 3469002b..2225a5ff 100644 --- a/src/icons/Check.js +++ b/src/icons/Check.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/CheckCircle.js b/src/icons/CheckCircle.js index 429f39f3..16035966 100644 --- a/src/icons/CheckCircle.js +++ b/src/icons/CheckCircle.js @@ -2,11 +2,14 @@ import React from 'react' +const path = ( + +) export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/ChevronRight.js b/src/icons/ChevronRight.js index dfbeb5b6..67ea387e 100644 --- a/src/icons/ChevronRight.js +++ b/src/icons/ChevronRight.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Clock.js b/src/icons/Clock.js index c3a4a508..2d90d56a 100644 --- a/src/icons/Clock.js +++ b/src/icons/Clock.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Controls.js b/src/icons/Controls.js index 911ed92c..d4230ee5 100644 --- a/src/icons/Controls.js +++ b/src/icons/Controls.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Copy.js b/src/icons/Copy.js index 61777f5a..5f48150a 100644 --- a/src/icons/Copy.js +++ b/src/icons/Copy.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Cross.js b/src/icons/Cross.js index 98840d0b..587d06be 100644 --- a/src/icons/Cross.js +++ b/src/icons/Cross.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Currencies.js b/src/icons/Currencies.js index 6447551e..58f168b7 100644 --- a/src/icons/Currencies.js +++ b/src/icons/Currencies.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Devices.js b/src/icons/Devices.js index eaa93e4b..5c42a7f8 100644 --- a/src/icons/Devices.js +++ b/src/icons/Devices.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Display.js b/src/icons/Display.js index 0251d1e4..c0dd7402 100644 --- a/src/icons/Display.js +++ b/src/icons/Display.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Edit.js b/src/icons/Edit.js index 4d558d3f..f9660886 100644 --- a/src/icons/Edit.js +++ b/src/icons/Edit.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/ExclamationCircle.js b/src/icons/ExclamationCircle.js index 09ccc5b6..eb348cd0 100644 --- a/src/icons/ExclamationCircle.js +++ b/src/icons/ExclamationCircle.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/ExclamationCircleThin.js b/src/icons/ExclamationCircleThin.js index bcf42b38..57593b3e 100644 --- a/src/icons/ExclamationCircleThin.js +++ b/src/icons/ExclamationCircleThin.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/ExternalLink.js b/src/icons/ExternalLink.js index fb368eaf..f82c70a1 100644 --- a/src/icons/ExternalLink.js +++ b/src/icons/ExternalLink.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Eye.js b/src/icons/Eye.js index be34ea19..4f73e26c 100644 --- a/src/icons/Eye.js +++ b/src/icons/Eye.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Help.js b/src/icons/Help.js index ca30247f..e3f2251d 100644 --- a/src/icons/Help.js +++ b/src/icons/Help.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/InfoCircle.js b/src/icons/InfoCircle.js index d845a5a6..851171d4 100644 --- a/src/icons/InfoCircle.js +++ b/src/icons/InfoCircle.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Loader.js b/src/icons/Loader.js index 71e1f341..eb63088e 100644 --- a/src/icons/Loader.js +++ b/src/icons/Loader.js @@ -2,8 +2,12 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Lock.js b/src/icons/Lock.js index f8633faf..95a38881 100644 --- a/src/icons/Lock.js +++ b/src/icons/Lock.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/LockScreen.js b/src/icons/LockScreen.js index 3d3d3ebb..6c6fa0f4 100644 --- a/src/icons/LockScreen.js +++ b/src/icons/LockScreen.js @@ -4,39 +4,47 @@ import React from 'react' +const defs = ( + + + + + + + + + + + +) + +const group = ( + + + + + + +) + export default ({ size, ...p }: { size: number }) => ( - - - - - - - - - - - - - - - - - + {defs} + {group} ) diff --git a/src/icons/Manager.js b/src/icons/Manager.js index 08792a60..b814f70d 100644 --- a/src/icons/Manager.js +++ b/src/icons/Manager.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/PieChart.js b/src/icons/PieChart.js index 14405c66..9cfa1729 100644 --- a/src/icons/PieChart.js +++ b/src/icons/PieChart.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Plus.js b/src/icons/Plus.js index b0fb2b2f..79cf3919 100644 --- a/src/icons/Plus.js +++ b/src/icons/Plus.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Print.js b/src/icons/Print.js index 551b969e..78720126 100644 --- a/src/icons/Print.js +++ b/src/icons/Print.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/QrCode.js b/src/icons/QrCode.js index 91a4ffdb..10e9d53f 100644 --- a/src/icons/QrCode.js +++ b/src/icons/QrCode.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Receive.js b/src/icons/Receive.js index dc96dbbc..34563197 100644 --- a/src/icons/Receive.js +++ b/src/icons/Receive.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Search.js b/src/icons/Search.js index 19ddc9e6..bd7e970c 100644 --- a/src/icons/Search.js +++ b/src/icons/Search.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Send.js b/src/icons/Send.js index 10670e5d..b96d21ed 100644 --- a/src/icons/Send.js +++ b/src/icons/Send.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Settings.js b/src/icons/Settings.js index dd2be066..52bc4a83 100644 --- a/src/icons/Settings.js +++ b/src/icons/Settings.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Share.js b/src/icons/Share.js index a25e1ee1..dbc34c2b 100644 --- a/src/icons/Share.js +++ b/src/icons/Share.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Shield.js b/src/icons/Shield.js index 8ce93f98..bdb7207f 100644 --- a/src/icons/Shield.js +++ b/src/icons/Shield.js @@ -2,48 +2,56 @@ import React from 'react' -export default (p: Object) => ( - - - - - - - - - - - - + + + + - - - - - - + + + + + + + +) + +const group = ( + + + + + +) + +export default (p: Object) => ( + + {defs} + {group} ) diff --git a/src/icons/Top.js b/src/icons/Top.js index 68c48884..764958d3 100644 --- a/src/icons/Top.js +++ b/src/icons/Top.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/Usb.js b/src/icons/Usb.js index 993fed96..728431ad 100644 --- a/src/icons/Usb.js +++ b/src/icons/Usb.js @@ -2,13 +2,17 @@ import React from 'react' +const group = ( + + + + + + +) + export default ({ size, ...p }: { size: number }) => ( - - - - - - + {group} ) diff --git a/src/icons/User.js b/src/icons/User.js index f628f52b..bda4e989 100644 --- a/src/icons/User.js +++ b/src/icons/User.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/device/Blue.js b/src/icons/device/Blue.js index 117f77fe..725f0f58 100644 --- a/src/icons/device/Blue.js +++ b/src/icons/device/Blue.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) diff --git a/src/icons/device/NanoS.js b/src/icons/device/NanoS.js index f0b642e0..3b2f6a19 100644 --- a/src/icons/device/NanoS.js +++ b/src/icons/device/NanoS.js @@ -2,11 +2,15 @@ import React from 'react' +const path = ( + +) + export default ({ size, ...p }: { size: number }) => ( - + {path} ) From 65eebacdb9e1f85f9977105ee65e975c6562f5ed Mon Sep 17 00:00:00 2001 From: Thibaut Boustany Date: Mon, 14 May 2018 18:42:05 +0200 Subject: [PATCH 2/9] Fix mac release signing through yarn dist --- package.json | 4 +- yarn.lock | 205 ++++++++++++++++++++++++++++++++++++--------------- 2 files changed, 147 insertions(+), 62 deletions(-) diff --git a/package.json b/package.json index 2b7643af..469c390f 100644 --- a/package.json +++ b/package.json @@ -57,7 +57,7 @@ "i18next": "^11.2.2", "i18next-node-fs-backend": "^1.0.0", "invariant": "^2.2.4", - "ledger-test-library": "KhalilBellakrid/ledger-test-library-nodejs#7d37482", + "ledger-test-library": "MortalKastor/ledger-test-library-nodejs#d782241", "lodash": "^4.17.5", "moment": "^2.22.1", "object-path": "^0.11.4", @@ -117,7 +117,7 @@ "electron-builder": "^20.9.0", "electron-devtools-installer": "^2.2.3", "electron-rebuild": "^1.7.3", - "electron-webpack": "^2.0.1", + "electron-webpack": "^2.1.0", "eslint": "^4.19.1", "eslint-config-airbnb": "^16.1.0", "eslint-config-prettier": "^2.9.0", diff --git a/yarn.lock b/yarn.lock index 4204232d..e56a91d0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1712,7 +1712,7 @@ version "8.10.10" resolved "https://registry.yarnpkg.com/@types/node/-/node-8.10.10.tgz#fec07bc2ad549d9e6d2f7aa0fb0be3491b83163a" -"@types/webpack-env@^1.13.5": +"@types/webpack-env@^1.13.6": version "1.13.6" resolved "https://registry.yarnpkg.com/@types/webpack-env/-/webpack-env-1.13.6.tgz#128d1685a7c34d31ed17010fc87d6a12c1de6976" @@ -1792,7 +1792,7 @@ ajv-keywords@^2.1.0: version "2.1.1" resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-2.1.1.tgz#617997fc5f60576894c435f940d819e135b80762" -ajv-keywords@^3.0.0, ajv-keywords@^3.1.0: +ajv-keywords@^3.0.0, ajv-keywords@^3.1.0, ajv-keywords@^3.2.0: version "3.2.0" resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.2.0.tgz#e86b819c602cf8821ad637413698f1dec021847a" @@ -1814,6 +1814,15 @@ ajv@^6.0.1, ajv@^6.1.0, ajv@^6.1.1: json-schema-traverse "^0.3.0" uri-js "^3.0.2" +ajv@^6.4.0: + version "6.5.0" + resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.5.0.tgz#4c8affdf80887d8f132c9c52ab8a2dc4d0b7b24c" + dependencies: + fast-deep-equal "^2.0.1" + fast-json-stable-stringify "^2.0.0" + json-schema-traverse "^0.3.0" + uri-js "^4.2.1" + align-text@^0.1.1, align-text@^0.1.3: version "0.1.4" resolved "https://registry.yarnpkg.com/align-text/-/align-text-0.1.4.tgz#0cd90a561093f35d0a99256c22b7069433fad117" @@ -2104,7 +2113,7 @@ async@^1.4.0, async@^1.5.0, async@^1.5.2: version "1.5.2" resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a" -async@^2.1.2, async@^2.1.4, async@^2.4.1, async@^2.6.0: +async@^2.1.2, async@^2.1.4, async@^2.6.0: version "2.6.0" resolved "https://registry.yarnpkg.com/async/-/async-2.6.0.tgz#61a29abb6fcc026fea77e56d1c6ec53a795951f4" dependencies: @@ -4411,7 +4420,7 @@ css-color-names@0.0.4: version "0.0.4" resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0" -css-hot-loader@^1.3.8: +css-hot-loader@^1.3.9: version "1.3.9" resolved "https://registry.yarnpkg.com/css-hot-loader/-/css-hot-loader-1.3.9.tgz#ed22b41126920134a4a2246d7d32113e2425c754" dependencies: @@ -5139,7 +5148,7 @@ dot-prop@^4.1.0: dependencies: is-obj "^1.0.0" -dotenv-expand@^4.0.1: +dotenv-expand@^4.0.1, dotenv-expand@^4.2.0: version "4.2.0" resolved "https://registry.yarnpkg.com/dotenv-expand/-/dotenv-expand-4.2.0.tgz#def1f1ca5d6059d24a766e587942c21106ce1275" @@ -5263,7 +5272,7 @@ electron-builder-lib@~20.9.0: semver "^5.5.0" temp-file "^3.1.1" -electron-builder@^20.0.4, electron-builder@^20.9.0: +electron-builder@^20.9.0: version "20.11.1" resolved "https://registry.yarnpkg.com/electron-builder/-/electron-builder-20.11.1.tgz#a84feea424ac3abfa0dd1e4818dde8338250e543" dependencies: @@ -5291,6 +5300,15 @@ electron-devtools-installer@^2.2.3: rimraf "^2.5.2" semver "^5.3.0" +electron-devtools-installer@^2.2.4: + version "2.2.4" + resolved "https://registry.yarnpkg.com/electron-devtools-installer/-/electron-devtools-installer-2.2.4.tgz#261a50337e37121d338b966f07922eb4939a8763" + dependencies: + "7zip" "0.0.6" + cross-unzip "0.0.2" + rimraf "^2.5.2" + semver "^5.3.0" + electron-download-tf@4.3.4: version "4.3.4" resolved "https://registry.yarnpkg.com/electron-download-tf/-/electron-download-tf-4.3.4.tgz#b03740b2885aa2ad3f8784fae74df427f66d5165" @@ -5397,7 +5415,7 @@ electron-updater@^2.21.8: semver "^5.5.0" source-map-support "^0.5.4" -electron-webpack-js@~2.0.0: +electron-webpack-js@~2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/electron-webpack-js/-/electron-webpack-js-2.0.2.tgz#2a4d2274fc02e917396d8d9699f831554f6ebd2d" dependencies: @@ -5407,35 +5425,35 @@ electron-webpack-js@~2.0.0: babel-plugin-component "^1.1.0" babel-plugin-syntax-dynamic-import "^7.0.0-beta.3" -electron-webpack@^2.0.1: - version "2.0.1" - resolved "https://registry.yarnpkg.com/electron-webpack/-/electron-webpack-2.0.1.tgz#4b1f02ccd685cc5bbd16b300e68b00a256e38ad2" +electron-webpack@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/electron-webpack/-/electron-webpack-2.1.0.tgz#d229cdf8baca006bf9c360ba11e352f799f4004a" dependencies: - "@types/webpack-env" "^1.13.5" + "@types/webpack-env" "^1.13.6" async-exit-hook "^2.0.1" bluebird-lst "^1.0.5" - chalk "^2.3.2" + chalk "^2.4.1" crocket "^0.9.11" - css-hot-loader "^1.3.8" + css-hot-loader "^1.3.9" css-loader "^0.28.11" debug "^3.1.0" - electron-devtools-installer "^2.2.3" - electron-webpack-js "~2.0.0" - extract-text-webpack-plugin "^4.0.0-beta.0" + electron-devtools-installer "^2.2.4" + electron-webpack-js "~2.0.2" file-loader "^1.1.11" - fs-extra-p "^4.5.2" + fs-extra-p "^4.6.0" html-loader "^1.0.0-alpha.0" - html-webpack-plugin "^3.1.0" + html-webpack-plugin "^3.2.0" lazy-val "^1.0.3" + mini-css-extract-plugin "^0.4.0" node-loader "^0.6.0" - read-config-file "^3.0.0" + read-config-file "^3.0.1" semver "^5.5.0" - source-map-support "^0.5.4" - style-loader "^0.20.3" - uglifyjs-webpack-plugin "^1.2.4" + source-map-support "^0.5.5" + style-loader "^0.21.0" + uglifyjs-webpack-plugin "^1.2.5" url-loader "^1.0.1" - webpack-cli "^2.0.13" - webpack-dev-server "^3.1.1" + webpack-cli "^2.1.3" + webpack-dev-server "^3.1.4" webpack-merge "^4.1.2" yargs "^11.1.0" @@ -5447,14 +5465,6 @@ electron@1.8.4: electron-download "^3.0.1" extract-zip "^1.0.3" -electron@^1.8.2: - version "1.8.6" - resolved "https://registry.yarnpkg.com/electron/-/electron-1.8.6.tgz#6d45e377b321a35b78a794b64e40b2cf8face6ae" - dependencies: - "@types/node" "^8.0.24" - electron-download "^3.0.1" - extract-zip "^1.0.3" - elegant-spinner@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/elegant-spinner/-/elegant-spinner-1.0.1.tgz#db043521c95d7e303fd8f345bedc3349cfb0729e" @@ -6029,15 +6039,6 @@ extglob@^2.0.4: snapdragon "^0.8.1" to-regex "^3.0.1" -extract-text-webpack-plugin@^4.0.0-beta.0: - version "4.0.0-beta.0" - resolved "https://registry.yarnpkg.com/extract-text-webpack-plugin/-/extract-text-webpack-plugin-4.0.0-beta.0.tgz#f7361d7ff430b42961f8d1321ba8c1757b5d4c42" - dependencies: - async "^2.4.1" - loader-utils "^1.1.0" - schema-utils "^0.4.5" - webpack-sources "^1.1.0" - extract-zip@^1.0.3: version "1.6.6" resolved "https://registry.yarnpkg.com/extract-zip/-/extract-zip-1.6.6.tgz#1290ede8d20d0872b429fd3f351ca128ec5ef85c" @@ -6059,6 +6060,10 @@ fast-deep-equal@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-1.1.0.tgz#c053477817c86b51daa853c81e059b733d023614" +fast-deep-equal@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-2.0.1.tgz#7b05218ddf9667bf7f370bf7fdb2cb15fdd0aa49" + fast-glob@^2.0.2: version "2.2.1" resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-2.2.1.tgz#686c2345be88f3741e174add0be6f2e5b6078889" @@ -6344,6 +6349,13 @@ fs-extra-p@^4.5.0, fs-extra-p@^4.5.2: bluebird-lst "^1.0.5" fs-extra "^5.0.0" +fs-extra-p@^4.6.0: + version "4.6.0" + resolved "https://registry.yarnpkg.com/fs-extra-p/-/fs-extra-p-4.6.0.tgz#c7b7117f0dcf8a99c9b2ed589067c960abcf3ef9" + dependencies: + bluebird-lst "^1.0.5" + fs-extra "^6.0.0" + fs-extra@^0.30.0: version "0.30.0" resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-0.30.0.tgz#f233ffcc08d4da7d432daa449776989db1df93f0" @@ -6378,6 +6390,14 @@ fs-extra@^5.0.0: jsonfile "^4.0.0" universalify "^0.1.0" +fs-extra@^6.0.0: + version "6.0.1" + resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-6.0.1.tgz#8abc128f7946e310135ddc93b98bddb410e7a34b" + dependencies: + graceful-fs "^4.1.2" + jsonfile "^4.0.0" + universalify "^0.1.0" + fs-minipass@^1.2.5: version "1.2.5" resolved "https://registry.yarnpkg.com/fs-minipass/-/fs-minipass-1.2.5.tgz#06c277218454ec288df77ada54a03b8702aacb9d" @@ -6995,7 +7015,7 @@ html-webpack-plugin@^2.30.1: pretty-error "^2.0.2" toposort "^1.0.0" -html-webpack-plugin@^3.1.0: +html-webpack-plugin@^3.2.0: version "3.2.0" resolved "https://registry.yarnpkg.com/html-webpack-plugin/-/html-webpack-plugin-3.2.0.tgz#b01abbd723acaaa7b37b6af4492ebda03d9dd37b" dependencies: @@ -8165,6 +8185,12 @@ json5@^0.5.0, json5@^0.5.1: version "0.5.1" resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821" +json5@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.1.tgz#779fb0018604fa854eacbf6252180d83543e3dbe" + dependencies: + minimist "^1.2.0" + jsonfile@^2.1.0: version "2.4.0" resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-2.4.0.tgz#3736a2b428b87bbda0cc83b53fa3d633a35c2ae8" @@ -8266,17 +8292,11 @@ lcid@^1.0.0: dependencies: invert-kv "^1.0.0" -ledger-test-library@KhalilBellakrid/ledger-test-library-nodejs#7d37482: +ledger-test-library@MortalKastor/ledger-test-library-nodejs#d782241: version "1.0.0" - resolved "https://codeload.github.com/KhalilBellakrid/ledger-test-library-nodejs/tar.gz/7d374820ae44f1b7d2177dfe52deb4702a36cb65" + resolved "https://codeload.github.com/MortalKastor/ledger-test-library-nodejs/tar.gz/d782241ab1fd227c891b55c77e802fd76b8474bb" dependencies: axios "^0.17.1" - bindings "^1.3.0" - electron "^1.8.2" - electron-builder "^20.0.4" - electron-rebuild "^1.7.3" - nan "^2.6.2" - prebuild-install "^2.2.2" left-pad@^1.2.0: version "1.3.0" @@ -8776,6 +8796,13 @@ min-document@^2.19.0: dependencies: dom-walk "^0.1.0" +mini-css-extract-plugin@^0.4.0: + version "0.4.0" + resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-0.4.0.tgz#ff3bf08bee96e618e177c16ca6131bfecef707f9" + dependencies: + loader-utils "^1.1.0" + webpack-sources "^1.1.0" + minimalistic-assert@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7" @@ -10625,7 +10652,7 @@ read-chunk@^2.1.0: pify "^3.0.0" safe-buffer "^5.1.1" -read-config-file@3.0.0, read-config-file@^3.0.0: +read-config-file@3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/read-config-file/-/read-config-file-3.0.0.tgz#771def5184a7f76abaf6b2c82f20cb983775b8ea" dependencies: @@ -10639,6 +10666,20 @@ read-config-file@3.0.0, read-config-file@^3.0.0: json5 "^0.5.1" lazy-val "^1.0.3" +read-config-file@^3.0.1: + version "3.0.1" + resolved "https://registry.yarnpkg.com/read-config-file/-/read-config-file-3.0.1.tgz#307ed2e162fa54306d0ae6d41e9cdc829720d2a9" + dependencies: + ajv "^6.4.0" + ajv-keywords "^3.2.0" + bluebird-lst "^1.0.5" + dotenv "^5.0.1" + dotenv-expand "^4.2.0" + fs-extra-p "^4.6.0" + js-yaml "^3.11.0" + json5 "^1.0.1" + lazy-val "^1.0.3" + read-pkg-up@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-1.0.1.tgz#9d63c13276c065918d57f002a57f40a1b643fb02" @@ -11864,6 +11905,13 @@ style-loader@^0.20.3: loader-utils "^1.1.0" schema-utils "^0.4.5" +style-loader@^0.21.0: + version "0.21.0" + resolved "https://registry.yarnpkg.com/style-loader/-/style-loader-0.21.0.tgz#68c52e5eb2afc9ca92b6274be277ee59aea3a852" + dependencies: + loader-utils "^1.1.0" + schema-utils "^0.4.5" + styled-components@^3.2.6: version "3.2.6" resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-3.2.6.tgz#99e6e75a746bdedd295a17e03dd1493055a1cc3b" @@ -12316,7 +12364,7 @@ uglifyjs-webpack-plugin@^0.4.6: uglify-js "^2.8.29" webpack-sources "^1.0.1" -uglifyjs-webpack-plugin@^1.2.4: +uglifyjs-webpack-plugin@^1.2.4, uglifyjs-webpack-plugin@^1.2.5: version "1.2.5" resolved "https://registry.yarnpkg.com/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.2.5.tgz#2ef8387c8f1a903ec5e44fa36f9f3cbdcea67641" dependencies: @@ -12463,6 +12511,12 @@ uri-js@^3.0.2: dependencies: punycode "^2.1.0" +uri-js@^4.2.1: + version "4.2.1" + resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.2.1.tgz#4595a80a51f356164e22970df64c7abd6ade9850" + dependencies: + punycode "^2.1.0" + urix@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/urix/-/urix-0.1.0.tgz#da937f7a62e21fec1fd18d49b35c2935067a6c72" @@ -12727,7 +12781,7 @@ webpack-bundle-analyzer@^2.11.1: opener "^1.4.3" ws "^4.0.0" -webpack-cli@^2.0.13, webpack-cli@^2.0.14: +webpack-cli@^2.0.14: version "2.1.2" resolved "https://registry.yarnpkg.com/webpack-cli/-/webpack-cli-2.1.2.tgz#9c9a4b90584f7b8acaf591238ef0667e04c817f6" dependencies: @@ -12758,6 +12812,37 @@ webpack-cli@^2.0.13, webpack-cli@^2.0.14: yeoman-environment "^2.0.0" yeoman-generator "^2.0.4" +webpack-cli@^2.1.3: + version "2.1.3" + resolved "https://registry.yarnpkg.com/webpack-cli/-/webpack-cli-2.1.3.tgz#65d166851abaa56067ef3f716b02a97ba6bbe84d" + dependencies: + chalk "^2.3.2" + cross-spawn "^6.0.5" + diff "^3.5.0" + enhanced-resolve "^4.0.0" + envinfo "^4.4.2" + glob-all "^3.1.0" + global-modules "^1.0.0" + got "^8.2.0" + import-local "^1.0.0" + inquirer "^5.1.0" + interpret "^1.0.4" + jscodeshift "^0.5.0" + listr "^0.13.0" + loader-utils "^1.1.0" + lodash "^4.17.5" + log-symbols "^2.2.0" + mkdirp "^0.5.1" + p-each-series "^1.0.0" + p-lazy "^1.0.0" + prettier "^1.5.3" + supports-color "^5.3.0" + v8-compile-cache "^1.1.2" + webpack-addons "^1.1.5" + yargs "^11.1.0" + yeoman-environment "^2.0.0" + yeoman-generator "^2.0.4" + webpack-core@~0.6.0: version "0.6.9" resolved "https://registry.yarnpkg.com/webpack-core/-/webpack-core-0.6.9.tgz#fc571588c8558da77be9efb6debdc5a3b172bdc2" @@ -12765,9 +12850,9 @@ webpack-core@~0.6.0: source-list-map "~0.1.7" source-map "~0.4.1" -webpack-dev-middleware@3.1.2: - version "3.1.2" - resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-3.1.2.tgz#be4d0c36a4fa7d69d6904093418514caa9df3a40" +webpack-dev-middleware@3.1.3: + version "3.1.3" + resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-3.1.3.tgz#8b32aa43da9ae79368c1bf1183f2b6cf5e1f39ed" dependencies: loud-rejection "^1.6.0" memory-fs "~0.4.1" @@ -12787,9 +12872,9 @@ webpack-dev-middleware@^1.12.2: range-parser "^1.0.3" time-stamp "^2.0.0" -webpack-dev-server@^3.1.1: - version "3.1.3" - resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-3.1.3.tgz#5cecfd8a9d60c4638284813f1cf9562f04e5c1c5" +webpack-dev-server@^3.1.4: + version "3.1.4" + resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-3.1.4.tgz#9a08d13c4addd1e3b6d8ace116e86715094ad5b4" dependencies: ansi-html "0.0.7" array-includes "^3.0.3" @@ -12816,7 +12901,7 @@ webpack-dev-server@^3.1.1: spdy "^3.4.1" strip-ansi "^3.0.0" supports-color "^5.1.0" - webpack-dev-middleware "3.1.2" + webpack-dev-middleware "3.1.3" webpack-log "^1.1.2" yargs "11.0.0" From 28af74f65b22795582452fff187afda12fe0adae Mon Sep 17 00:00:00 2001 From: NastiaS Date: Tue, 15 May 2018 09:42:02 +0200 Subject: [PATCH 3/9] wip --- src/components/GlobalSearch.js | 30 ++++++++++++---------- src/components/TopBar.js | 2 +- src/components/modals/SettingsAccount.js | 32 ++++++++++++++++++++---- 3 files changed, 45 insertions(+), 19 deletions(-) diff --git a/src/components/GlobalSearch.js b/src/components/GlobalSearch.js index a0ddf36d..1b16208a 100644 --- a/src/components/GlobalSearch.js +++ b/src/components/GlobalSearch.js @@ -1,6 +1,6 @@ // @flow -import React, { PureComponent } from 'react' +import React, { PureComponent, Fragment } from 'react' import styled from 'styled-components' import type { T } from 'types/common' @@ -29,6 +29,7 @@ type State = { type Props = { t: T, + isHidden: boolean, } class GlobalSearch extends PureComponent { @@ -55,21 +56,24 @@ class GlobalSearch extends PureComponent { }) render() { - const { t } = this.props + const { t, isHidden } = this.props const { isFocused } = this.state - return ( - - - - ) } diff --git a/src/components/TopBar.js b/src/components/TopBar.js index 836e62e5..59102ee9 100644 --- a/src/components/TopBar.js +++ b/src/components/TopBar.js @@ -152,7 +152,7 @@ class TopBar extends PureComponent { - + diff --git a/src/components/modals/SettingsAccount.js b/src/components/modals/SettingsAccount.js index e5abc368..70250910 100644 --- a/src/components/modals/SettingsAccount.js +++ b/src/components/modals/SettingsAccount.js @@ -4,7 +4,7 @@ import React, { PureComponent } from 'react' import { connect } from 'react-redux' import get from 'lodash/get' import { push } from 'react-router-redux' -import type { Account } from '@ledgerhq/live-common/lib/types' +import type { Account, Unit } from '@ledgerhq/live-common/lib/types' import { MODAL_SETTINGS_ACCOUNT } from 'config/constants' @@ -14,6 +14,7 @@ import { setDataModal, closeModal } from 'reducers/modals' import Box from 'components/base/Box' import Button from 'components/base/Button' import Input from 'components/base/Input' +import Select from 'components/base/Select/index' import Modal, { ModalBody, ModalTitle, ModalFooter, ModalContent } from 'components/base/Modal' import Label from 'components/base/Label' @@ -24,6 +25,7 @@ type State = { minConfirmations: number | null, editName: boolean, nameHovered: boolean, + editUnit: boolean, } type Props = { @@ -47,6 +49,7 @@ const defaultState = { accountName: null, minConfirmations: null, nameHovered: false, + editUnit: false, } function hasNoOperations(account: Account) { @@ -62,7 +65,6 @@ class SettingsAccount extends PureComponent { const { accountName, minConfirmations } = this.state const account = get(data, 'account', {}) - return { ...account, ...(accountName !== null @@ -146,8 +148,15 @@ class SettingsAccount extends PureComponent { ...defaultState, }) + handleChangeUnit = (value: Unit, account: Account) => { + const { updateAccount, setDataModal } = this.props + account = { ...account, unit: value } + updateAccount(account) + setDataModal(MODAL_SETTINGS_ACCOUNT, { account }) + } + render() { - const { editName, nameHovered } = this.state + const { editName, nameHovered, editUnit } = this.state return ( { onHide={this.handleHide} render={({ data, onClose }) => { const account = this.getAccount(data) - return ( {'Account settings'} @@ -205,12 +213,26 @@ class SettingsAccount extends PureComponent { onChange={this.handleChangeMinConfirmations(account)} /> + {editUnit && ( + + + + )} - + ) From ad2f7a9c9ed8308af2bbe4c8dbf46cee20d1ba0a Mon Sep 17 00:00:00 2001 From: "Valentin D. Pinkman" Date: Tue, 15 May 2018 12:07:59 +0200 Subject: [PATCH 4/9] add feedback on hover to settings button --- src/components/TopBar.js | 18 +++++++++++++++--- src/components/base/Box/index.js | 6 +++++- 2 files changed, 20 insertions(+), 4 deletions(-) diff --git a/src/components/TopBar.js b/src/components/TopBar.js index 836e62e5..e249a5ea 100644 --- a/src/components/TopBar.js +++ b/src/components/TopBar.js @@ -11,7 +11,7 @@ import { ipcRenderer } from 'electron' import type { Location, RouterHistory } from 'react-router' import type { T } from 'types/common' -import { rgba } from 'styles/helpers' +import { rgba, darken } from 'styles/helpers' import { lock } from 'reducers/application' import { hasPassword } from 'reducers/settings' @@ -50,6 +50,18 @@ const Bar = styled.div` background: ${p => p.theme.colors.fog}; ` +const SettingButtonContainer = styled(Box).attrs({ + px: 4, + ml: 0, + justifyContent: 'center', + cursor: 'pointer', +})` + &:hover > * { + color: ${p => darken(p.theme.colors.graphite, 0.15)}; + cursor: pointer; + } +` + const Activity = styled.div` background: ${p => p.progress === true @@ -175,9 +187,9 @@ class TopBar extends PureComponent { - + - + {hasPassword && ( diff --git a/src/components/base/Box/index.js b/src/components/base/Box/index.js index 36321de8..dc058b2f 100644 --- a/src/components/base/Box/index.js +++ b/src/components/base/Box/index.js @@ -12,7 +12,6 @@ import { justifyContent, space, style, - cursor, } from 'styled-system' import fontFamily from 'styles/styled/fontFamily' @@ -24,6 +23,11 @@ const textAlign = style({ cssProperty: 'textAlign', }) +const cursor = style({ + prop: 'cursor', + cssProperty: 'cursor', +}) + const Box = styled.div` ${alignItems}; ${borderRadius}; From 3fe79d08541948a9238f4dca7fc914d3cff7e4e2 Mon Sep 17 00:00:00 2001 From: NastiaS Date: Tue, 15 May 2018 16:38:08 +0200 Subject: [PATCH 5/9] wip start slide and options slide --- src/components/Onboarding/steps/Init.js | 156 +++++++++++++---------- src/components/Onboarding/steps/Start.js | 13 +- src/icons/onboarding/GetStartedLogo.js | 79 ++++++++++++ 3 files changed, 175 insertions(+), 73 deletions(-) create mode 100644 src/icons/onboarding/GetStartedLogo.js diff --git a/src/components/Onboarding/steps/Init.js b/src/components/Onboarding/steps/Init.js index 0ed00ea6..99a5d759 100644 --- a/src/components/Onboarding/steps/Init.js +++ b/src/components/Onboarding/steps/Init.js @@ -1,90 +1,112 @@ // @flow import React from 'react' -import styled from 'styled-components' import { shell } from 'electron' -import Box from 'components/base/Box' +import styled from 'styled-components' +import Box, { Card } from 'components/base/Box' import IconUser from 'icons/User' -import { Title, Description, Inner } from '../helperComponents' +import IconChevronRight from 'icons/ChevronRight' +import { Title } from '../helperComponents' import type { StepProps } from '..' export default (props: StepProps) => { const { nextStep, jumpStep } = props - const handleOpenLink = (url: string) => () => shell.openExternal(url) - /* TODO: all titles, descriptions to be wrapped in a translation tag once defined */ + const optionCards = [ + { + key: 'newDevice', + icon: , + title: 'Initialize your new Ledger device', + desc: 'Please replace it with the final wording once it’s done.', + onClick: () => nextStep(), + }, + { + key: 'restoreDevice', + icon: , + title: 'Restore a Ledger device', + desc: 'Please replace it with the final wording once it’s done.', + onClick: () => jumpStep('choosePIN'), + }, + { + key: 'initializedDevice', + icon: , + title: 'I have already initialized my device', + desc: 'Please replace it with the final wording once it’s done.', + onClick: () => jumpStep('choosePIN'), + }, + { + key: 'noDevice', + icon: , + title: 'Do not have a Ledger device yet? Buy one', + desc: 'Please replace it with the final wording once it’s done.', + onClick: () => shell.openExternal('https://www.ledger.fr/'), + }, + ] + return ( - This is the title of the screen. 1 line is the maximum - - This is a long text, please replace it with the final wording once it’s done. -
- Lorem ipsum dolor amet ledger lorem dolor ipsum amet - - - - nextStep()}> - {/* colors are temp, we don't have icons now */} - - - - Clean Nano S setup - Please replace it with the final wording once it’s done. - - jumpStep('choosePIN')}> - - - - Existing seed + Clean setup - Please replace it with the final wording once it’s done. - - + + - - - nextStep()}> - - - - Migrate accounts - Please replace it with the final wording once it’s done. - - - - - - Not a user, but would love to - Please replace it with the final wording once it’s done. - - + + + Welcome to Ledger Live, the computer companion app to your Ledger device. Please select + one of the options below: + + {optionCards.map(card => )} ) } -const DeviceContainer = styled(Box).attrs({ - alignItems: 'center', - justifyContent: 'center', -})` - width: 218px; - height: 204px; - border: 1px solid #d8d8d8; -` -const DeviceIcon = styled(Box).attrs({ - alignItems: 'center', - justifyContent: 'center', - color: 'graphite', +type CardType = { + icon: any, + desc: string, + title: string, + onClick: Function, +} + +export function OptionFlowCard({ card }: { card: CardType }) { + const { icon, desc, title, onClick } = card + return ( + + + {icon} + + + {title} + {desc} + + + + + + ) +} + +export const CardDescription = styled(Box).attrs({ + ff: 'Open Sans|Regular', + fontSize: 4, + textAlign: 'left', + color: 'smoke', +})`` +export const CardTitle = styled(Box).attrs({ + ff: 'Open Sans|Regular', + fontSize: 4, + textAlign: 'left', })` - width: 55px; - padding: 10px; + font-weight: 600; ` -export const TrackChoiceTitle = styled(Box).attrs({ - width: 152, - height: 27, - ff: 'Museo Sans|Regular', - fontSize: 5, - color: 'dark', -})`` diff --git a/src/components/Onboarding/steps/Start.js b/src/components/Onboarding/steps/Start.js index e3586584..ab948625 100644 --- a/src/components/Onboarding/steps/Start.js +++ b/src/components/Onboarding/steps/Start.js @@ -5,7 +5,7 @@ import React from 'react' import Box from 'components/base/Box' import Button from 'components/base/Button' -import LedgerLogo from 'icons/LockScreen' +import IconGetStarted from 'icons/onboarding/GetStartedLogo' import type { StepProps } from '..' import { Title, Description } from '../helperComponents' @@ -14,11 +14,12 @@ export default (props: StepProps) => { return ( - - Ledger Live - Welcome to the new Ledger Live Desktop app. - Let’s get started! - diff --git a/src/icons/onboarding/GetStartedLogo.js b/src/icons/onboarding/GetStartedLogo.js new file mode 100644 index 00000000..cce003ad --- /dev/null +++ b/src/icons/onboarding/GetStartedLogo.js @@ -0,0 +1,79 @@ +// @flow + +import React from 'react' + +export default () => ( + + + + + + + + + + + + + +) From 7799ae79781f6b9dd6549b5940def27d12f7ab39 Mon Sep 17 00:00:00 2001 From: NastiaS Date: Wed, 16 May 2018 13:32:18 +0200 Subject: [PATCH 6/9] selectPIN screen, chooseDevice screen --- src/components/Onboarding/index.js | 4 +- .../Onboarding/steps/ChooseDevice.js | 46 ++++++--- src/components/Onboarding/steps/ChoosePIN.js | 93 ++++++++++++++++--- src/components/Onboarding/steps/Init.js | 27 +++--- src/components/Onboarding/steps/Start.js | 6 +- src/icons/onboarding/LedgerBlue.js | 32 +++++++ src/icons/onboarding/LedgerNano.js | 36 +++++++ src/icons/onboarding/SelectPIN.js | 75 +++++++++++++++ static/i18n/en/onboarding.yml | 34 +++++++ 9 files changed, 306 insertions(+), 47 deletions(-) create mode 100644 src/icons/onboarding/LedgerBlue.js create mode 100644 src/icons/onboarding/LedgerNano.js create mode 100644 src/icons/onboarding/SelectPIN.js create mode 100644 static/i18n/en/onboarding.yml diff --git a/src/components/Onboarding/index.js b/src/components/Onboarding/index.js index ca9dbdf7..8fe5e2a8 100644 --- a/src/components/Onboarding/index.js +++ b/src/components/Onboarding/index.js @@ -128,7 +128,7 @@ class Onboarding extends PureComponent { const Container = styled(Box).attrs({ bg: 'white', - p: 5, + p: 60, })` position: fixed; top: 0; @@ -138,6 +138,6 @@ const Container = styled(Box).attrs({ z-index: 25; ` const StepContainer = styled(Box).attrs({ - p: 20, + p: 40, })`` export default compose(connect(mapStateToProps, mapDispatchToProps), translate())(Onboarding) diff --git a/src/components/Onboarding/steps/ChooseDevice.js b/src/components/Onboarding/steps/ChooseDevice.js index 7da5e8a8..582ad42d 100644 --- a/src/components/Onboarding/steps/ChooseDevice.js +++ b/src/components/Onboarding/steps/ChooseDevice.js @@ -4,39 +4,40 @@ import React from 'react' import styled from 'styled-components' import Box from 'components/base/Box' -import IconNanoS from 'icons/device/NanoS' -import IconBlue from 'icons/device/Blue' +import IconLedgerNano from 'icons/onboarding/LedgerNano' +import IconLedgerBlue from 'icons/onboarding/LedgerBlue' import { Title, Description, Inner } from '../helperComponents' import type { StepProps } from '..' export default (props: StepProps) => { - const { nextStep } = props + const { nextStep, t } = props return ( - This is the title of the screen. 1 line is the maximum - - This is a long text, please replace it with the final wording once it’s done. -
- Lorem ipsum dolor amet ledger lorem dolor ipsum amet - + {t('onboarding:chooseDevice.title')} + {/* TODO shrink description so it forms 2 lines */} + {t('onboarding:chooseDevice.desc')} nextStep()}> - + - Ledger Nano S - Please replace it with the final wording once it’s done. + {t('onboarding:chooseDevice.ledgerNanoCard.title')} + + {t('onboarding:chooseDevice.ledgerNanoCard.desc')} + - + - Ledger Blue - Please replace it with the final wording once it’s done. + {t('onboarding:chooseDevice.ledgerBlueCard.title')} + + {t('onboarding:chooseDevice.ledgerBlueCard.desc')} + @@ -59,4 +60,19 @@ const DeviceIcon = styled(Box).attrs({ color: 'graphite', })` width: 55px; + min-height: 80px; +` +export const BlockDescription = styled(Box).attrs({ + ff: 'Open Sans|Regular', + fontSize: 4, + textAlign: 'center', + color: 'smoke', +})`` +export const BlockTitle = styled(Box).attrs({ + ff: 'Open Sans|Regular', + fontSize: 4, + textAlign: 'center', +})` + font-weight: 600; + padding-bottom: 10px; ` diff --git a/src/components/Onboarding/steps/ChoosePIN.js b/src/components/Onboarding/steps/ChoosePIN.js index 794f4b71..48cabebb 100644 --- a/src/components/Onboarding/steps/ChoosePIN.js +++ b/src/components/Onboarding/steps/ChoosePIN.js @@ -4,30 +4,99 @@ import React from 'react' import Box from 'components/base/Box' import Button from 'components/base/Button' -import { Title, Description, OnboardingFooter } from '../helperComponents' +import styled from 'styled-components' + +import IconSelectPIN from 'icons/onboarding/SelectPIN' +import { Title, Description, OnboardingFooter, Inner } from '../helperComponents' import type { StepProps } from '..' +export const IconSelectStep = styled(Box).attrs({ + width: 26, + height: 26, + textAlign: 'center', +})` + border-radius: 100%; + background: #6490f126; +` + export default (props: StepProps) => { - const { nextStep, prevStep } = props + const { nextStep, prevStep, t } = props + const steps = [ + { + key: 'step1', + icon: 1, + desc: t('onboarding:selectPIN.instructions.step1'), + }, + { + key: 'step2', + icon: 2, + desc: t('onboarding:selectPIN.instructions.step2'), + }, + { + key: 'step3', + icon: 3, + desc: t('onboarding:selectPIN.instructions.step3'), + }, + { + key: 'step4', + icon: 4, + desc: t('onboarding:selectPIN.instructions.step4'), + }, + ] return ( - - - This is CHOOSE PIN screen. 1 line is the maximum - - This is a long text, please replace it with the final wording once it’s done. -
- Lorem ipsum dolor amet ledger lorem dolor ipsum amet - + + + + {t('onboarding:selectPIN.title')} + {t('onboarding:selectPIN.desc')} + + + + + + + + + {steps.map(step => )} + + + - + - ) } + +type StepType = { + icon: any, + desc: string, +} +export function SelectPINStep({ step }: { step: StepType }) { + const { icon, desc } = step + return ( + + + {icon} + + + {desc} + + + ) +} + +export const CardDescription = styled(Box).attrs({ + ff: 'Open Sans|Regular', + fontSize: 4, + textAlign: 'left', + color: 'smoke', + shrink: 1, +})`` diff --git a/src/components/Onboarding/steps/Init.js b/src/components/Onboarding/steps/Init.js index 99a5d759..355ded40 100644 --- a/src/components/Onboarding/steps/Init.js +++ b/src/components/Onboarding/steps/Init.js @@ -12,34 +12,34 @@ import { Title } from '../helperComponents' import type { StepProps } from '..' export default (props: StepProps) => { - const { nextStep, jumpStep } = props + const { nextStep, jumpStep, t } = props const optionCards = [ { key: 'newDevice', icon: , - title: 'Initialize your new Ledger device', - desc: 'Please replace it with the final wording once it’s done.', + title: t('onboarding:init.newDevice.title'), + desc: t('onboarding:init.newDevice.desc'), onClick: () => nextStep(), }, { key: 'restoreDevice', icon: , - title: 'Restore a Ledger device', - desc: 'Please replace it with the final wording once it’s done.', + title: t('onboarding:init.restoreDevice.title'), + desc: t('onboarding:init.restoreDevice.desc'), onClick: () => jumpStep('choosePIN'), }, { key: 'initializedDevice', icon: , - title: 'I have already initialized my device', - desc: 'Please replace it with the final wording once it’s done.', + title: t('onboarding:init.initializedDevice.title'), + desc: t('onboarding:init.initializedDevice.desc'), onClick: () => jumpStep('choosePIN'), }, { key: 'noDevice', icon: , - title: 'Do not have a Ledger device yet? Buy one', - desc: 'Please replace it with the final wording once it’s done.', + title: t('onboarding:init.noDevice.title'), + desc: t('onboarding:init.noDevice.desc'), onClick: () => shell.openExternal('https://www.ledger.fr/'), }, ] @@ -51,10 +51,7 @@ export default (props: StepProps) => { - - Welcome to Ledger Live, the computer companion app to your Ledger device. Please select - one of the options below: - + {t('onboarding:init.title')} {optionCards.map(card => )} @@ -64,8 +61,8 @@ export default (props: StepProps) => { type CardType = { icon: any, - desc: string, - title: string, + desc: any, + title: any, onClick: Function, } diff --git a/src/components/Onboarding/steps/Start.js b/src/components/Onboarding/steps/Start.js index ab948625..773c9cfa 100644 --- a/src/components/Onboarding/steps/Start.js +++ b/src/components/Onboarding/steps/Start.js @@ -10,14 +10,14 @@ import type { StepProps } from '..' import { Title, Description } from '../helperComponents' export default (props: StepProps) => { - const { jumpStep } = props + const { jumpStep, t } = props return ( - Welcome to the new Ledger Live Desktop app. - Let’s get started! + {t('onboarding:start.title')} + {t('onboarding:start.desc')} + + +) +export default OnboardingFooter diff --git a/src/components/Onboarding/helperComponents.js b/src/components/Onboarding/helperComponents.js index 2c0da32a..8b2a03e1 100644 --- a/src/components/Onboarding/helperComponents.js +++ b/src/components/Onboarding/helperComponents.js @@ -1,11 +1,13 @@ // @flow +import React from 'react' import styled from 'styled-components' import { radii } from 'styles/theme' import Box from 'components/base/Box' +// GENERAL export const Title = styled(Box).attrs({ - width: 152, + width: 267, height: 27, ff: 'Museo Sans|Regular', fontSize: 7, @@ -13,12 +15,13 @@ export const Title = styled(Box).attrs({ })`` export const Description = styled(Box).attrs({ - width: 340, - height: 36, - ff: 'Open Sans|Regular', - fontSize: 4, + width: 714, + height: 48, + ff: 'Museo Sans|Light', + fontSize: 5, + lineHeight: 1.5, textAlign: 'center', - color: 'smoke', + color: 'grey', })` margin: 10px auto 25px; ` @@ -28,6 +31,7 @@ export const Inner = styled(Box).attrs({ flow: 4, })`` +// FOOTER export const OnboardingFooter = styled(Box).attrs({ px: 5, py: 3, @@ -36,3 +40,43 @@ export const OnboardingFooter = styled(Box).attrs({ border-bottom-left-radius: ${radii[1]}px; border-bottom-right-radius: ${radii[1]}px; ` + +// INSTRUCTION LIST +type StepType = { + icon: any, + desc: string, +} +export function InstructionStep({ step }: { step: StepType }) { + const { icon, desc } = step + return ( + + + {icon} + + + {desc} + + + ) +} +export const InstructionStepDesc = styled(Box).attrs({ + ff: 'Open Sans|Regular', + fontSize: 4, + textAlign: 'left', + lineHeight: 1.69, + color: 'smoke', + shrink: 1, +})`` + +export const IconInstructionStep = styled(Box).attrs({ + width: 26, + height: 26, + ff: 'Rubik|Regular', + textAlign: 'center', + fontSize: 3, + color: 'wallet', +})` + border-radius: 100%; + background: #6490f126; + line-height: 2; +` diff --git a/src/components/Onboarding/index.js b/src/components/Onboarding/index.js index 8fe5e2a8..6c5295a9 100644 --- a/src/components/Onboarding/index.js +++ b/src/components/Onboarding/index.js @@ -21,8 +21,8 @@ import Box from 'components/base/Box' import Start from './steps/Start' import InitStep from './steps/Init' import OnboardingBreadcrumb from './OnboardingBreadcrumb' -import ChooseDevice from './steps/ChooseDevice' -import ChoosePIN from './steps/ChoosePIN' +import SelectDevice from './steps/SelectDevice' +import SelectPIN from './steps/SelectPIN' import WriteSeed from './steps/WriteSeed' import GenuineCheck from './steps/GenuineCheck' import SetPassword from './steps/SetPassword' @@ -31,8 +31,8 @@ import Finish from './steps/Finish' const STEPS = { init: InitStep, - chooseDevice: ChooseDevice, - choosePIN: ChoosePIN, + selectDevice: SelectDevice, + selectPIN: SelectPIN, writeSeed: WriteSeed, genuineCheck: GenuineCheck, setPassword: SetPassword, diff --git a/src/components/Onboarding/steps/ChoosePIN.js b/src/components/Onboarding/steps/ChoosePIN.js deleted file mode 100644 index 48cabebb..00000000 --- a/src/components/Onboarding/steps/ChoosePIN.js +++ /dev/null @@ -1,102 +0,0 @@ -// @flow - -import React from 'react' - -import Box from 'components/base/Box' -import Button from 'components/base/Button' -import styled from 'styled-components' - -import IconSelectPIN from 'icons/onboarding/SelectPIN' -import { Title, Description, OnboardingFooter, Inner } from '../helperComponents' - -import type { StepProps } from '..' - -export const IconSelectStep = styled(Box).attrs({ - width: 26, - height: 26, - textAlign: 'center', -})` - border-radius: 100%; - background: #6490f126; -` - -export default (props: StepProps) => { - const { nextStep, prevStep, t } = props - const steps = [ - { - key: 'step1', - icon: 1, - desc: t('onboarding:selectPIN.instructions.step1'), - }, - { - key: 'step2', - icon: 2, - desc: t('onboarding:selectPIN.instructions.step2'), - }, - { - key: 'step3', - icon: 3, - desc: t('onboarding:selectPIN.instructions.step3'), - }, - { - key: 'step4', - icon: 4, - desc: t('onboarding:selectPIN.instructions.step4'), - }, - ] - return ( - - - - {t('onboarding:selectPIN.title')} - {t('onboarding:selectPIN.desc')} - - - - - - - - - {steps.map(step => )} - - - - - - - - - - ) -} - -type StepType = { - icon: any, - desc: string, -} -export function SelectPINStep({ step }: { step: StepType }) { - const { icon, desc } = step - return ( - - - {icon} - - - {desc} - - - ) -} - -export const CardDescription = styled(Box).attrs({ - ff: 'Open Sans|Regular', - fontSize: 4, - textAlign: 'left', - color: 'smoke', - shrink: 1, -})`` diff --git a/src/components/Onboarding/steps/Init.js b/src/components/Onboarding/steps/Init.js index 355ded40..9d088a19 100644 --- a/src/components/Onboarding/steps/Init.js +++ b/src/components/Onboarding/steps/Init.js @@ -53,7 +53,9 @@ export default (props: StepProps) => { {t('onboarding:init.title')} - {optionCards.map(card => )} + + {optionCards.map(card => )} + ) @@ -98,12 +100,10 @@ export const CardDescription = styled(Box).attrs({ ff: 'Open Sans|Regular', fontSize: 4, textAlign: 'left', - color: 'smoke', + color: 'grey', })`` export const CardTitle = styled(Box).attrs({ - ff: 'Open Sans|Regular', + ff: 'Open Sans|SemiBold', fontSize: 4, textAlign: 'left', -})` - font-weight: 600; -` +})`` diff --git a/src/components/Onboarding/steps/ChooseDevice.js b/src/components/Onboarding/steps/SelectDevice.js similarity index 72% rename from src/components/Onboarding/steps/ChooseDevice.js rename to src/components/Onboarding/steps/SelectDevice.js index 582ad42d..fc5d226a 100644 --- a/src/components/Onboarding/steps/ChooseDevice.js +++ b/src/components/Onboarding/steps/SelectDevice.js @@ -16,27 +16,26 @@ export default (props: StepProps) => { return ( - {t('onboarding:chooseDevice.title')} - {/* TODO shrink description so it forms 2 lines */} - {t('onboarding:chooseDevice.desc')} + {t('onboarding:selectDevice.title')} + {t('onboarding:selectDevice.desc')} nextStep()}> - {t('onboarding:chooseDevice.ledgerNanoCard.title')} + {t('onboarding:selectDevice.ledgerNanoCard.title')} - {t('onboarding:chooseDevice.ledgerNanoCard.desc')} + {t('onboarding:selectDevice.ledgerNanoCard.desc')} - {t('onboarding:chooseDevice.ledgerBlueCard.title')} + {t('onboarding:selectDevice.ledgerBlueCard.title')} - {t('onboarding:chooseDevice.ledgerBlueCard.desc')} + {t('onboarding:selectDevice.ledgerBlueCard.desc')} @@ -53,6 +52,11 @@ const DeviceContainer = styled(Box).attrs({ width: 218px; height: 204px; border: 1px solid #d8d8d8; + &:hover, + &:focus { + opacity: 0.5; + cursor: pointer; + } ` const DeviceIcon = styled(Box).attrs({ alignItems: 'center', @@ -66,13 +70,10 @@ export const BlockDescription = styled(Box).attrs({ ff: 'Open Sans|Regular', fontSize: 4, textAlign: 'center', - color: 'smoke', + color: 'grey', })`` export const BlockTitle = styled(Box).attrs({ - ff: 'Open Sans|Regular', + ff: 'Open Sans|SemiBold', fontSize: 4, textAlign: 'center', -})` - font-weight: 600; - padding-bottom: 10px; -` +})`` diff --git a/src/components/Onboarding/steps/SelectPIN.js b/src/components/Onboarding/steps/SelectPIN.js new file mode 100644 index 00000000..cf2c200e --- /dev/null +++ b/src/components/Onboarding/steps/SelectPIN.js @@ -0,0 +1,72 @@ +// @flow + +import React from 'react' + +import Box from 'components/base/Box' + +import IconSelectPIN from 'icons/onboarding/SelectPIN' +import { + Title, + Description, + Inner, + InstructionStep, + IconInstructionStep, +} from '../helperComponents' +import OnboardingFooter from '../OnboardingFooter' + +import type { StepProps } from '..' + +export default (props: StepProps) => { + const { nextStep, prevStep, t } = props + const steps = [ + { + key: 'step1', + icon: 1, + desc: t('onboarding:selectPIN.instructions.step1'), + }, + { + key: 'step2', + icon: 2, + desc: t('onboarding:selectPIN.instructions.step2'), + }, + { + key: 'step3', + icon: 3, + desc: t('onboarding:selectPIN.instructions.step3'), + }, + { + key: 'step4', + icon: 4, + desc: t('onboarding:selectPIN.instructions.step4'), + }, + ] + return ( + + + + {t('onboarding:selectPIN.title')} + {t('onboarding:selectPIN.desc')} + + + + + + + + + {steps.map(step => )} + + + + + + + ) +} diff --git a/src/components/Onboarding/steps/WriteSeed.js b/src/components/Onboarding/steps/WriteSeed.js index 31fe37ea..427aa2a2 100644 --- a/src/components/Onboarding/steps/WriteSeed.js +++ b/src/components/Onboarding/steps/WriteSeed.js @@ -3,31 +3,74 @@ import React from 'react' import Box from 'components/base/Box' -import Button from 'components/base/Button' -import { Title, Description, OnboardingFooter } from '../helperComponents' +import IconWriteSeed from 'icons/onboarding/WriteSeed' + +import { + Title, + Description, + Inner, + InstructionStep, + IconInstructionStep, +} from '../helperComponents' +import OnboardingFooter from '../OnboardingFooter' import type { StepProps } from '..' export default (props: StepProps) => { - const { nextStep, prevStep } = props + const { nextStep, prevStep, t } = props + const steps = [ + { + key: 'step1', + icon: 1, + desc: t('onboarding:writeSeed.instructions.step1'), + }, + { + key: 'step2', + icon: 2, + desc: t('onboarding:writeSeed.instructions.step2'), + }, + { + key: 'step3', + icon: 3, + desc: t('onboarding:writeSeed.instructions.step3'), + }, + { + key: 'step4', + icon: 4, + desc: t('onboarding:writeSeed.instructions.step4'), + }, + { + key: 'step5', + icon: 5, + desc: t('onboarding:writeSeed.instructions.step5'), + }, + ] return ( - - - This is WRITE SEED screen. 1 line is the maximum - - This is a long text, please replace it with the final wording once it’s done. -
- Lorem ipsum dolor amet ledger lorem dolor ipsum amet - + + + + {t('onboarding:writeSeed.title')} + {t('onboarding:writeSeed.desc')} + + + + + + + + {steps.map(step => )} + + + - - - - + ) } diff --git a/src/icons/onboarding/WriteSeed.js b/src/icons/onboarding/WriteSeed.js new file mode 100644 index 00000000..a802e9ba --- /dev/null +++ b/src/icons/onboarding/WriteSeed.js @@ -0,0 +1,197 @@ +// @flow + +import React from 'react' + +export default () => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +) diff --git a/src/reducers/onboarding.js b/src/reducers/onboarding.js index f392298a..8091a7b4 100644 --- a/src/reducers/onboarding.js +++ b/src/reducers/onboarding.js @@ -42,8 +42,8 @@ const state: OnboardingState = { }, }, { - name: 'chooseDevice', - label: 'chooseDevice:translated', + name: 'selectDevice', + label: 'Select Device', options: { showFooter: false, showBackground: true, @@ -51,8 +51,8 @@ const state: OnboardingState = { }, }, { - name: 'choosePIN', - label: 'choosePIN:translated', + name: 'selectPIN', + label: 'Select PIN', options: { showFooter: false, showBackground: true, @@ -61,7 +61,7 @@ const state: OnboardingState = { }, { name: 'writeSeed', - label: 'writeSeed:translated', + label: 'Write Seed', options: { showFooter: false, showBackground: true, @@ -70,7 +70,7 @@ const state: OnboardingState = { }, { name: 'genuineCheck', - label: 'genuineCheck:translated', + label: 'Genuine Check', options: { showFooter: false, showBackground: true, @@ -79,7 +79,7 @@ const state: OnboardingState = { }, { name: 'setPassword', - label: 'Password:translated', + label: 'Set Password', options: { showFooter: false, showBackground: true, @@ -88,7 +88,7 @@ const state: OnboardingState = { }, { name: 'analytics', - label: 'Analytics & Bug report:translated', + label: 'Analytics & Bug report', options: { showFooter: false, showBackground: true, diff --git a/static/i18n/en/common.yml b/static/i18n/en/common.yml index c9b90494..991cc004 100644 --- a/static/i18n/en/common.yml +++ b/static/i18n/en/common.yml @@ -1,6 +1,7 @@ ok: Okay confirm: Confirm cancel: Cancel +continue: Continue chooseWalletPlaceholder: Choose a wallet... currency: Currency selectAccount: Select an account diff --git a/static/i18n/en/onboarding.yml b/static/i18n/en/onboarding.yml index 059acb71..31c141a4 100644 --- a/static/i18n/en/onboarding.yml +++ b/static/i18n/en/onboarding.yml @@ -15,7 +15,7 @@ init: noDevice: title: Do not have a Ledger device yet? Buy one desc: Please replace it with the final wording once it’s done. -chooseDevice: +selectDevice: title: To get started, select your device desc: This is a long text, please replace it with the final wording once it’s done. Lorem ipsum dolor amet ledger lorem dolor ipsum amet ledgerNanoCard: @@ -32,3 +32,12 @@ selectPIN: step2: Press both buttons simultaneously as instructed on your Ledger Nano S screen. step3: Select Configure as new device on your Ledger Nano S by pressing the right button, located above the validation icon. step4: Choose a PIN code between 4 and 8 digits long. +writeSeed: + title: 24-Word Recovery phrase + desc: The 24 words that constitute your recovery phrase will now be displayed one by one on the Ledger Nano S screen. These 24 words will be displayed only once during this initialization. + instructions: + step1: Copy the first word (Word \#1) in position 1 on the blank Recovery sheet included in the box. + step2: Move to Word \#2 by pressing the right button, copy it in position 2 on the Recovery sheet. + step3: Repeat the process until all 24 words are copied on the Recovery sheet. + step4: To confirm, use the right or left button to select each of the 24 words in the right order. + step5: Validate each word by simultaneously pressing both buttons. From df4d6e1758a8dbd083a621f6f0373af9508e95fb Mon Sep 17 00:00:00 2001 From: NastiaS Date: Wed, 16 May 2018 16:54:41 +0200 Subject: [PATCH 8/9] added Finish Screen --- src/components/Onboarding/steps/Finish.js | 89 +++++++++++++++++++---- static/i18n/en/onboarding.yml | 5 ++ 2 files changed, 79 insertions(+), 15 deletions(-) diff --git a/src/components/Onboarding/steps/Finish.js b/src/components/Onboarding/steps/Finish.js index 513afa7d..2e880457 100644 --- a/src/components/Onboarding/steps/Finish.js +++ b/src/components/Onboarding/steps/Finish.js @@ -1,34 +1,93 @@ // @flow import React from 'react' +import { shell } from 'electron' +import styled from 'styled-components' import Box from 'components/base/Box' import Button from 'components/base/Button' -import Text from 'components/base/Text' -import IconFinishOnboarding from 'icons/LockScreen' +import IconCheckCircle from 'icons/CheckCircle' +import IconSocialTwitter from 'icons/Eye' +import IconSocialReddit from 'icons/User' +import IconSocialGithub from 'icons/Share' + import type { StepProps } from '..' import { Title, Description } from '../helperComponents' +const socialMedia = [ + { + key: 'twitter', + url: 'https://twitter.com/LedgerHQ', + icon: , + onClick: url => shell.openExternal(url), + }, + { + key: 'reddit', + url: 'https://www.reddit.com/r/ledgerwallet/', + icon: , + onClick: url => shell.openExternal(url), + }, + { + key: 'github', + url: 'https://github.com/LedgerHQ', + icon: , + onClick: url => shell.openExternal(url), + }, +] + export default (props: StepProps) => { - const { finish, jumpStep } = props + const { finish, t } = props return ( - - This is ENJOY THE APP screen. 1 line is the maximum - - This is a long text, please replace it with the final wording once it’s done. -
- Lorem ipsum dolor amet ledger lorem dolor ipsum amet - - - - jumpStep('start')} style={{ padding: 15 }}> - I want to go back to Onboarding + + {t('onboarding:finish.followUsLabel')} + + + {socialMedia.map(socMed => )} ) } + +type SocMed = { + icon: any, + url: string, + onClick: string => void, +} + +export function SocialMediaBox({ socMed }: { socMed: SocMed }) { + const { icon, url, onClick } = socMed + return ( + onClick(url)} + > + {icon} + + ) +} + +export const FollowUsDesc = styled(Box).attrs({ + ff: 'Museo Sans|Regular', + fontSize: 4, + textAlign: 'center', + color: 'grey', +})` + margin: 10px auto; +` diff --git a/static/i18n/en/onboarding.yml b/static/i18n/en/onboarding.yml index 31c141a4..53af20d7 100644 --- a/static/i18n/en/onboarding.yml +++ b/static/i18n/en/onboarding.yml @@ -41,3 +41,8 @@ writeSeed: step3: Repeat the process until all 24 words are copied on the Recovery sheet. step4: To confirm, use the right or left button to select each of the 24 words in the right order. step5: Validate each word by simultaneously pressing both buttons. +finish: + title: This is the title of the screen. 1 line is the maximum + desc: This is a long text, please replace it with the final wording once it’s done.
Lorem ipsum dolor amet ledger lorem dolor ipsum amet + openAppButton: Open app + followUsLabel: Follow us to stay updated From 5830008371347feee43eee486d6561ba26cf1a8b Mon Sep 17 00:00:00 2001 From: NastiaS Date: Wed, 16 May 2018 17:42:59 +0200 Subject: [PATCH 9/9] fixing flow-typed reselect issue --- src/reducers/settings.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/reducers/settings.js b/src/reducers/settings.js index c4ba3a2c..377cfd36 100644 --- a/src/reducers/settings.js +++ b/src/reducers/settings.js @@ -7,7 +7,7 @@ import { listCryptoCurrencies, } from '@ledgerhq/live-common/lib/helpers/currencies' import { createSelector } from 'reselect' -import type { Selector } from 'reselect' +import type { InputSelector as Selector } from 'reselect' import type { CryptoCurrency, Currency, Account } from '@ledgerhq/live-common/lib/types' import type { Settings, CurrencySettings } from 'types/common'