COMPASS-373: Don't report user errors as application errors

package.json

@@ -133,7 +133,7 @@
     "mongodb-explain-plan-model": "^0.2.2",
     "mongodb-extended-json": "^1.8.0",
     "mongodb-instance-model": "^3.3.0",
-    "mongodb-js-metrics": "^1.5.3",
+    "mongodb-js-metrics": "^1.6.0",
     "mongodb-language-model": "^1.0.2",
     "mongodb-ns": "^1.0.3",
     "mongodb-schema": "^6.0.2",

src/internal-packages/app/styles/status-row.less

@@ -15,9 +15,15 @@
   span, div, p {
     display: inline-block;
   }
-}
 
-.status-row-has-warning {
-  background-color: #FEE9C3;
-  color: #7F6A4E;
+  &-has-warning {
+    background-color: #FEE9C3;
+    color: #7F6A4E;
+  }
+
+  &-has-error {
+    background-color: @alertRed;
+    color: @pw;
+    border: 1px solid rgba(255,255,255,0.4);
+  }
 }

src/internal-packages/crud/lib/component/document-list.jsx

@@ -49,6 +49,7 @@ class DocumentList extends React.Component {
     this.CollectionStore = app.appRegistry.getStore('App.CollectionStore');
     this.state = { docs: [], nextSkip: 0, namespace: NamespaceStore.ns };
     this.queryBar = app.appRegistry.getComponent('Query.QueryBar');
+    this.statusRow = app.appRegistry.getComponent('App.StatusRow');
   }
 
   /**
@@ -109,14 +110,15 @@ class DocumentList extends React.Component {
    *
    * @param {Array} documents - The next batch of documents.
    */
-  handleLoadMore(documents) {
+  handleLoadMore(error, documents) {
     // If not resetting we append the documents to the existing
     // list and increment the page. The loaded count is incremented
     // by the number of new documents.
     this.setState({
       docs: this.state.docs.concat(this.renderDocuments(documents)),
       nextSkip: (this.state.nextSkip + documents.length),
-      loadedCount: (this.state.loadedCount + documents.length)
+      loadedCount: (this.state.loadedCount + documents.length),
+      error: error
     });
     this.loading = false;
   }
@@ -127,7 +129,7 @@ class DocumentList extends React.Component {
    * @param {Array} documents - The documents.
    * @param {Integer} count - The count.
    */
-  handleReset(documents, count) {
+  handleReset(error, documents, count) {
     // If resetting, then we need to go back to page one with
     // the documents as the filter changed. The loaded count and
     // total count are reset here as well.
@@ -136,7 +138,8 @@ class DocumentList extends React.Component {
       nextSkip: documents.length,
       count: count,
       loadedCount: documents.length,
-      namespace: NamespaceStore.ns
+      namespace: NamespaceStore.ns,
+      error: error
     });
   }
 
@@ -244,24 +247,42 @@ class DocumentList extends React.Component {
     });
   }
 
+  /**
+   * Render the list of documents.
+   *
+   * @returns {React.Component} The list.
+   */
+  renderContent() {
+    if (this.state.error) {
+      return (
+        <this.statusRow style="error">
+          {this.state.error.message}
+        </this.statusRow>
+      );
+    }
+    return (
+      <div className="column-container with-refinebar-and-2xmessage">
+        <div className="column main">
+          <ol className={LIST_CLASS} ref={(c) => this._node = c}>
+            {this.state.docs}
+            <InsertDocumentDialog />
+          </ol>
+        </div>
+      </div>
+    );
+  }
+
   /**
    * Render the document list.
    *
    * @returns {React.Component} The document list.
    */
   render() {
     return (
-      <div className="header-margin">
+      <div className="compass-documents header-margin">
         <this.queryBar />
         <this.samplingMessage insertHandler={this.handleOpenInsert.bind(this)} />
-        <div className="column-container with-refinebar-and-2xmessage">
-          <div className="column main">
-            <ol className={LIST_CLASS} ref={(c) => this._node = c}>
-              {this.state.docs}
-              <InsertDocumentDialog />
-            </ol>
-          </div>
-        </div>
+        {this.renderContent()}
       </div>
     );
   }

src/internal-packages/crud/lib/component/editable-element.jsx

@@ -91,7 +91,7 @@ class EditableElement extends React.Component {
     this.element.on(Element.Events.Edited, this.handleChange.bind(this));
     this.element.on(Element.Events.Removed, this.handleChange.bind(this));
     this.element.on(Element.Events.Reverted, this.handleChange.bind(this));
-    this.state = { expanded: this.props.expandAll };
+    this.state = { expanded: this.props.expandAll, expandAll: this.props.expandAll };
   }
 
   /**
@@ -101,7 +101,7 @@ class EditableElement extends React.Component {
    */
   componentWillReceiveProps(nextProps) {
     if (nextProps.expandAll !== this.state.expandAll) {
-      this.setState({ expanded: nextProps.expandAll });
+      this.setState({ expanded: nextProps.expandAll, expandAll: nextProps.expandAll });
     }
   }
 

src/internal-packages/crud/lib/store/load-more-documents-store.js

