From 73781472cb4690f529b17444b7ce501a35613152 Mon Sep 17 00:00:00 2001
From: meriadec <meriadec.pillet@gmail.com>
Date: Mon, 9 Jul 2018 18:52:21 +0200
Subject: [PATCH] Add SyncBackground component

closes #904
---
 src/bridge/BridgeSyncContext.js  | 20 +-----------------
 src/components/SyncBackground.js | 36 ++++++++++++++++++++++++++++++++
 src/components/layout/Default.js |  2 ++
 3 files changed, 39 insertions(+), 19 deletions(-)
 create mode 100644 src/components/SyncBackground.js

diff --git a/src/bridge/BridgeSyncContext.js b/src/bridge/BridgeSyncContext.js
index e8df3923..99099fb0 100644
--- a/src/bridge/BridgeSyncContext.js
+++ b/src/bridge/BridgeSyncContext.js
@@ -17,12 +17,7 @@ import { setAccountSyncState } from 'actions/bridgeSync'
 import { bridgeSyncSelector, syncStateLocalSelector } from 'reducers/bridgeSync'
 import type { BridgeSyncState } from 'reducers/bridgeSync'
 import { accountsSelector } from 'reducers/accounts'
-import {
-  SYNC_BOOT_DELAY,
-  SYNC_ALL_INTERVAL,
-  SYNC_MAX_CONCURRENT,
-  SYNC_TIMEOUT,
-} from 'config/constants'
+import { SYNC_MAX_CONCURRENT, SYNC_TIMEOUT } from 'config/constants'
 import { getBridgeForCurrency } from '.'
 
 type BridgeSyncProviderProps = {
@@ -151,19 +146,6 @@ class Provider extends Component<BridgeSyncProviderOwnProps, Sync> {
     this.api = sync
   }
 
-  componentDidMount() {
-    const syncLoop = async () => {
-      this.api({ type: 'BACKGROUND_TICK' })
-      this.syncTimeout = setTimeout(syncLoop, SYNC_ALL_INTERVAL)
-    }
-    this.syncTimeout = setTimeout(syncLoop, SYNC_BOOT_DELAY)
-  }
-
-  componentWillUnmount() {
-    clearTimeout(this.syncTimeout)
-  }
-
-  syncTimeout: *
   api: Sync
 
   render() {
diff --git a/src/components/SyncBackground.js b/src/components/SyncBackground.js
new file mode 100644
index 00000000..f1268653
--- /dev/null
+++ b/src/components/SyncBackground.js
@@ -0,0 +1,36 @@
+// @flow
+
+import React, { PureComponent } from 'react'
+import { BridgeSyncConsumer } from 'bridge/BridgeSyncContext'
+import type { Sync } from 'bridge/BridgeSyncContext'
+
+import { SYNC_BOOT_DELAY, SYNC_ALL_INTERVAL } from 'config/constants'
+
+export class Effect extends PureComponent<{
+  sync: Sync,
+}> {
+  componentDidMount() {
+    const syncLoop = async () => {
+      const { sync } = this.props
+      sync({ type: 'BACKGROUND_TICK' })
+      this.syncTimeout = setTimeout(syncLoop, SYNC_ALL_INTERVAL)
+    }
+    this.syncTimeout = setTimeout(syncLoop, SYNC_BOOT_DELAY)
+  }
+
+  componentWillUnmount() {
+    clearTimeout(this.syncTimeout)
+  }
+
+  syncTimeout: *
+
+  render() {
+    return null
+  }
+}
+
+const SyncBackground = () => (
+  <BridgeSyncConsumer>{sync => <Effect sync={sync} />}</BridgeSyncConsumer>
+)
+
+export default SyncBackground
diff --git a/src/components/layout/Default.js b/src/components/layout/Default.js
index d304af06..7e426ce0 100644
--- a/src/components/layout/Default.js
+++ b/src/components/layout/Default.js
@@ -31,6 +31,7 @@ import AppRegionDrag from 'components/AppRegionDrag'
 import IsUnlocked from 'components/IsUnlocked'
 import SideBar from 'components/MainSideBar'
 import TopBar from 'components/TopBar'
+import SyncBackground from 'components/SyncBackground'
 import SyncContinuouslyPendingOperations from '../SyncContinouslyPendingOperations'
 
 const Main = styled(GrowScroll).attrs({
@@ -94,6 +95,7 @@ class Default extends Component<Props> {
             ))}
 
             <SyncContinuouslyPendingOperations priority={20} interval={SYNC_PENDING_INTERVAL} />
+            <SyncBackground />
 
             <div id="sticky-back-to-top-root" />