Add market indicators settings

package.json

@@ -59,7 +59,7 @@
     "cross-env": "^5.1.4",
     "d3": "^5.1.0",
     "debug": "^3.1.0",
-    "downshift": "^1.31.7",
+    "downshift": "^1.31.9",
     "electron-store": "^1.3.0",
     "electron-updater": "^2.21.8",
     "fuse.js": "^3.2.0",
@@ -73,7 +73,7 @@
     "qrcode": "^1.2.0",
     "qs": "^6.5.1",
     "raven": "^2.5.0",
-    "raven-js": "^3.24.1",
+    "raven-js": "^3.24.2",
     "react": "^16.3.2",
     "react-dom": "^16.3.2",
     "react-flip-ticker": "^0.3.0",
@@ -86,7 +86,7 @@
     "react-router-dom": "^4.2.2",
     "react-router-redux": "5.0.0-alpha.9",
     "react-smooth-scrollbar": "^8.0.6",
-    "redux": "^3.7.2",
+    "redux": "^4.0.0",
     "redux-actions": "^2.3.0",
     "redux-thunk": "^2.2.0",
     "smooth-scrollbar": "^8.2.7",
@@ -143,7 +143,7 @@
     "lint-staged": "^7.0.4",
     "node-loader": "^0.6.0",
     "prettier": "^1.12.1",
-    "react-hot-loader": "^4.0.1",
+    "react-hot-loader": "^4.1.0",
     "react-test-renderer": "^16.3.2",
     "webpack": "^4.6.0",
     "webpack-bundle-analyzer": "^2.11.1",

src/components/BalanceSummary/BalanceInfos.js

