Fix issue with __static, fix issue with fakeDatas on Dashboard

electron-builder.yml

@@ -1,5 +1,7 @@
 appId: com.ledger.desktop
 
+buildDependenciesFromSource: true
+
 protocols:
   name: Ledger Wallet Desktop
   schemes:
@@ -39,7 +41,6 @@ nsis:
   perMachine: true
   allowToChangeInstallationDirectory: true
 
-
 files:
   - dist/internals
   - "!node_modules/jsqr/test-data${/*}"

package.json

@@ -47,10 +47,10 @@
     "@fortawesome/react-fontawesome": "^0.0.17",
     "@ledgerhq/common": "2.3.0",
     "@ledgerhq/currencies": "^2.3.0",
-    "@ledgerhq/hw-app-btc": "^3.0.8",
+    "@ledgerhq/hw-app-btc": "^4.0.0",
-    "@ledgerhq/hw-app-eth": "^3.0.0",
+    "@ledgerhq/hw-app-eth": "^4.0.0",
-    "@ledgerhq/hw-transport": "^3.0.0",
+    "@ledgerhq/hw-transport": "^4.0.0",
-    "@ledgerhq/hw-transport-node-hid": "^3.0.0",
+    "@ledgerhq/hw-transport-node-hid": "^4.0.0",
     "axios": "^0.17.1",
     "babel-runtime": "^6.26.0",
     "bcryptjs": "^2.4.3",
@@ -102,7 +102,7 @@
     "babel-core": "^6.26.0",
     "babel-eslint": "^8.2.1",
     "babel-loader": "^7.1.2",
-    "babel-plugin-module-resolver": "^3.0.0",
+    "babel-plugin-module-resolver": "^3.1.0",
     "babel-plugin-recharts": "^1.1.1",
     "babel-plugin-styled-components": "^1.5.0",
     "babel-preset-env": "^1.6.1",

src/components/App.js

@@ -15,6 +15,8 @@ import Default from 'components/layout/Default'
 import Dev from 'components/layout/Dev'
 import Print from 'components/layout/Print'
 
