Switched to a simpler loading indicator implementation

frontend/src/metabase/reference/containers/ReferenceApp.jsx

@@ -47,31 +47,36 @@ export default class ReferenceApp extends Component {
         isEditing: PropTypes.bool
     };
 
-    componentWillMount() {
+    async componentWillMount() {
         if (this.props.section && this.props.section.fetch) {
             const fetch = this.props.section.fetch;
-            Object.keys(fetch).forEach((fetchPropName) => {
+            this.props.startLoading();
+            await Promise.all(Object.keys(fetch).map((fetchPropName) => {
                 const fetchData = this.props[fetchPropName];
                 const fetchArgs = fetch[fetchPropName] || [];
-                fetchData(...fetchArgs);
-            });
+                return fetchData(...fetchArgs);
+            }));
+            this.props.endLoading();
         }
     }
 
-    componentWillReceiveProps(newProps) {
+    async componentWillReceiveProps(newProps) {
         if (this.props.location.pathname === newProps.location.pathname) {
             return;
         }
 
         newProps.endEditing();
+        newProps.endLoading();
 
         if (newProps.section && newProps.section.fetch) {
             const fetch = newProps.section.fetch;
-            Object.keys(fetch).forEach((fetchPropName) => {
+            newProps.startLoading();
+            await Promise.all(Object.keys(fetch).map((fetchPropName) => {
                 const fetchData = newProps[fetchPropName];
                 const fetchArgs = fetch[fetchPropName] || [];
-                fetchData(...fetchArgs);
-            });
+                return fetchData(...fetchArgs);
+            }));
+            newProps.endLoading();
         }
     }
 

frontend/src/metabase/reference/containers/ReferenceEntity.jsx

@@ -75,6 +75,8 @@ export default class EntityItem extends Component {
             isEditing,
             startEditing,
             endEditing,
+            startLoading,
+            endLoading,
             hasDisplayName,
             hasRevisionHistory,
             handleSubmit,
@@ -89,8 +91,9 @@ export default class EntityItem extends Component {
                             .filter(key => fields[key] !== undefined)
                             .reduce((map, key) => i.assoc(map, key, fields[key]), {});
                         const newEntity = {...entity, ...editedFields};
-                        console.log(newEntity);
+                        startLoading();
                         await this.props[section.update](newEntity);
+                        endLoading();
                         endEditing();
                     })}
                 >

frontend/src/metabase/reference/reference.js

@@ -2,6 +2,12 @@ import { handleActions, createAction, createThunkAction } from 'metabase/lib/red
 
 import i from 'icepick';
 
+const START_LOADING = "metabase/reference/START_LOADING";
+export const startLoading = createAction(START_LOADING);
+
+const END_LOADING = "metabase/reference/END_LOADING";
+export const endLoading = createAction(END_LOADING);
+
 const START_EDITING = "metabase/reference/START_EDITING";
 export const startEditing = createAction(START_EDITING);
 
@@ -9,9 +15,16 @@ const END_EDITING = "metabase/reference/END_EDITING";
 export const endEditing = createAction(END_EDITING);
 
 const initialState = {
+    isLoading: false,
     isEditing: false
 };
 export default handleActions({
+    [START_LOADING]: {
+        next: (state) => i.assoc(state, 'isLoading', true)
+    },
+    [END_LOADING]: {
+        next: (state) => i.assoc(state, 'isLoading', false)
+    },
     [START_EDITING]: {
         next: (state) => i.assoc(state, 'isEditing', true)
     },

frontend/src/metabase/reference/selectors.js

@@ -458,15 +458,15 @@ export const mapFetchToRequestStatePaths = (fetch) => fetch ?
             case 'fetchMetrics':
                 return ['metadata', 'metrics', 'fetch'];
             case 'fetchRevisions':
-                return ['metadata', 'revisions', fetch[key[0]], fetch[key[1]], 'fetch'];
+                return ['metadata', 'revisions', fetch[key][0], fetch[key][1], 'fetch'];
             case 'fetchLists':
                 return ['metadata', 'lists', 'fetch'];
             case 'fetchDatabases':
                 return ['metadata', 'databases', 'fetch'];
             case 'fetchDatabaseMetadata':
-                return ['metadata', 'databases', fetch[key], 'fetch'];
+                return ['metadata', 'databases', fetch[key][0], 'fetch'];
             case 'fetchTableMetadata':
-                return ['metadata', 'tables', fetch[key], 'fetch'];
+                return ['metadata', 'tables', fetch[key][0], 'fetch'];
             default:
                 return [];
         }
@@ -479,21 +479,7 @@ const getRequestPaths = createSelector(
     (section) => mapFetchToRequestStatePaths(section.fetch)
 );
 
-export const getLoaded = createSelector(
-    [getRequestPaths, getRequests],
-    (requestPaths, requests) => requestPaths
-        .reduce((isLoaded, requestPath) =>
-            isLoaded ||
-            i.getIn(requests, requestPath.concat('state')) === 'LOADED', false)
-)
-
-export const getLoading = createSelector(
-    [getRequestPaths, getRequests],
-    (requestPaths, requests) => requestPaths
-        .reduce((isLoading, requestPath) =>
-            isLoading ||
-            i.getIn(requests, requestPath.concat('state')) === 'LOADING', false)
-)
+export const getLoading = (state) => state.reference.isLoading;
 
 export const getError = createSelector(
     [getRequestPaths, getRequests],