@@ -40,6 +40,7 @@ export function BalanceSincePercent(props: BalanceSinceProps) {
   return (
     <Box {...otherProps}>
       <FormattedVal
+        color="dark"
         animateTicker
         fontSize={7}
         isPercent
@@ -56,6 +57,7 @@ export function BalanceSinceDiff(props: Props) {
   return (
     <Box {...otherProps}>
       <FormattedVal
+        color="dark"
         animateTicker
         fiat={counterValue}
         fontSize={7}

src/components/OperationsList/ConfirmationCheck.js

@@ -16,18 +16,14 @@ import Tooltip from 'components/base/Tooltip'
 
 const Container = styled(Box).attrs({
   bg: p =>
-    p.isConfirmed
-      ? rgba(p.type === 'from' ? p.theme.colors.positiveGreen : p.theme.colors.grey, 0.2)
-      : 'none',
-  color: p => (p.type === 'from' ? p.theme.colors.positiveGreen : p.theme.colors.grey),
+    p.isConfirmed ? rgba(p.type === 'from' ? p.marketColor : p.theme.colors.grey, 0.2) : 'none',
+  color: p => (p.type === 'from' ? p.marketColor : p.theme.colors.grey),
   align: 'center',
   justify: 'center',
 })`
   border: ${p =>
     !p.isConfirmed
-      ? `1px solid ${
-          p.type === 'from' ? p.theme.colors.positiveGreen : rgba(p.theme.colors.grey, 0.2)
-        }`
+      ? `1px solid ${p.type === 'from' ? p.marketColor : rgba(p.theme.colors.grey, 0.2)}`
       : 0};
   border-radius: 50%;
   position: relative;
@@ -47,6 +43,7 @@ const WrapperClock = styled(Box).attrs({
 `
 
 const ConfirmationCheck = ({
+  marketColor,
   confirmations,
   minConfirmations,
   t,
@@ -54,6 +51,7 @@ const ConfirmationCheck = ({
   withTooltip,
   ...props
 }: {
+  marketColor: string,
   confirmations: number,
   minConfirmations: number,
   t: T,
@@ -63,7 +61,7 @@ const ConfirmationCheck = ({
   const isConfirmed = confirmations >= minConfirmations
 
   const renderContent = () => (
-    <Container type={type} isConfirmed={isConfirmed} {...props}>
+    <Container type={type} isConfirmed={isConfirmed} marketColor={marketColor} {...props}>
       {type === 'from' ? <IconReceive size={12} /> : <IconSend size={12} />}
       {!isConfirmed && (
         <WrapperClock>

src/components/OperationsList/index.js

@@ -16,9 +16,9 @@ import type { Account, Operation as OperationType } from '@ledgerhq/wallet-commo
 import noop from 'lodash/noop'
 import keyBy from 'lodash/keyBy'
 
-import { rgba } from 'styles/helpers'
+import { getMarketColor, rgba } from 'styles/helpers'
 
-import type { T } from 'types/common'
+import type { Settings, T } from 'types/common'
 
 import { MODAL_OPERATION_DETAILS } from 'config/constants'
 
@@ -135,6 +135,7 @@ const Operation = ({
   t,
   op,
   withAccount,
+  marketIndicator,
 }: {
   account: Account,
   minConfirmations: number,
@@ -143,20 +144,28 @@ const Operation = ({
   t: T,
   op: OperationType,
   withAccount?: boolean,
+  marketIndicator: string,
 }) => {
   const { unit, currency } = account
   const time = moment(op.date)
   const Icon = getIconByCoinType(account.currency.coinType)
-  const type = op.amount > 0 ? 'from' : 'to'
+  const isNegative = op.amount < 0
+  const type = !isNegative ? 'from' : 'to'
+
+  const marketColor = getMarketColor({
+    marketIndicator,
+    isNegative,
+  })
 
   return (
-    <OperationRaw onClick={() => onOperationClick({ operation: op, account, type })}>
+    <OperationRaw onClick={() => onOperationClick({ operation: op, account, type, marketColor })}>
       <Cell size={CONFIRMATION_COL_SIZE} align="center" justify="flex-start">
         <ConfirmationCheck
-          type={type}
-          minConfirmations={minConfirmations}
           confirmations={op.confirmations}
+          marketColor={marketColor}
+          minConfirmations={minConfirmations}
           t={t}
+          type={type}
         />
       </Cell>
       <Cell size={DATE_COL_SIZE} justifyContent="space-between" px={3}>
@@ -203,7 +212,7 @@ const Operation = ({
             showCode
             fontSize={4}
             alwaysShowSign
-            color={op.amount < 0 ? 'smoke' : 'positiveGreen'}
+            color={op.amount < 0 ? 'smoke' : undefined}
           />
           <CounterValue
             color="grey"
@@ -224,6 +233,10 @@ Operation.defaultProps = {
   withAccount: false,
 }
 
+const mapStateToProps = state => ({
+  settings: state.settings,
+})
+
 const mapDispatchToProps = {
   openModal,
 }
@@ -238,6 +251,7 @@ type Props = {
   withAccount?: boolean,
   nbToShow: number,
   title?: string,
+  settings: Settings,
 }
 
 export class OperationsList extends PureComponent<Props> {
@@ -253,13 +267,14 @@ export class OperationsList extends PureComponent<Props> {
   render() {
     const {
       account,
-      title,
       accounts,
       canShowMore,
+      nbToShow,
       onAccountClick,
+      settings,
       t,
+      title,
       withAccount,
-      nbToShow,
     } = this.props
 
     if (!account && !accounts) {
@@ -295,13 +310,14 @@ export class OperationsList extends PureComponent<Props> {
                     }
                     return (
                       <Operation
-                        key={`${account.id}-${op.hash}`}
                         account={account}
+                        key={`${account.id}-${op.hash}`}
+                        marketIndicator={settings.marketIndicator}
                         minConfirmations={account.minConfirmations}
                         onAccountClick={onAccountClick}
                         onOperationClick={this.handleClickOperation}
-                        t={t}
                         op={op}
+                        t={t}
                         withAccount={withAccount}
                       />
                     )
@@ -322,4 +338,4 @@ export class OperationsList extends PureComponent<Props> {
   }
 }
 
-export default compose(translate(), connect(null, mapDispatchToProps))(OperationsList)
+export default compose(translate(), connect(mapStateToProps, mapDispatchToProps))(OperationsList)

src/components/SettingsPage/sections/Display.js

@@ -7,6 +7,8 @@ import { listFiats } from '@ledgerhq/currencies'
 import type { Settings, T } from 'types/common'
 
 import Select from 'components/base/Select'
+import RadioGroup from 'components/base/RadioGroup'
+
 import IconDisplay from 'icons/Display'
 
 import {
@@ -30,12 +32,14 @@ type Props = {
 }
 
 type State = {
+  cachedMarketIndicator: string,
   cachedLanguageKey: string,
   cachedCounterValue: ?Object,
 }
 
 class TabProfile extends PureComponent<Props, State> {
   state = {
+    cachedMarketIndicator: this.props.settings.marketIndicator,
     cachedLanguageKey: this.props.settings.language,
     cachedCounterValue: fiats.find(fiat => fiat.fiat.code === this.props.settings.counterValue),
   }
@@ -47,6 +51,20 @@ class TabProfile extends PureComponent<Props, State> {
     }
   }
 
+  getMarketIndicators() {
+    const { t } = this.props
+    return [
+      {
+        label: t('common:eastern'),
+        key: 'eastern',
+      },
+      {
+        label: t('common:western'),
+        key: 'western',
+      },
+    ]
+  }
+
   handleChangeCounterValue = (item: Object) => {
     const { saveSettings } = this.props
     this.setState({ cachedCounterValue: item.fiat })
@@ -65,9 +83,20 @@ class TabProfile extends PureComponent<Props, State> {
     })
   }
 
+  handleChangeMarketIndicator = (item: Object) => {
+    const { saveSettings } = this.props
+    const marketIndicator = item.key
+    this.setState({
+      cachedMarketIndicator: marketIndicator,
+    })
+    window.requestIdleCallback(() => {
+      saveSettings({ marketIndicator })
+    })
+  }
+
   render() {
     const { t } = this.props
-    const { cachedLanguageKey, cachedCounterValue } = this.state
+    const { cachedMarketIndicator, cachedLanguageKey, cachedCounterValue } = this.state
     const { languages } = this.getDatas()
     const currentLanguage = languages.find(l => l.key === cachedLanguageKey)
 
@@ -109,7 +138,11 @@ class TabProfile extends PureComponent<Props, State> {
             {'-'}
           </Row>
           <Row title={t('settings:display.stock')} desc={t('settings:display.stockDesc')}>
-            {'-'}
+            <RadioGroup
+              items={this.getMarketIndicators()}
+              activeKey={cachedMarketIndicator}
+              onChange={this.handleChangeMarketIndicator}
+            />
           </Row>
         </Body>
       </Section>

src/components/base/FormattedVal/index.js

@@ -2,14 +2,18 @@
 
 import React from 'react'
 import styled from 'styled-components'
+import { connect } from 'react-redux'
 import Ticker from 'react-flip-ticker'
 
 import isUndefined from 'lodash/isUndefined'
 
+import type { Settings } from 'types/common'
 import type { Unit } from '@ledgerhq/currencies'
 
 import { formatCurrencyUnit, getFiatUnit } from '@ledgerhq/currencies'
 
+import { getMarketColor } from 'styles/helpers'
+
 import Box from 'components/base/Box'
 
 import IconBottom from 'icons/Bottom'
@@ -18,12 +22,7 @@ import IconTop from 'icons/Top'
 const T = styled(Box).attrs({
   ff: 'Rubik',
   horizontal: true,
-  color: p =>
-    p.withIcon
-      ? p.theme.colors.dark
-      : p.isNegative
-        ? p.theme.colors.alertRed
-        : p.theme.colors.positiveGreen,
+  color: p => (p.withIcon ? p.theme.colors.dark : p.color),
 })`
   line-height: 1.2;
   white-space: pre;
@@ -33,12 +32,18 @@ const I = ({ color, children }: { color: string, children: any }) => (
   <Box color={color}>{children}</Box>
 )
 
+const mapStateToProps = state => ({
+  settings: state.settings,
+})
+
 type Props = {
   alwaysShowSign?: boolean,
   animateTicker?: boolean,
+  color?: string,
   disableRounding?: boolean,
   fiat?: string | null,
   isPercent?: boolean,
+  settings: Settings,
   showCode?: boolean,
   unit?: Unit | null,
   val: number,
@@ -54,6 +59,8 @@ function FormattedVal(props: Props) {
     alwaysShowSign,
     showCode,
     withIcon,
+    settings,
+    color,
     ...p
   } = props
   let { val, unit } = props
@@ -90,17 +97,22 @@ function FormattedVal(props: Props) {
     text = <Ticker text={text} />
   }
 
+  const marketColor = getMarketColor({
+    marketIndicator: settings.marketIndicator,
+    isNegative,
+  })
+
   return (
-    <T isNegative={isNegative} withIcon={withIcon} {...p}>
+    <T color={color || marketColor} withIcon={withIcon} {...p}>
       {withIcon ? (
         <Box horizontal alignItems="center" flow={1}>
           <Box>
             {isNegative ? (
-              <I color="alertRed">
+              <I color={marketColor}>
                 <IconBottom size={16} />
               </I>
             ) : (
-              <I color="positiveGreen">
+              <I color={marketColor}>
                 <IconTop size={16} />
               </I>
             )}
@@ -119,6 +131,7 @@ function FormattedVal(props: Props) {
 FormattedVal.defaultProps = {
   alwaysShowSign: false,
   animateTicker: false,
+  color: undefined,
   disableRounding: false,
   fiat: null,
   isPercent: false,
@@ -127,4 +140,4 @@ FormattedVal.defaultProps = {
   withIcon: false,
 }
 
-export default FormattedVal
+export default connect(mapStateToProps)(FormattedVal)

src/components/base/RadioGroup/index.js

@@ -0,0 +1,69 @@
+// @flow
+
+import React from 'react'
+import styled from 'styled-components'
+
+import Box from 'components/base/Box'
+
+const Container = styled(Box).attrs({
+  horizontal: true,
+})`
+  height: 34px;
+
+  > * + * {
+    border-left: 0 !important;
+  }
+
+  *:first-child {
+    border-top-left-radius: ${p => p.theme.radii[1]}px;
+    border-bottom-left-radius: ${p => p.theme.radii[1]}px;
+  }
+
+  *:last-child {
+    border-top-right-radius: ${p => p.theme.radii[1]}px;
+    border-bottom-right-radius: ${p => p.theme.radii[1]}px;
+  }
+`
+
+const Btn = styled(Box).attrs({
+  color: p => (p.isActive ? 'white' : 'grey'),
+  bg: p => (p.isActive ? 'wallet' : 'white'),
+  alignItems: 'center',
+  justifyContent: 'center',
+  fontSize: 3,
+  ff: 'Open Sans|SemiBold',
+  px: 3,
+})`
+  cursor: pointer;
+  border: solid 1px ${p => (p.isActive ? p.theme.colors.wallet : p.theme.colors.fog)};
+  margin-left: ${p => (p.isActive ? -1 : 0)}px;
+`
+
+type Item = {
+  label: string,
+  key: string,
+}
+
+type Props = {
+  items: Array<Item>,
+  activeKey: string,
+  onChange: Item => void,
+}
+
+function RadioGroup(props: Props) {
+  const { items, activeKey, onChange, ...p } = props
+  return (
+    <Container {...p}>
+      {items.map(item => {
+        const isActive = item.key === activeKey
+        return (
+          <Btn key={item.key} onClick={() => onChange(item)} isActive={isActive}>
+            {item.label}
+          </Btn>
+        )
+      })}
+    </Container>
+  )
+}
+
+export default RadioGroup

src/components/base/RadioGroup/stories.js

@@ -0,0 +1,38 @@
+// @flow
+
+import React from 'react'
+
+import { storiesOf } from '@storybook/react'
+import { action } from '@storybook/addon-actions'
+import { text } from '@storybook/addon-knobs'
+
+import RadioGroup from 'components/base/RadioGroup'
+
+const stories = storiesOf('Components/base', module)
+
+const items = [
+  {
+    label: 'Btn 1',
+    key: 'btn-1',
+  },
+  {
+    label: 'Btn 2',
+    key: 'btn-2',
+  },
+  {
+    label: 'Btn 3',
+    key: 'btn-3',
+  },
+  {
+    label: 'Btn 4',
+    key: 'btn-4',
+  },
+  {
+    label: 'Btn 5',
+    key: 'btn-5',
+  },
+]
+
+stories.add('RadioGroup', () => (
+  <RadioGroup items={items} activeKey={text('activeKey', 'btn-1')} onChange={action('onChange')} />
+))

src/components/modals/OperationDetails.js

@@ -52,7 +52,7 @@ const OperationDetails = ({ t }: { t: T }) => (
   <Modal
     name={MODAL_OPERATION_DETAILS}
     render={({ data, onClose }) => {
-      const { operation, account, type } = data
+      const { marketColor, operation, account, type } = data
 
       const { name, unit, currency, minConfirmations } = account
       const { id, amount, confirmations, date, from, to } = operation
@@ -65,6 +65,7 @@ const OperationDetails = ({ t }: { t: T }) => (
           <ModalContent flow={4}>
             <Box alignItems="center" mt={3}>
               <ConfirmationCheck
+                marketColor={marketColor}
                 confirmations={confirmations}
                 minConfirmations={minConfirmations}
                 style={{

src/reducers/settings.js

@@ -19,6 +19,7 @@ const defaultState: SettingsState = {
     value: '',
   },
   currencies: [],
+  marketIndicator: 'eastern',
 }
 
 const state: SettingsState = {

src/styles/helpers.js

@@ -3,7 +3,7 @@
 import Color from 'color'
 
 import staticPath from 'helpers/staticPath'
-import { fontFamilies } from 'styles/theme'
+import { colors, fontFamilies } from 'styles/theme'
 
 export const rgba = (c: string, a: number) =>
   Color(c)
@@ -52,3 +52,17 @@ export const fontFace = ({
     font-weight: ${weight};
   }
 `
+
+export function getMarketColor({
+  marketIndicator,
+  isNegative,
+}: {
+  marketIndicator: string,
+  isNegative: boolean,
+}) {
+  if (isNegative) {
+    return colors[`marketDown_${marketIndicator}`]
+  }
+
+  return colors[`marketUp_${marketIndicator}`]
+}

src/styles/theme.js

@@ -80,6 +80,12 @@ export const colors = {
   smoke: '#666666',
   wallet: '#6490f1',
   white: '#ffffff',
+
+  // market indicator
+  marketUp_eastern: '#66be54',
+  marketUp_western: '#ea2e49',
+  marketDown_eastern: '#ea2e49',
+  marketDown_western: '#6490f1',
 }
 
 export default {

src/types/common.js

@@ -35,6 +35,7 @@ export type Settings = {
     value: string,
   },
   currencies: CurrencySettings[],
+  marketIndicator: 'eastern' | 'western',
 }
 
 export type T = (?string, ?Object) => string

static/i18n/en/common.yml

@@ -16,3 +16,5 @@ next: Next
 back: Back
 retry: Retry
 close: Close
+eastern: Eastern
+western: Western

yarn.lock

@@ -1419,57 +1419,37 @@ anymatch@^2.0.0:
     micromatch "^3.1.4"
     normalize-path "^2.1.1"
 
-app-builder-bin-linux@1.7.2:
-  version "1.7.2"
-  resolved "https://registry.yarnpkg.com/app-builder-bin-linux/-/app-builder-bin-linux-1.7.2.tgz#a764c8e52ecf1b5b068f32c820c6daf1ffed6a8f"
-
-app-builder-bin-linux@1.8.3:
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/app-builder-bin-linux/-/app-builder-bin-linux-1.8.3.tgz#4bf638a7bd29365e5534d2ba554baf1350fb4a87"
+app-builder-bin-linux@1.8.4:
+  version "1.8.4"
+  resolved "https://registry.yarnpkg.com/app-builder-bin-linux/-/app-builder-bin-linux-1.8.4.tgz#9fa4f4f6af21f147cdedc69279940134c77d297f"
 
 app-builder-bin-linux@1.8.5:
   version "1.8.5"
   resolved "https://registry.yarnpkg.com/app-builder-bin-linux/-/app-builder-bin-linux-1.8.5.tgz#bf001d3ef347e1179680a1760fea83d0832fc344"
 
-app-builder-bin-mac@1.7.2:
-  version "1.7.2"
-  resolved "https://registry.yarnpkg.com/app-builder-bin-mac/-/app-builder-bin-mac-1.7.2.tgz#c4ee0d950666c97c12a45ac74ec6396be3357644"
-
-app-builder-bin-mac@1.8.3:
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/app-builder-bin-mac/-/app-builder-bin-mac-1.8.3.tgz#8e2c63e9d822fce2eee8db2f9f817d7b68532df7"
+app-builder-bin-mac@1.8.4:
+  version "1.8.4"
+  resolved "https://registry.yarnpkg.com/app-builder-bin-mac/-/app-builder-bin-mac-1.8.4.tgz#abd35353167b037a15353fe44c84b0b17045d12f"
 
 app-builder-bin-mac@1.8.5:
   version "1.8.5"
   resolved "https://registry.yarnpkg.com/app-builder-bin-mac/-/app-builder-bin-mac-1.8.5.tgz#31282504d232081a9de94d377736bf904bbfbd53"
 
-app-builder-bin-win@1.7.2:
-  version "1.7.2"
-  resolved "https://registry.yarnpkg.com/app-builder-bin-win/-/app-builder-bin-win-1.7.2.tgz#7acac890782f4118f09941b343ba06c56452a6f6"
-
-app-builder-bin-win@1.8.3:
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/app-builder-bin-win/-/app-builder-bin-win-1.8.3.tgz#3598ec1c523dd197e8bb5dfeab3e2fe70905ae79"
+app-builder-bin-win@1.8.4:
+  version "1.8.4"
+  resolved "https://registry.yarnpkg.com/app-builder-bin-win/-/app-builder-bin-win-1.8.4.tgz#ba5f7a7d8ae48d32c400691b3c45f6f746c27748"
 
 app-builder-bin-win@1.8.5:
   version "1.8.5"
   resolved "https://registry.yarnpkg.com/app-builder-bin-win/-/app-builder-bin-win-1.8.5.tgz#d7eefc1dff6052e137a3c5d68cd6e68ba862054b"
 
-app-builder-bin@1.7.2:
-  version "1.7.2"
-  resolved "https://registry.yarnpkg.com/app-builder-bin/-/app-builder-bin-1.7.2.tgz#daf67060a6bad8f5f611a0d2876d9db897a83f06"
-  optionalDependencies:
-    app-builder-bin-linux "1.7.2"
-    app-builder-bin-mac "1.7.2"
-    app-builder-bin-win "1.7.2"
-
-app-builder-bin@1.8.3:
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/app-builder-bin/-/app-builder-bin-1.8.3.tgz#902174b5864521e5068fe1d8ae5566633a5b9c44"
+app-builder-bin@1.8.4:
+  version "1.8.4"
+  resolved "https://registry.yarnpkg.com/app-builder-bin/-/app-builder-bin-1.8.4.tgz#ca8fd02209c2e0681de97fdb4c559d93381cc812"
   optionalDependencies:
-    app-builder-bin-linux "1.8.3"
-    app-builder-bin-mac "1.8.3"
-    app-builder-bin-win "1.8.3"
+    app-builder-bin-linux "1.8.4"
+    app-builder-bin-mac "1.8.4"
+    app-builder-bin-win "1.8.4"
 
 app-builder-bin@1.8.5:
   version "1.8.5"
@@ -3142,16 +3122,7 @@ buffers@~0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/buffers/-/buffers-0.1.1.tgz#b24579c3bed4d6d396aeee6d9a8ae7f5482ab7bb"
 
-builder-util-runtime@4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/builder-util-runtime/-/builder-util-runtime-4.1.0.tgz#7dcd042d555d2f161a5538d7a0ea8c292daa0683"
-  dependencies:
-    bluebird-lst "^1.0.5"
-    debug "^3.1.0"
-    fs-extra-p "^4.5.2"
-    sax "^1.2.4"
-
-builder-util-runtime@4.2.0, builder-util-runtime@^4.1.0, builder-util-runtime@^4.2.0, builder-util-runtime@~4.2.0:
+builder-util-runtime@4.2.0, builder-util-runtime@^4.2.0, builder-util-runtime@~4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/builder-util-runtime/-/builder-util-runtime-4.2.0.tgz#c56aa18d34390143da031c418c9d3a055fbd3522"
   dependencies:
@@ -3160,31 +3131,12 @@ builder-util-runtime@4.2.0, builder-util-runtime@^4.1.0, builder-util-runtime@^4
     fs-extra-p "^4.5.2"
     sax "^1.2.4"
 
-builder-util@5.6.7:
-  version "5.6.7"
-  resolved "https://registry.yarnpkg.com/builder-util/-/builder-util-5.6.7.tgz#662ff2ba4f70416ee0c085126f16af48fbf97900"
-  dependencies:
-    "7zip-bin" "~3.1.0"
-    app-builder-bin "1.7.2"
-    bluebird-lst "^1.0.5"
-    builder-util-runtime "^4.1.0"
-    chalk "^2.3.2"
-    debug "^3.1.0"
-    fs-extra-p "^4.5.2"
-    is-ci "^1.1.0"
-    js-yaml "^3.11.0"
-    lazy-val "^1.0.3"
-    semver "^5.5.0"
-    source-map-support "^0.5.4"
-    stat-mode "^0.2.2"
-    temp-file "^3.1.1"
-
-builder-util@5.7.4, builder-util@^5.6.7, builder-util@^5.7.0, builder-util@^5.7.4:
-  version "5.7.4"
-  resolved "https://registry.yarnpkg.com/builder-util/-/builder-util-5.7.4.tgz#d6e9a56e2865f0d0a504a07ea0f8dc35185b4795"
+builder-util@5.7.5:
+  version "5.7.5"
+  resolved "https://registry.yarnpkg.com/builder-util/-/builder-util-5.7.5.tgz#58f8d2b7a35445c5fb45bff50b39bbed554c9863"
   dependencies:
     "7zip-bin" "~3.1.0"
-    app-builder-bin "1.8.3"
+    app-builder-bin "1.8.4"
     bluebird-lst "^1.0.5"
     builder-util-runtime "^4.2.0"
     chalk "^2.3.2"
@@ -3198,7 +3150,7 @@ builder-util@5.7.4, builder-util@^5.6.7, builder-util@^5.7.0, builder-util@^5.7.
     stat-mode "^0.2.2"
     temp-file "^3.1.1"
 
-builder-util@5.7.6, builder-util@^5.7.6:
+builder-util@5.7.6, builder-util@^5.7.4, builder-util@^5.7.5, builder-util@^5.7.6:
   version "5.7.6"
   resolved "https://registry.yarnpkg.com/builder-util/-/builder-util-5.7.6.tgz#2480c8a233ab7ab05a4f1689892cc39819e768bb"
   dependencies:
@@ -4613,13 +4565,13 @@ dijkstrajs@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/dijkstrajs/-/dijkstrajs-1.0.1.tgz#d3cd81221e3ea40742cfcde556d4e99e98ddc71b"
 
-dmg-builder@4.1.3:
-  version "4.1.3"
-  resolved "https://registry.yarnpkg.com/dmg-builder/-/dmg-builder-4.1.3.tgz#d336cf398fd331b2dedd7efae4b51b9bfe00aa1c"
+dmg-builder@4.1.4:
+  version "4.1.4"
+  resolved "https://registry.yarnpkg.com/dmg-builder/-/dmg-builder-4.1.4.tgz#bca05298febebca81eb5a4686c222d1ef72b3542"
   dependencies:
     bluebird-lst "^1.0.5"
-    builder-util "^5.7.0"
-    electron-builder-lib "~20.6.2"
+    builder-util "^5.7.5"
+    electron-builder-lib "~20.8.2"
     fs-extra-p "^4.5.2"
     iconv-lite "^0.4.19"
     js-yaml "^3.11.0"
@@ -4760,9 +4712,9 @@ dotenv@^5.0.0, dotenv@^5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-5.0.1.tgz#a5317459bd3d79ab88cff6e44057a6a3fbb1fcef"
 
-downshift@^1.31.7:
-  version "1.31.7"
-  resolved "https://registry.yarnpkg.com/downshift/-/downshift-1.31.7.tgz#65cad48fa6e4add9d6fd82cc9b9b5120e74d4604"
+downshift@^1.31.9:
+  version "1.31.9"
+  resolved "https://registry.yarnpkg.com/downshift/-/downshift-1.31.9.tgz#62da73fd65c7354ecfb9a580ef5f0ed22aabc368"
 
 duplexer2@~0.1.4:
   version "0.1.4"
@@ -4816,15 +4768,15 @@ ejs@^2.5.7:
   version "2.5.7"
   resolved "https://registry.yarnpkg.com/ejs/-/ejs-2.5.7.tgz#cc872c168880ae3c7189762fd5ffc00896c9518a"
 
-electron-builder-lib@20.8.1:
-  version "20.8.1"
-  resolved "https://registry.yarnpkg.com/electron-builder-lib/-/electron-builder-lib-20.8.1.tgz#633167c55f183951b031b59261a923968c098073"
+electron-builder-lib@20.8.2, electron-builder-lib@~20.8.2:
+  version "20.8.2"
+  resolved "https://registry.yarnpkg.com/electron-builder-lib/-/electron-builder-lib-20.8.2.tgz#c080cc9bf04cb3a55771b36a958680d59cfffbe5"
   dependencies:
     "7zip-bin" "~3.1.0"
-    app-builder-bin "1.8.3"
+    app-builder-bin "1.8.4"
     async-exit-hook "^2.0.1"
     bluebird-lst "^1.0.5"
-    builder-util "5.7.4"
+    builder-util "5.7.5"
     builder-util-runtime "4.2.0"
     chromium-pickle-js "^0.2.0"
     debug "^3.1.0"
@@ -4874,45 +4826,16 @@ electron-builder-lib@20.9.0, electron-builder-lib@~20.9.0:
     semver "^5.5.0"
     temp-file "^3.1.1"
 
-electron-builder-lib@~20.6.2:
-  version "20.6.2"
-  resolved "https://registry.yarnpkg.com/electron-builder-lib/-/electron-builder-lib-20.6.2.tgz#34f38b6172c05f90d34b6b5ed2f2b6922e731a39"
-  dependencies:
-    "7zip-bin" "~3.1.0"
-    app-builder-bin "1.7.2"
-    async-exit-hook "^2.0.1"
-    bluebird-lst "^1.0.5"
-    builder-util "5.6.7"
-    builder-util-runtime "4.1.0"
-    chromium-pickle-js "^0.2.0"
-    debug "^3.1.0"
-    ejs "^2.5.7"
-    electron-osx-sign "0.4.10"
-    electron-publish "20.6.1"
-    fs-extra-p "^4.5.2"
-    hosted-git-info "^2.6.0"
-    is-ci "^1.1.0"
-    isbinaryfile "^3.0.2"
-    js-yaml "^3.11.0"
-    lazy-val "^1.0.3"
-    minimatch "^3.0.4"
-    normalize-package-data "^2.4.0"
-    plist "^2.1.0"
-    read-config-file "3.0.0"
-    sanitize-filename "^1.6.1"
-    semver "^5.5.0"
-    temp-file "^3.1.1"
-
 electron-builder@^20.0.4:
-  version "20.8.1"
-  resolved "https://registry.yarnpkg.com/electron-builder/-/electron-builder-20.8.1.tgz#3d19607a7f7d3ee7f3e110a6fc66c720ed1d2cc0"
+  version "20.8.2"
+  resolved "https://registry.yarnpkg.com/electron-builder/-/electron-builder-20.8.2.tgz#0b5d0596997023329a7dddcebe167c5f773818cc"
   dependencies:
     bluebird-lst "^1.0.5"
-    builder-util "5.7.4"
+    builder-util "5.7.5"
     builder-util-runtime "4.2.0"
     chalk "^2.3.2"
-    dmg-builder "4.1.3"
-    electron-builder-lib "20.8.1"
+    dmg-builder "4.1.4"
+    electron-builder-lib "20.8.2"
     electron-download-tf "4.3.4"
     fs-extra-p "^4.5.2"
     is-ci "^1.1.0"
@@ -4993,18 +4916,6 @@ electron-osx-sign@0.4.10:
     minimist "^1.2.0"
     plist "^2.1.0"
 
-electron-publish@20.6.1:
-  version "20.6.1"
-  resolved "https://registry.yarnpkg.com/electron-publish/-/electron-publish-20.6.1.tgz#1bc8497fc9370f8e39c9212ce0b5857ef1d666fd"
-  dependencies:
-    bluebird-lst "^1.0.5"
-    builder-util "^5.6.7"
-    builder-util-runtime "^4.1.0"
-    chalk "^2.3.2"
-    fs-extra-p "^4.5.2"
-    lazy-val "^1.0.3"
-    mime "^2.2.0"
-
 electron-publish@20.8.1:
   version "20.8.1"
   resolved "https://registry.yarnpkg.com/electron-publish/-/electron-publish-20.8.1.tgz#ec5730efbda88c6566a47395d433d7b122782675"
@@ -6868,11 +6779,11 @@ i18next@^11.2.2:
   version "11.2.2"
   resolved "https://registry.yarnpkg.com/i18next/-/i18next-11.2.2.tgz#88b88bda08789841faa9c32b5266be63777be0cd"
 
-iconv-lite@0.4, iconv-lite@0.4.19, iconv-lite@^0.4.17, iconv-lite@^0.4.19, iconv-lite@~0.4.13:
+iconv-lite@0.4, iconv-lite@0.4.19, iconv-lite@^0.4.17, iconv-lite@~0.4.13:
   version "0.4.19"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.19.tgz#f7468f60135f5e5dad3399c0a81be9a1603a082b"
 
-iconv-lite@^0.4.21:
+iconv-lite@^0.4.19, iconv-lite@^0.4.21:
   version "0.4.21"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.21.tgz#c47f8733d02171189ebc4a400f3218d348094798"
   dependencies:
@@ -8139,6 +8050,9 @@ ledger-test-library@KhalilBellakrid/ledger-test-library-nodejs#7d37482:
   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"
 
@@ -8641,11 +8555,11 @@ mime@^1.2.11, mime@^1.4.1, mime@^1.5.0:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1"
 
-mime@^2.0.3, mime@^2.1.0, mime@^2.2.0:
+mime@^2.0.3, mime@^2.1.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/mime/-/mime-2.2.0.tgz#161e541965551d3b549fa1114391e3a3d55b923b"
 
-mime@^2.3.1:
+mime@^2.2.0, mime@^2.3.1:
   version "2.3.1"
   resolved "https://registry.yarnpkg.com/mime/-/mime-2.3.1.tgz#b1621c54d63b97c47d3cfe7f7215f7d64517c369"
 
@@ -10176,9 +10090,9 @@ range-parser@^1.0.3, range-parser@~1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e"
 
-raven-js@^3.24.1:
-  version "3.24.1"
-  resolved "https://registry.yarnpkg.com/raven-js/-/raven-js-3.24.1.tgz#7327e08786248517eedd36205bf50f1047821ffa"
+raven-js@^3.24.2:
+  version "3.24.2"
+  resolved "https://registry.yarnpkg.com/raven-js/-/raven-js-3.24.2.tgz#c5cacb363b198812e80cd4c6714e5e478549ebcf"
 
 raven@^2.5.0:
   version "2.5.0"
@@ -10290,14 +10204,15 @@ react-fuzzy@^0.5.2:
     fuse.js "^3.0.1"
     prop-types "^15.5.9"
 
-react-hot-loader@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/react-hot-loader/-/react-hot-loader-4.0.1.tgz#48284350ae5d7ba07dac872bd5bbc6e477352593"
+react-hot-loader@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/react-hot-loader/-/react-hot-loader-4.1.0.tgz#ae47224af27981c02d4b8c61d498e89d6d207096"
   dependencies:
     fast-levenshtein "^2.0.6"
     global "^4.3.0"
     hoist-non-react-statics "^2.5.0"
     prop-types "^15.6.1"
+    react-lifecycles-compat "^2.0.0"
     shallowequal "^1.0.2"
 
 react-html-attributes@^1.3.0:
@@ -10339,6 +10254,10 @@ react-is@^16.3.2:
   version "16.3.2"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.3.2.tgz#f4d3d0e2f5fbb6ac46450641eb2e25bf05d36b22"
 
+react-lifecycles-compat@^2.0.0:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-2.0.2.tgz#00a23160eec17a43b94dd74f95d44a1a2c3c5ec1"
+
 react-modal@^3.3.2:
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/react-modal/-/react-modal-3.3.2.tgz#b13da9490653a7c76bc0e9600323eb1079c620e7"
@@ -10712,6 +10631,13 @@ redux@^3.7.2:
     loose-envify "^1.1.0"
     symbol-observable "^1.0.3"
 
+redux@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.0.tgz#aa698a92b729315d22b34a0553d7e6533555cc03"
+  dependencies:
+    loose-envify "^1.1.0"
+    symbol-observable "^1.2.0"
+
 regenerate-unicode-properties@^5.1.1:
   version "5.1.3"
   resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-5.1.3.tgz#54f5891543468f36f2274b67c6bc4c033c27b308"
@@ -11957,7 +11883,7 @@ symbol-observable@^0.2.2:
   version "0.2.4"
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-0.2.4.tgz#95a83db26186d6af7e7a18dbd9760a2f86d08f40"
 
-symbol-observable@^1.0.3:
+symbol-observable@^1.0.3, symbol-observable@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804"
 
@@ -12425,22 +12351,7 @@ upath@^1.0.0:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/upath/-/upath-1.0.4.tgz#ee2321ba0a786c50973db043a50b7bcba822361d"
 
-update-notifier@^2.4.0:
-  version "2.4.0"
-  resolved "https://registry.yarnpkg.com/update-notifier/-/update-notifier-2.4.0.tgz#f9b4c700fbfd4ec12c811587258777d563d8c866"
-  dependencies:
-    boxen "^1.2.1"
-    chalk "^2.0.1"
-    configstore "^3.0.0"
-    import-lazy "^2.1.0"
-    is-ci "^1.0.10"
-    is-installed-globally "^0.1.0"
-    is-npm "^1.0.0"
-    latest-version "^3.0.0"
-    semver-diff "^2.0.0"
-    xdg-basedir "^3.0.0"
-
-update-notifier@^2.5.0:
+update-notifier@^2.4.0, update-notifier@^2.5.0:
   version "2.5.0"
   resolved "https://registry.yarnpkg.com/update-notifier/-/update-notifier-2.5.0.tgz#d0744593e13f161e406acb1d9408b72cad08aff6"
   dependencies: