Merge branch 'master' into getAddressForCurrency

README.md

@@ -9,7 +9,16 @@
 
 #### Requirements
 
-Project has been tested under [NodeJS](https://nodejs.org) v9.3.0, with [Yarn](https://yarnpkg.com) v1.3.0 and [Python](https://www.python.org/) v2.7.10 (used by [node-gyp](https://github.com/nodejs/node-gyp) to build native addons). You will also need a C++ compiler.
+Project has been tested with
+
+- [NodeJS](https://nodejs.org) v9.3.0
+- [Yarn](https://yarnpkg.com) v1.3.0
+- [Python](https://www.python.org/) v2.7.10 (used by [node-gyp](https://github.com/nodejs/node-gyp) to build native addons)
+- You will also need a C++ compiler
+
+#### Optional
+
+- `Museo Sans` font - for Ledger guys, [follow that link](https://drive.google.com/drive/folders/14R6kGFtx53DuqTyIOjnT7BGogzeyMSzN), download `museosans.zip` and extract it inside the `static/fonts/museosans` directory
 
 #### Setup
 

electron-builder.yml

@@ -16,6 +16,7 @@ mac:
 
 linux:
   artifactName: ${name}-${version}-${os}-${arch}.${ext}
+  category: Finance
   target:
     - target: AppImage
       arch:

package.json

@@ -3,7 +3,7 @@
   "productName": "Ledger Live",
   "description": "Ledger Live - Desktop",
   "repository": "https://github.com/LedgerHQ/ledger-live-desktop",
-  "version": "0.1.0",
+  "version": "0.1.0-alpha.1",
   "author": "Ledger",
   "license": "MIT",
   "scripts": {
@@ -16,7 +16,7 @@
     "postinstall": "bash ./scripts/postinstall.sh",
     "prettier": "prettier --write \"{src,webpack,.storybook}/**/*.js\"",
     "publish-storybook": "bash ./scripts/publish-storybook.sh",
-    "release": "build",
+    "release": "yarn compile && build -wml",
     "start": "bash ./scripts/start.sh",
     "storybook": "NODE_ENV=development STORYBOOK_ENV=1 start-storybook -s ./static -p 4444",
     "trans": "node scripts/trans"

src/components/DashboardPage/index.js

@@ -24,6 +24,7 @@ import { getCounterValueCode, localeSelector } from 'reducers/settings'
 import { updateOrderAccounts } from 'actions/accounts'
 import { saveSettings } from 'actions/settings'
 
+import UpdateNotifier from 'components/UpdateNotifier'
 import BalanceInfos from 'components/BalanceSummary/BalanceInfos'
 import BalanceSummary from 'components/BalanceSummary'
 import Box from 'components/base/Box'
@@ -139,6 +140,7 @@ class DashboardPage extends PureComponent<Props, State> {
 
     return (
       <Box flow={7}>
+        <UpdateNotifier mt={-5} />
         <Box horizontal alignItems="flex-end">
           <Box grow>
             <Text color="dark" ff="Museo Sans" fontSize={7}>

src/components/SettingsPage/sections/Display.js

@@ -165,6 +165,7 @@ class TabProfile extends PureComponent<Props, State> {
           <Row title={t('settings:display.region')} desc={t('settings:display.regionDesc')}>
             <Select
               style={{ minWidth: 250 }}
+              small
               onChange={this.handleChangeRegion}
               renderSelected={item => item && item.name}
               value={currentRegion}

src/components/ActivityIndicator.js → src/components/TopBar/ActivityIndicator.js

@@ -3,11 +3,12 @@ import React, { Component } from 'react'
 import { connect } from 'react-redux'
 import styled from 'styled-components'
 import { createStructuredSelector } from 'reselect'
+
 import { globalSyncStateSelector } from 'reducers/bridgeSync'
 import { BridgeSyncConsumer } from 'bridge/BridgeSyncContext'
 import CounterValues from 'helpers/countervalues'
 import IconActivity from 'icons/Activity'
-import Box from './base/Box'
+import ItemContainer from './ItemContainer'
 
 const Activity = styled.div`
   background: ${p =>
@@ -20,7 +21,7 @@ const Activity = styled.div`
   bottom: 20px;
   height: 4px;
   position: absolute;
-  right: -2px;
+  right: 8px;
   width: 4px;
   cursor: pointer;
 `
@@ -31,10 +32,10 @@ class ActivityIndicatorUI extends Component<*> {
   render() {
     const { pending, error, onClick } = this.props
     return (
-      <Box justifyContent="center" relative cursor="pointer" onClick={onClick}>
+      <ItemContainer relative onClick={onClick}>
         <IconActivity size={16} />
         <Activity pending={pending} error={error} />
-      </Box>
+      </ItemContainer>
     )
   }
 }

src/components/TopBar/ItemContainer.js

@@ -0,0 +1,20 @@
+// @flow
+
+import styled from 'styled-components'
+
+import Box from 'components/base/Box'
+
+export default styled(Box).attrs({
+  px: 2,
+  ml: 0,
+  justifyContent: 'center',
+  cursor: p => (p.interactive ? 'pointer' : 'default'),
+})`
+  opacity: 0.7;
+  &:hover {
+    opacity: ${p => (p.interactive ? 0.85 : 0.7)};
+  }
+  &:active {
+    opacity: ${p => (p.interactive ? 1 : 0.7)};
+  }
+`

src/components/TopBar.js → src/components/TopBar/index.js

@@ -10,7 +10,7 @@ import { withRouter } from 'react-router'
 import type { Location, RouterHistory } from 'react-router'
 import type { T } from 'types/common'
 
-import { rgba, darken } from 'styles/helpers'
+import { rgba } from 'styles/helpers'
 import { lock } from 'reducers/application'
 import { hasPassword } from 'reducers/settings'
 
@@ -22,6 +22,7 @@ import Box from 'components/base/Box'
 import GlobalSearch from 'components/GlobalSearch'
 
 import ActivityIndicator from './ActivityIndicator'
+import ItemContainer from './ItemContainer'
 
 const Container = styled(Box).attrs({
   px: 6,
@@ -43,23 +44,13 @@ const Inner = styled(Box).attrs({
 `
 
 const Bar = styled.div`
+  margin-left: 5px;
+  margin-right: 5px;
   height: 15px;
   width: 1px;
   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 mapStateToProps = state => ({
   hasPassword: hasPassword(state),
 })
@@ -93,26 +84,26 @@ class TopBar extends PureComponent<Props> {
     return (
       <Container bg="lightGrey" color="graphite">
         <Inner>
-          <Box grow horizontal flow={4}>
+          <Box grow horizontal>
             <GlobalSearch t={t} isHidden />
-            <Box justifyContent="center">
+            <ItemContainer justifyContent="center">
               <IconDevices size={16} />
-            </Box>
+            </ItemContainer>
             <ActivityIndicator />
             <Box justifyContent="center">
               <Bar />
             </Box>
-            <SettingButtonContainer onClick={this.navigateToSettings}>
+            <ItemContainer interactive onClick={this.navigateToSettings}>
               <IconSettings size={16} />
-            </SettingButtonContainer>
+            </ItemContainer>
             {hasPassword && ( // FIXME this should be a dedicated component. therefore this component don't need to connect()
               <Fragment>
                 <Box justifyContent="center">
                   <Bar />
                 </Box>
-                <Box justifyContent="center" onClick={this.handleLock}>
+                <ItemContainer interactive justifyContent="center" onClick={this.handleLock}>
                   <IconLock size={16} />
-                </Box>
+                </ItemContainer>
               </Fragment>
             )}
           </Box>

src/components/UpdateNotifier.js

@@ -3,7 +3,6 @@
 import React, { PureComponent } from 'react'
 import { translate } from 'react-i18next'
 import { compose } from 'redux'
-import { Motion, spring } from 'react-motion'
 import { connect } from 'react-redux'
 import styled from 'styled-components'
 
@@ -12,6 +11,8 @@ import { sendEvent } from 'renderer/events'
 import type { State } from 'reducers'
 import type { UpdateStatus } from 'reducers/update'
 
+import { radii } from 'styles/theme'
+
 import Box from 'components/base/Box'
 import Text from 'components/base/Text'
 
@@ -28,18 +29,15 @@ const mapStateToProps = (state: State) => ({
 })
 
 const Container = styled(Box).attrs({
-  p: 1,
+  py: 1,
+  px: 3,
   bg: 'wallet',
   color: 'white',
   style: p => ({
     transform: `translate3d(0, ${p.offset}%, 0)`,
   }),
 })`
-  position: absolute;
+  border-radius: ${radii[1]}px;
-  top: 0;
-  left: 0;
-  right: 0;
-  z-index: 10;
 `
 
 class UpdateNotifier extends PureComponent<Props> {
@@ -57,12 +55,14 @@ class UpdateNotifier extends PureComponent<Props> {
         return (
           <Box horizontal flow={2}>
             <Text fontWeight="bold">{t('update:newVersionReady')}</Text>
-            <Text
+            <Box ml="auto">
-              style={{ cursor: 'pointer' }}
+              <Text
-              onClick={() => sendEvent('msg', 'updater:quitAndInstall')}
+                style={{ cursor: 'pointer', textDecoration: 'underline' }}
-            >
+                onClick={() => sendEvent('msg', 'updater.quitAndInstall')}
-              {t('update:relaunch')}
+              >
-            </Text>
+                {t('update:relaunch')}
+              </Text>
+            </Box>
           </Box>
         )
       default:
@@ -71,18 +71,14 @@ class UpdateNotifier extends PureComponent<Props> {
   }
 
   render() {
-    const { updateStatus } = this.props
+    const { updateStatus, ...props } = this.props
 
     const isToggled = updateStatus === 'downloaded'
-    return (
+
-      <Motion
+    if (!isToggled) {
-        style={{
+      return null
-          offset: spring(isToggled ? 0 : -100),
+    }
-        }}
+    return <Container {...props}>{this.renderStatus()}</Container>
-      >
-        {m => <Container offset={m.offset}>{this.renderStatus()}</Container>}
-      </Motion>
-    )
   }
 }
 

src/components/layout/Default.js

@@ -23,7 +23,6 @@ import AppRegionDrag from 'components/AppRegionDrag'
 import IsUnlocked from 'components/IsUnlocked'
 import SideBar from 'components/SideBar'
 import TopBar from 'components/TopBar'
-import UpdateNotifier from 'components/UpdateNotifier'
 
 const Container = styled(GrowScroll).attrs({
   p: 6,
@@ -87,7 +86,6 @@ class Default extends Component<Props> {
 
             <Box shrink grow bg="lightGrey" color="grey" relative>
               <TopBar />
-              <UpdateNotifier />
               <Container innerRef={n => (this._scrollContainer = n)} onScroll={this.handleScroll}>
                 <Route path="/" exact component={DashboardPage} />
                 <Route path="/settings" component={SettingsPage} />

src/main/autoUpdate.js

@@ -1,5 +1,6 @@
 // @flow
 
+import { app, BrowserWindow } from 'electron'
 import { autoUpdater } from 'electron-updater'
 
 type SendFunction = (type: string, data: *) => void
@@ -16,5 +17,16 @@ export default (notify: SendFunction) => {
 }
 
 export function quitAndInstall() {
-  autoUpdater.quitAndInstall()
+  setImmediate(() => {
+    const browserWindows = BrowserWindow.getAllWindows()
+
+    // Fixes quitAndInstall not quitting on macOS, as suggested on
+    // https://github.com/electron-userland/electron-builder/issues/1604#issuecomment-306709572
+    app.removeAllListeners('window-all-closed')
+    browserWindows.forEach(browserWindow => {
+      browserWindow.removeAllListeners('close')
+    })
+
+    autoUpdater.quitAndInstall(false)
+  })
 }