From a44edbb17efd87bd92cb71646ef4ed67fc6d6b1c Mon Sep 17 00:00:00 2001
From: Connor Turland <connorturland@gmail.com>
Date: Sun, 23 Oct 2016 11:44:20 -0400
Subject: [PATCH] better transition from map to explore

---
 frontend/src/Metamaps/Router.js       | 2 ++
 frontend/src/components/Maps/index.js | 4 ++--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/src/Metamaps/Router.js b/frontend/src/Metamaps/Router.js
index 9ad80187..8bbd6949 100644
--- a/frontend/src/Metamaps/Router.js
+++ b/frontend/src/Metamaps/Router.js
@@ -59,6 +59,7 @@ const _Router = Backbone.Router.extend({
 
       Views.ExploreMaps.setCollection(Metamaps.Maps.Active)
       if (Metamaps.Maps.Active.length === 0) {
+        Views.ExploreMaps.pending = true
         Metamaps.Maps.Active.getMaps(navigate) // this will trigger an explore maps render
       } else {
         Views.ExploreMaps.render(navigate)
@@ -134,6 +135,7 @@ const _Router = Backbone.Router.extend({
     }
     if (Metamaps.Maps[capitalize].length === 0) {
       Metamaps.Loading.show()
+      Views.ExploreMaps.pending = true
       setTimeout(function () {
         Metamaps.Maps[capitalize].getMaps(navigate) // this will trigger an explore maps render
       }, 300) // wait 300 milliseconds till the other animations are done to do the fetch
diff --git a/frontend/src/components/Maps/index.js b/frontend/src/components/Maps/index.js
index df59b446..fee6c332 100644
--- a/frontend/src/components/Maps/index.js
+++ b/frontend/src/components/Maps/index.js
@@ -41,7 +41,7 @@ class Maps extends Component {
   }
 
   render = () => {
-    const { maps, currentUser, juntoState, section, user, moreToLoad, loadMore, onStar, onRequest } = this.props
+    const { maps, currentUser, juntoState, pending, section, user, moreToLoad, loadMore, onStar, onRequest } = this.props
     const style = { width: this.state.mapsWidth + 'px' }
 
     return (
@@ -49,7 +49,7 @@ class Maps extends Component {
         <div id='exploreMaps' ref='maps'>
           <div style={ style }>
             { user ? <MapperCard user={ user } /> : null }
-            { currentUser && !user ? <div className="map newMap"><a href="/maps/new"><div className="newMapImage"></div><span>Create new map...</span></a></div> : null }
+            { currentUser && !user && !(pending && maps.length === 0) ? <div className="map newMap"><a href="/maps/new"><div className="newMapImage"></div><span>Create new map...</span></a></div> : null }
             { maps.models.map(map => <MapCard key={ map.id } map={ map } juntoState={ juntoState } currentUser={ currentUser } onStar={ onStar } onRequest={ onRequest } />) }
             <div className='clearfloat'></div>
           </div>