+const { DEV_TOOLS } = process.env
+
 export default ({
   store,
   history,
@@ -29,7 +31,7 @@ export default ({
       <ThemeProvider theme={theme}>
         <ConnectedRouter history={history}>
           <Switch>
-            {__DEV__ && <Route path="/dev" component={Dev} />}
+            {(__DEV__ || DEV_TOOLS) && <Route path="/dev" component={Dev} />}
             <Route path="/print" component={Print} />
             <Route component={Default} />
           </Switch>

src/components/DashboardPage/index.js

@@ -73,6 +73,9 @@ const generateFakeData = v => ({
   value: random(10, 100),
 })
 
+const generateFakeDatas = accounts =>
+  accounts.map(() => [...Array(25).keys()].map(v => generateFakeData(v + 1)))
+
 const getAllTransactions = accounts => {
   const allTransactions = accounts.reduce((result, account) => {
     const transactions = get(account, 'data.transactions', [])
@@ -98,13 +101,24 @@ const getAllTransactions = accounts => {
 class DashboardPage extends PureComponent<Props, State> {
   state = {
     selectedTime: 'day',
-    fakeDatas: this.generateFakeDatas(),
+    fakeDatas: generateFakeDatas(this.props.accounts),
   }
 
   componentDidMount() {
     this.addFakeDatasOnAccounts()
   }
 
+  componentWillReceiveProps(nextProps) {
+    if (
+      this.state.fakeDatas.length === 0 &&
+      nextProps.accounts.length !== this.props.accounts.length
+    ) {
+      this.setState({
+        fakeDatas: generateFakeDatas(nextProps.accounts),
+      })
+    }
+  }
+
   componentWillUnmount() {
     clearTimeout(this._timeout)
   }
@@ -126,29 +140,24 @@ class DashboardPage extends PureComponent<Props, State> {
     saveSettings({ orderAccounts: order })
   }
 
-  generateFakeDatas() {
+  addFakeDatasOnAccounts = () => {
     const { accounts } = this.props
-    return accounts.map(() => [...Array(25).keys()].map(v => generateFakeData(v + 1)))
-  }
 
-  addFakeDatasOnAccounts = () => {
     this._timeout = setTimeout(() => {
-      const { accounts } = this.props
+      window.requestAnimationFrame(() => {
-
+        this.setState(prev => ({
-      this.setState(prev => ({
+          fakeDatas: [
-        fakeDatas: [
+            ...accounts.reduce((res, acc, i) => {
-          ...accounts.reduce((res, acc, i) => {
+              if (res[i]) {
-            if (res[i]) {
+                const nextIndex = res[i].length
-              const nextIndex = res[i].length
+                res[i][nextIndex] = generateFakeData(nextIndex)
-              res[i][nextIndex] = generateFakeData(nextIndex)
+              }
-            }
+              return res
-            return res
+            }, prev.fakeDatas),
-          }, prev.fakeDatas),
+          ],
-        ],
+        }))
-      }))
+      }, TIMEOUT_REFRESH_DATAS)
-
+    })
-      this.addFakeDatasOnAccounts()
-    }, TIMEOUT_REFRESH_DATAS)
   }
 
   _timeout = undefined

src/components/DevToolbar.js

@@ -18,6 +18,8 @@ import color from 'color'
 import fs from 'fs'
 import path from 'path'
 
+import staticPath from 'helpers/staticPath'
+
 import Box from 'components/base/Box'
 import Bar from 'components/base/Bar'
 import CopyToClipboard from 'components/base/CopyToClipboard'
@@ -26,7 +28,7 @@ import { ChartWrapper } from 'components/base/Chart'
 import theme from 'styles/theme'
 
 const getLanguages = p => fs.readdirSync(p).filter(f => fs.statSync(path.join(p, f)).isDirectory())
-const languages = getLanguages(path.join(__static, './i18n'))
+const languages = getLanguages(path.join(staticPath, './i18n'))
 
 const mainWindow = remote.BrowserWindow.getAllWindows().find(w => w.name === 'MainWindow')
 

src/helpers/staticPath.js

@@ -0,0 +1 @@
+export default (__DEV__ ? __static : __dirname.replace(/app\.asar$/, 'static'))

src/main/app.js

@@ -13,7 +13,9 @@ let preloadWindow = null
 
 let forceClose = false
 
-const devTools = __DEV__
+const { ELECTRON_WEBPACK_WDS_PORT, DEV_TOOLS, DEV_TOOLS_MODE } = process.env
+
+const devTools = __DEV__ || DEV_TOOLS
 
 const getWindowPosition = (height, width, display = screen.getPrimaryDisplay()) => {
   const { bounds } = display
@@ -35,9 +37,7 @@ const handleCloseWindow = w => e => {
 }
 
 const getDefaultUrl = () =>
-  __DEV__
+  __DEV__ ? `http://localhost:${ELECTRON_WEBPACK_WDS_PORT || ''}` : `file://${__dirname}/index.html`
-    ? `http://localhost:${process.env.ELECTRON_WEBPACK_WDS_PORT || ''}`
-    : `file://${__dirname}/index.html`
 
 const saveWindowSettings = window => {
   window.on(
@@ -101,7 +101,7 @@ function createMainWindow() {
 
   if (devTools) {
     window.webContents.openDevTools({
-      mode: process.env.DEV_TOOLS_MODE,
+      mode: DEV_TOOLS_MODE,
     })
   }
 

src/main/index.js

@@ -1,5 +1,13 @@
 // @flow
 
+const { SENTRY_URL } = process.env
+
+if (__PROD__ && SENTRY_URL) {
+  const Raven = require('raven') // eslint-disable-line global-require
+  const ravenConfig = { captureUnhandledRejections: true }
+  Raven.config(SENTRY_URL, ravenConfig).install()
+}
+
 require('env')
 
 process.setMaxListeners(0)
@@ -8,11 +16,3 @@ require('../globals')
 require('./app')
 
 setImmediate(() => require('./bridge')) // eslint-disable-line global-require
-
-const { SENTRY_URL } = process.env
-
-if (__PROD__ && SENTRY_URL) {
-  const Raven = require('raven') // eslint-disable-line global-require
-  const ravenConfig = { captureUnhandledRejections: true }
-  Raven.config(SENTRY_URL, ravenConfig).install()
-}

src/main/menu.js

@@ -1,5 +1,7 @@
 import { BrowserWindow, app, Menu } from 'electron'
 
+const { DEV_TOOLS, DEV_TOOLS_MODE } = process.env
+
 const props = (predicate, values, defaultValue = {}) => (predicate ? values : defaultValue)
 
 const template = [
@@ -20,13 +22,13 @@ const template = [
     [],
   ),
   ...props(
-    process.platform === 'darwin' || __DEV__,
+    process.platform === 'darwin' || __DEV__ || DEV_TOOLS,
     [
       {
         role: 'window',
         submenu: [
           ...props(
-            __DEV__,
+            __DEV__ || DEV_TOOLS,
             [
               {
                 label: 'App Dev Tools',
@@ -45,7 +47,7 @@ const template = [
                   )
                   if (mainWindow) {
                     mainWindow.openDevTools({
-                      mode: process.env.DEV_TOOLS_MODE,
+                      mode: DEV_TOOLS_MODE,
                     })
                   }
                 },

src/renderer/i18n.js

@@ -4,11 +4,13 @@ import i18n from 'i18next'
 import path from 'path'
 import Backend from 'i18next-node-fs-backend'
 
+import staticPath from 'helpers/staticPath'
+
 i18n.use(Backend).init({
   fallbackLng: 'en',
   debug: false,
   backend: {
-    loadPath: path.join(__static, '/i18n/{{lng}}/{{ns}}.yml'),
+    loadPath: path.join(staticPath, '/i18n/{{lng}}/{{ns}}.yml'),
   },
   react: {
     wait: true,

src/styles/helpers.js

@@ -2,6 +2,8 @@
 
 import Color from 'color'
 
+import staticPath from 'helpers/staticPath'
+
 export const rgba = (c: string, a: number) =>
   Color(c)
     .alpha(a)
@@ -21,7 +23,9 @@ export const fontFace = ({
 }) => `
   @font-face {
     font-family: "${name}";
-    src: url("${__DEV__ ? '' : __static.replace(/\\/g, '/')}/fonts/${file}.woff2") format("woff2");
+    src: url("${
+      __DEV__ ? '' : staticPath.replace(/\\/g, '/')
+    }/fonts/${file}.woff2") format("woff2");
     font-style: ${style};
     font-weight: ${weight};
   }