@@ -18,16 +18,29 @@ const LoadMoreDocumentsStore = Reflux.createStore({
    * Initialize the reset document list store.
    */
   init: function() {
+    this.filter = {};
+    this.listenToExternalStore('Query.ChangedStore', this.onQueryChanged.bind(this));
     this.listenTo(Action.fetchNextDocuments, this.loadMoreDocuments);
   },
 
+  /**
+   * Fires when the query is changed.
+   *
+   * @param {Object} state - The query state.
+   */
+  onQueryChanged: function(state) {
+    if (state.query) {
+      this.filter = state.query;
+    }
+  },
+
   /**
    * Fetch the next page of documents.
    *
    * @param {Integer} skip - The number of documents to skip.
    */
   loadMoreDocuments: function(skip) {
-    const filter = app.queryOptions.query;
+    const filter = this.filter;
     const options = {
       skip: skip,
       limit: 20,
@@ -36,9 +49,7 @@ const LoadMoreDocumentsStore = Reflux.createStore({
       promoteValues: false
     };
     app.dataService.find(NamespaceStore.ns, filter, options, (error, documents) => {
-      if (!error) {
-        this.trigger(documents);
-      }
+      this.trigger(error, documents);
     });
   }
 });

src/internal-packages/crud/lib/store/reset-document-list-store.js

@@ -38,6 +38,11 @@ const ResetDocumentListStore = Reflux.createStore({
     this.listenToExternalStore('Query.ChangedStore', this.onQueryChanged.bind(this));
   },
 
+  /**
+   * Fires when the query is changed.
+   *
+   * @param {Object} state - The query state.
+   */
   onQueryChanged: function(state) {
     if (state.query) {
       this.reset(state.query);
@@ -60,10 +65,12 @@ const ResetDocumentListStore = Reflux.createStore({
             promoteValues: false
           };
           app.dataService.find(NamespaceStore.ns, filter, options, (error, documents) => {
-            if (!error) {
-              this.trigger(documents, count);
-            }
+            this.trigger(error, documents, count);
           });
+        } else {
+          // If the count gets an error we need to display this to the user since
+          // they have the wrong privs.
+          this.trigger(err);
         }
       });
     }

src/internal-packages/crud/styles/document-list.less

@@ -17,3 +17,9 @@
     }
   }
 }
+
+.compass-documents {
+  .status-row {
+    margin-top: 30px;
+  }
+}

src/internal-packages/explain/lib/components/compass-explain.jsx

@@ -2,8 +2,6 @@ const React = require('react');
 const app = require('ampersand-app');
 const ExplainBody = require('./explain-body');
 const ExplainHeader = require('./explain-header');
-const StatusRow = app.appRegistry.getComponent('App.StatusRow');
-// const debug = require('debug')('mongodb-compass:explain');
 
 /**
  * Structure of components (Jade notation)
@@ -29,6 +27,7 @@ class CompassExplain extends React.Component {
 
   constructor(props) {
     super(props);
+    this.statusRow = app.appRegistry.getComponent('App.StatusRow');
     this.CollectionStore = app.appRegistry.getStore('App.CollectionStore');
   }
 
@@ -38,9 +37,9 @@ class CompassExplain extends React.Component {
 
   renderWarning(warning) {
     return (
-      <StatusRow style="warning">
+      <this.statusRow style="warning">
         {warning}
-      </StatusRow>
+      </this.statusRow>
     );
   }
 

src/internal-packages/query/lib/component/sampling-message.jsx

@@ -16,7 +16,7 @@ class SamplingMessage extends React.Component {
    */
   constructor(props) {
     super(props);
-    this.state = { count: 0, loaded: 20 };
+    this.state = { count: 0, loaded: 0 };
     this.CollectionStore = app.appRegistry.getStore('App.CollectionStore');
     this.resetDocumentListStore = app.appRegistry.getStore('CRUD.ResetDocumentListStore');
     this.insertDocumentStore = app.appRegistry.getStore('CRUD.InsertDocumentStore');
@@ -59,7 +59,7 @@ class SamplingMessage extends React.Component {
    * Handle updating the count on document removal.
    */
   handleRemove() {
-    this.setState({ count: this.state.count - 1 });
+    this.setState({ count: this.state.count - 1, loaded: this.state.loaded - 1 });
   }
 
   /**
@@ -68,17 +68,21 @@ class SamplingMessage extends React.Component {
    * @param {Array} documents - The documents.
    * @param {Integer} count - The count.
    */
-  handleReset(documents, count) {
-    this.setState({ count: count, loaded: 20 });
+  handleReset(error, documents, count) {
+    if (!error) {
+      this.setState({ count: count, loaded: (count < 20) ? count : 20 });
+    }
   }
 
   /**
    * Handle scrolling that loads more documents.
    *
    * @param {Array} documents - The loaded documents.
    */
-  handleLoadMore(documents) {
-    this.setState({ loaded: this.state.loaded + documents.length });
+  handleLoadMore(error, documents) {
+    if (!error) {
+      this.setState({ loaded: this.state.loaded + documents.length });
+    }
   }