fix(syncing): move syncing logic out of application component

app/containers/Root.js

@@ -1,15 +1,39 @@
 // @flow
 import React from 'react'
-import { Provider } from 'react-redux'
+import { Provider, connect } from 'react-redux'
 import { ConnectedRouter } from 'react-router-redux'
+import { fetchBlockHeight, lndSelectors } from 'reducers/lnd'
+import LndSyncing from 'components/LndSyncing'
 import Routes from '../routes'
 
+const mapDispatchToProps = {
+  fetchBlockHeight
+}
+
+const mapStateToProps = state => ({
+  syncPercentage: lndSelectors.syncPercentage(state)
+})
+
 type RootType = {
   store: {},
   history: {}
 };
 
-export default function Root({ store, history }: RootType) {
+class Root extends React.Component {
+  render() {
+    const { store, history, fetchBlockHeight, syncPercentage } = this.props
+    const { lnd } = store.getState()
+
+    if (lnd.syncing) {
+      return (
+        <LndSyncing
+          fetchBlockHeight={fetchBlockHeight}
+          fetchingBlockHeight={lnd.fetchingBlockHeight}
+          syncPercentage={syncPercentage}
+        />
+      )
+    }
+
     return (
       <Provider store={store}>
         <ConnectedRouter history={history}>
@@ -17,4 +41,8 @@ export default function Root({ store, history }: RootType) {
         </ConnectedRouter>
       </Provider>
     )
+  }
 } 
+
+
+export default connect(mapStateToProps, mapDispatchToProps)(Root)

app/routes.js

@@ -14,4 +14,4 @@ export default () => (
       <Route path='/' component={Activity} />
     </Switch>
   </App>
-);
+)

app/routes/app/components/App.js

@@ -13,13 +13,11 @@ class App extends Component {
   componentWillMount() {
     const { fetchTicker, fetchBalance, fetchInfo, newAddress, lnd: { syncing } } = this.props
 
-    if (!syncing) {
     fetchTicker()
     fetchBalance()
     fetchInfo()
     newAddress('p2pkh')
   }
-  }
 
   render() {
     const {
@@ -47,16 +45,6 @@ class App extends Component {
       children
     } = this.props
 
-    if (lnd.syncing) {
-      return (
-        <LndSyncing
-          fetchBlockHeight={fetchBlockHeight}
-          fetchingBlockHeight={lnd.fetchingBlockHeight}
-          syncPercentage={syncPercentage}
-        />
-      )
-    }
-
     if (!currentTicker || balance.balanceLoading) { return <LoadingBolt /> }
 
     return (