Move refresh button to the coinsPage

oktapodia · Nov 2, 2017 · d9a6107 · d9a6107
1 parent c838cfd
commit d9a6107
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 17 deletions.
diff --git a/app/components/Navbar.js b/app/components/Navbar.js
@@ -1,26 +1,14 @@
 // @flow
 import { ipcRenderer } from 'electron';
 import React, { Component } from 'react';
-import { connect } from 'react-redux';
 import { Link, NavLink } from 'react-router-dom';
-import { toggleForceRefresh } from '../modules/coins/actions';
 import image from "../appIconLarge.png";
 
 class Navbar extends Component {
-  constructor(props) {
-    super(props);
-
-    this.onClickForceRefresh = ::this.onClickForceRefresh;
-  }
-
   onClickUpdateAvailable() {
     ipcRenderer.send('check-update', true);
   }
 
-  onClickForceRefresh() {
-    this.props.toggleForceRefresh();
-  }
-
   render() {
     return (
       <nav className="navbar navbar-default navbar-static-top">
@@ -31,7 +19,6 @@ class Navbar extends Component {
           <div className="content">
           </div>
           <div className="toolbar pull-right">
-            <a onClick={this.onClickForceRefresh} className="link-force-refresh"><span className="glyphicon glyphicon-refresh" aria-hidden="true" /></a>
             <a onClick={this.onClickUpdateAvailable} className="link-update"><span className="glyphicon glyphicon-download-alt" aria-hidden="true" /></a>
             <Link to="/settings" className="link-settings"><span className="glyphicon glyphicon-cog" aria-hidden="true" /></Link>
           </div>
@@ -44,4 +31,4 @@ class Navbar extends Component {
   }
 }
 
-export default connect(null, { toggleForceRefresh })(Navbar);
+export default Navbar;
diff --git a/app/modules/coins/containers/CoinsPage.js b/app/modules/coins/containers/CoinsPage.js
@@ -4,11 +4,22 @@ import { map } from 'lodash';
 import { connect } from 'react-redux';
 import Coin from '../components/Coin';
 import CoinSettings from './CoinsSettings';
+import { toggleForceRefresh } from '../actions';
 import ModalButton from '../../modal/containers/ModalButton';
 import Modal from '../../modal/containers/Modal';
-import shallowCompare from 'react-addons-shallow-compare'; // ES6
+import shallowCompare from 'react-addons-shallow-compare';
 
 export class CoinsPage extends Component {
+  constructor(props) {
+    super(props);
+
+    this.onClickForceRefresh = ::this.onClickForceRefresh;
+  }
+
+  onClickForceRefresh() {
+    this.props.toggleForceRefresh();
+  }
+
   shouldComponentUpdate(nextProps, nextState) {
     return shallowCompare(this, nextProps, nextState);
   }
@@ -31,7 +42,10 @@ export class CoinsPage extends Component {
               <tr>
                 <th>Coin</th>
                 <th>Price</th>
-                <th><ModalButton className="pull-right"><span className="glyphicon glyphicon-plus" /></ModalButton></th>
+                <th className="toolbar">
+                  <ModalButton className="pull-right"><span className="glyphicon glyphicon-plus" /></ModalButton>
+                  <a onClick={this.onClickForceRefresh} className="link-force-refresh pull-right"><span className="glyphicon glyphicon-refresh" aria-hidden="true" /></a>
+                </th>
               </tr>
             </thead>
             <tbody>
@@ -51,4 +65,4 @@ function mapStateToProps({ coins }) {
   };
 }
 
-export default connect(mapStateToProps)(CoinsPage);
+export default connect(mapStateToProps, { toggleForceRefresh })(CoinsPage);