From 9eca19ca56ae17bd874edf58a297eb0e174127ec Mon Sep 17 00:00:00 2001
From: Halla Moore <halla@nylas.com>
Date: Mon, 16 Jan 2017 16:17:01 -0800
Subject: [PATCH] fix(sync-messaging): Have "Looking for messages..." update
 properly

Summary:
Makes these messages update even if the user doesn't force a
re-render by switching perspectives.

Test Plan: tested manually

Reviewers: evan, juan

Reviewed By: juan

Differential Revision: https://phab.nylas.com/D3715
---
 internal_packages/thread-list/lib/thread-list.cjsx | 11 ++++++++---
 src/components/empty-list-state.cjsx               | 13 +------------
 src/components/list-tabular.cjsx                   |  6 +++---
 3 files changed, 12 insertions(+), 18 deletions(-)

diff --git a/internal_packages/thread-list/lib/thread-list.cjsx b/internal_packages/thread-list/lib/thread-list.cjsx
index b4c79485c..e0f8cfce7 100644
--- a/internal_packages/thread-list/lib/thread-list.cjsx
+++ b/internal_packages/thread-list/lib/thread-list.cjsx
@@ -42,13 +42,18 @@ class ThreadList extends React.Component
   constructor: (@props) ->
     @state =
       style: 'unknown'
+      syncing: false
 
   componentDidMount: =>
+    @unsub = NylasSyncStatusStore.listen( => @setState
+      syncing: FocusedPerspectiveStore.current().hasSyncingCategories()
+    )
     window.addEventListener('resize', @_onResize, true)
     ReactDOM.findDOMNode(@).addEventListener('contextmenu', @_onShowContextMenu)
     @_onResize()
 
   componentWillUnmount: =>
+    @unsub()
     window.removeEventListener('resize', @_onResize, true)
     ReactDOM.findDOMNode(@).removeEventListener('contextmenu', @_onShowContextMenu)
 
@@ -83,9 +88,9 @@ class ThreadList extends React.Component
     'thread-list:select-starred': @_onSelectStarred
     'thread-list:select-unstarred': @_onSelectUnstarred
 
-  _renderFooterContent: ->
+  _getFooter: ->
+    return null unless @state.syncing
     return null if ThreadListStore.dataSource().count() <= 0
-    return null unless FocusedPerspectiveStore.current().hasSyncingCategories()
     return <SyncingListState />
 
   render: ->
@@ -97,7 +102,7 @@ class ThreadList extends React.Component
       itemHeight = 85
 
     <FluxContainer
-      renderFooterContent={@_renderFooterContent}
+      footer={@_getFooter()}
       stores=[ThreadListStore]
       getStateFromStores={ -> dataSource: ThreadListStore.dataSource() }>
       <FocusContainer collection="thread">
diff --git a/src/components/empty-list-state.cjsx b/src/components/empty-list-state.cjsx
index a3adc0ddf..1167a05a9 100644
--- a/src/components/empty-list-state.cjsx
+++ b/src/components/empty-list-state.cjsx
@@ -151,17 +151,6 @@ class EmptyListState extends React.Component
       @setState({rect})
 
   _getStateFromStores: ->
-    currentPerspective = FocusedPerspectiveStore.current()
-    accountIds = currentPerspective.accountIds
-    if accountIds.length == 1
-      accountId = accountIds[0]
-      categories = currentPerspective.categories
-      folderName = null
-      if categories.length == 1 and categories[0].object == 'folder'
-        folderName = categories[0].displayName
-      syncing = !NylasSyncStatusStore.isSyncCompleteForAccount(accountId, folderName)
-    else
-      syncing = NylasSyncStatusStore.busy()
-    return syncing: syncing
+    return syncing: FocusedPerspectiveStore.current().hasSyncingCategories()
 
 module.exports = EmptyListState
diff --git a/src/components/list-tabular.cjsx b/src/components/list-tabular.cjsx
index 9b11732e7..f4d92e7f8 100644
--- a/src/components/list-tabular.cjsx
+++ b/src/components/list-tabular.cjsx
@@ -22,10 +22,10 @@ class ListTabular extends React.Component
     onSelect: React.PropTypes.func
     onClick: React.PropTypes.func
     onDoubleClick: React.PropTypes.func
-    renderFooterContent: React.PropTypes.func
+    footer: React.PropTypes.node
 
   @defaultProps =
-    renderFooterContent: => null
+    footer: => false
 
   constructor: (@props) ->
     if not @props.itemHeight
@@ -190,7 +190,7 @@ class ListTabular extends React.Component
         >
           {@_rows()}
         </div>
-        <div className="footer">{@props.renderFooterContent()}</div>
+        <div className="footer">{@props.footer}</div>
       </ScrollRegion>
       <Spinner visible={!@state.loaded and @state.empty} />
       {emptyElement}