feat(fiat): persist fiatTicker

fix(fiat): reorder fiatTickers

fix(renderer): correct URLs in renderers

refactor(settings): refactor to functional components

fix(utils): convert fiat price w/ commas

chore(comment): remove un-needed comment

refactor(fiat-amount): rename to fiatAmount

app/components/Contacts/Network.js

@@ -155,7 +155,7 @@ class Network extends Component {
       return 'online'
     }
 
-    const usdAmount = btc.satoshisToUsd(
+    const fiatAmount = btc.satoshisToUsd(
       balance.channelBalance,
       currentTicker[ticker.fiatTicker].last
     )

app/components/Settings/Fiat.js

@@ -5,28 +5,26 @@ import Isvg from 'react-inlinesvg'
 import checkIcon from 'icons/check.svg'
 import styles from './Fiat.scss'
 
-const Fiat = ({ fiatTicker, fiatTickers, disableSubMenu, setFiatTicker }) => {
-  return (
-    <div>
-      <header className={styles.submenuHeader} onClick={disableSubMenu}>
-        <FaAngleLeft />
-        <span>Fiat currency</span>
-      </header>
-      <ul className={styles.fiatTickers}>
-        {fiatTickers.map(ft => (
-          <li
-            key={ft}
-            className={fiatTicker === ft && styles.active}
-            onClick={() => setFiatTicker(ft)}
-          >
-            <span>{ft}</span>
-            {fiatTicker === ft && <Isvg src={checkIcon} />}
-          </li>
-        ))}
-      </ul>
-    </div>
-  )
-}
+const Fiat = ({ fiatTicker, fiatTickers, disableSubMenu, setFiatTicker }) => (
+  <div>
+    <header className={styles.submenuHeader} onClick={disableSubMenu}>
+      <FaAngleLeft />
+      <span>Fiat currency</span>
+    </header>
+    <ul className={styles.fiatTickers}>
+      {fiatTickers.map(ft => (
+        <li
+          key={ft}
+          className={fiatTicker === ft && styles.active}
+          onClick={() => setFiatTicker(ft)}
+        >
+          <span>{ft}</span>
+          {fiatTicker === ft && <Isvg src={checkIcon} />}
+        </li>
+      ))}
+    </ul>
+  </div>
+)
 
 Fiat.propTypes = {
   fiatTicker: PropTypes.string.isRequired,

app/components/Settings/Menu.js

@@ -3,16 +3,14 @@ import PropTypes from 'prop-types'
 import FaAngleRight from 'react-icons/lib/fa/angle-right'
 import styles from './Menu.scss'
 
-const Menu = ({ setActiveSubMenu }) => {
-  return (
-    <ul>
-      <li className={styles.fiat} onClick={() => setActiveSubMenu('fiat')}>
-        <span>Fiat Currency</span>
-        <FaAngleRight />
-      </li>
-    </ul>
-  )
-}
+const Menu = ({ setActiveSubMenu }) => (
+  <ul>
+    <li className={styles.fiat} onClick={() => setActiveSubMenu('fiat')}>
+      <span>Fiat Currency</span>
+      <FaAngleRight />
+    </li>
+  </ul>
+)
 
 Menu.propTypes = {
   setActiveSubMenu: PropTypes.func.isRequired

app/lib/utils/btc.js

@@ -1,6 +1,13 @@
 /* eslint-disable */
 
 import sb from 'satoshi-bitcoin'
+
+////////////////
+// Helpers /////
+////////////////
+
+const numberWithCommas = x => x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')
+
 //////////////////////
 // BTC to things /////
 /////////////////////
@@ -18,7 +25,7 @@ export function btcToBits(btc) {
 
 export function btcToUsd(btc, price) {
   const amount = parseFloat(btc * price).toFixed(2)
-  return (btc > 0 && amount <= 0) ? '< 0.01' : amount.toLocaleString('en')
+  return (btc > 0 && amount <= 0) ? '< 0.01' : numberWithCommas(amount)
 }
 
 ////////////////////////////

app/reducers/balance.js

@@ -22,7 +22,6 @@ export const fetchBalance = () => async dispatch => {
 
 // Receive IPC event for balance
 export const receiveBalance = (event, { walletBalance, channelBalance }) => dispatch => {
-  // dispatch({ type: RECEIVE_BALANCE, walletBalance, channelBalance })
   dispatch({ type: RECEIVE_BALANCE, walletBalance, channelBalance })
 }
 

app/reducers/ticker.js

@@ -1,7 +1,11 @@
 import { createSelector } from 'reselect'
+import Store from 'electron-store'
 import { requestTicker } from 'lib/utils/api'
 import { infoSelectors } from './info'
 
+// Ticker store
+const store = new Store({ name: 'ticker' })
+
 // ------------------------------------
 // Constants
 // ------------------------------------
@@ -35,6 +39,9 @@ export function setCrypto(crypto) {
 }
 
 export function setFiatTicker(fiatTicker) {
+  // Persist the new fiatTicker in our ticker store
+  store.set('fiatTicker', fiatTicker)
+
   return {
     type: SET_FIAT_TICKER,
     fiatTicker
@@ -134,23 +141,23 @@ const initialState = {
   crypto: '',
   btcTicker: null,
   ltcTicker: null,
-  fiatTicker: 'USD',
+  fiatTicker: store.get('fiatTicker', 'USD'),
   fiatTickers: [
     'USD',
+    'EUR',
+    'JPY',
+    'GBP',
+    'CAD',
+    'KRW',
     'AUD',
     'BRL',
-    'CAD',
     'CHF',
     'CLP',
     'CNY',
     'DKK',
-    'EUR',
-    'GBP',
     'HKD',
     'INR',
     'ISK',
-    'JPY',
-    'KRW',
     'NZD',
     'PLN',
     'RUB',

webpack.config.renderer.dev.js

@@ -228,7 +228,7 @@ export default merge.smart(baseConfig, {
         "'self'",
         'http://localhost:*',
         'ws://localhost:*',
-        'https://blockchain.info/ticker',
+        'https://blockchain.info',
         'https://zap.jackmallers.com'
       ],
       'script-src': ["'self'", 'http://localhost:*', "'unsafe-eval'"],

webpack.config.renderer.prod.js

@@ -158,7 +158,7 @@ export default merge.smart(baseConfig, {
     new CspHtmlWebpackPlugin({
       'default-src': "'self'",
       'object-src': "'none'",
-      'connect-src': ["'self'", 'https://api.coinmarketcap.com', 'https://zap.jackmallers.com'],
+      'connect-src': ["'self'", 'https://blockchain.info', 'https://zap.jackmallers.com'],
       'script-src': ["'self'"],
       'font-src': [
         "'self'",