couchdb-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From gar...@apache.org
Subject fauxton commit: updated refs/heads/master to 73a90d2
Date Wed, 28 Sep 2016 18:29:20 GMT
Repository: couchdb-fauxton
Updated Branches:
  refs/heads/master ceccc8e46 -> 73a90d213


Make jump to database async

Instead of loading up all the databases, the jump to database now does
an ajax call when doing a quick search for a database


Project: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/repo
Commit: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/commit/73a90d21
Tree: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/tree/73a90d21
Diff: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/diff/73a90d21

Branch: refs/heads/master
Commit: 73a90d21323fc6bc44889b01246db40f03504473
Parents: ceccc8e
Author: Garren Smith <garren.smith@gmail.com>
Authored: Wed Sep 28 16:28:40 2016 +0200
Committer: Garren Smith <garren.smith@gmail.com>
Committed: Wed Sep 28 20:29:12 2016 +0200

----------------------------------------------------------------------
 app/addons/databases/actions.js                 | 25 +++++++++
 app/addons/databases/components.react.jsx       | 56 +++++---------------
 app/addons/databases/stores.js                  |  6 ---
 .../tests/nightwatch/switchDatabase.js          |  5 +-
 .../documents/components/jumptodoc.react.jsx    |  1 +
 5 files changed, 42 insertions(+), 51 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/73a90d21/app/addons/databases/actions.js
----------------------------------------------------------------------
diff --git a/app/addons/databases/actions.js b/app/addons/databases/actions.js
index 431bee4..95062b3 100644
--- a/app/addons/databases/actions.js
+++ b/app/addons/databases/actions.js
@@ -135,5 +135,30 @@ export default {
       msg: 'Database does not exist.',
       type: 'error'
     });
+  },
+
+  fetchAllDbsWithKey: (id, callback) => {
+    const query = '?' + $.param({
+      startkey: JSON.stringify(id),
+      endkey: JSON.stringify(id + "\u9999"),
+      limit: 30
+    });
+
+    const url = `${app.host}/_all_dbs${query}`;
+    $.ajax({
+      cache: false,
+      url: url,
+      dataType: 'json'
+    }).then((dbs) => {
+      const options = dbs.map(db => {
+        return {
+          value: db,
+          label: db
+        };
+      });
+      callback(null, {
+        options: options
+      });
+    });
   }
 };

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/73a90d21/app/addons/databases/components.react.jsx
----------------------------------------------------------------------
diff --git a/app/addons/databases/components.react.jsx b/app/addons/databases/components.react.jsx
index d96a8e6..d37a5aa 100644
--- a/app/addons/databases/components.react.jsx
+++ b/app/addons/databases/components.react.jsx
@@ -219,43 +219,15 @@ var GraveyardInfo = React.createClass({
   }
 });
 
-class RightDatabasesHeader extends React.Component {
-
-  constructor (props) {
-    super(props);
-
-    this.state = this.getStoreState();
-  }
-
-  getStoreState () {
-
-    return {
-      databaseList: databasesStore.getDatabaseNamesForDropDown()
-    };
-  }
-
-  componentDidMount () {
-    databasesStore.on('change', this.onChange, this);
-  }
-
-  componentWillUnmount () {
-    databasesStore.off('change', this.onChange);
-  }
-
-  onChange () {
-    this.setState(this.getStoreState());
-  }
-
-  render () {
-    const {databaseList} = this.state;
-
-    return (
-      <div className="header-right right-db-header flex-layout flex-row">
-        <JumpToDatabaseWidget databaseList={databaseList} />
-        <AddDatabaseWidget />
-      </div>
-    );
-  }
+const RightDatabasesHeader = () => {
+  return (
+    <div className="header-right right-db-header flex-layout flex-row">
+      <JumpToDatabaseWidget
+        loadOptions={Actions.fetchAllDbsWithKey}
+      />
+      <AddDatabaseWidget />
+    </div>
+  );
 };
 
 var AddDatabaseWidget = React.createClass({
@@ -311,16 +283,14 @@ var AddDatabaseWidget = React.createClass({
   }
 });
 
-
-const JumpToDatabaseWidget = ({databaseList}) => {
-
+const JumpToDatabaseWidget = ({loadOptions}) => {
   return (
     <div data-name="jump-to-db" className="faux-header__searchboxwrapper">
       <div className="faux-header__searchboxcontainer">
 
-        <ReactSelect
+        <ReactSelect.Async
           placeholder="Database name"
-          options={databaseList}
+          loadOptions={loadOptions}
           clearable={false}
           onChange={({value: databaseName}) => {
             Actions.jumpToDatabase(databaseName);
@@ -331,7 +301,7 @@ const JumpToDatabaseWidget = ({databaseList}) => {
   );
 };
 JumpToDatabaseWidget.propTypes = {
-  databaseList: React.PropTypes.array.isRequired
+  loadOptions: React.PropTypes.func.isRequired
 };
 
 var DatabasePagination = React.createClass({

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/73a90d21/app/addons/databases/stores.js
----------------------------------------------------------------------
diff --git a/app/addons/databases/stores.js b/app/addons/databases/stores.js
index f20fe2e..7cb3b8d 100644
--- a/app/addons/databases/stores.js
+++ b/app/addons/databases/stores.js
@@ -81,12 +81,6 @@ var DatabasesStore = FauxtonAPI.Store.extend({
     });
   },
 
-  getDatabaseNamesForDropDown: function () {
-    return this.getDatabaseNames().map((db) => {
-      return { value: db, label: db};
-    });
-  },
-
   doesDatabaseExist: function (databaseName) {
     return this.getDatabaseNames().indexOf(databaseName) >= 0;
   },

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/73a90d21/app/addons/databases/tests/nightwatch/switchDatabase.js
----------------------------------------------------------------------
diff --git a/app/addons/databases/tests/nightwatch/switchDatabase.js b/app/addons/databases/tests/nightwatch/switchDatabase.js
index 9c73c30..01f96df 100644
--- a/app/addons/databases/tests/nightwatch/switchDatabase.js
+++ b/app/addons/databases/tests/nightwatch/switchDatabase.js
@@ -26,12 +26,13 @@ module.exports = {
       .getCssProperty('#footer', 'bottom', function (result) {
         this.assert.equal(result.value, '0px');
       })
-
       // wait for the DB name typeahead field to appear in the header
       .waitForElementPresent('[data-name="jump-to-db"]', waitTime, false)
       .waitForElementPresent('#dashboard-content table.databases', waitTime, false)
       .clickWhenVisible('[data-name="jump-to-db"] .Select-placeholder')
-      .setValue('[data-name="jump-to-db"] input', [newDatabaseName, client.Keys.ENTER])
+      .setValue('[data-name="jump-to-db"] input', [newDatabaseName])
+      .waitForElementPresent('.Select-option', waitTime, false)
+      .keys([client.Keys.ENTER])
       .waitForElementPresent('.index-pagination', waitTime, false)
       // now check we've redirected and the URL ends with /_all_docs
       .url((result) => {

http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/73a90d21/app/addons/documents/components/jumptodoc.react.jsx
----------------------------------------------------------------------
diff --git a/app/addons/documents/components/jumptodoc.react.jsx b/app/addons/documents/components/jumptodoc.react.jsx
index 37f0368..99347f9 100644
--- a/app/addons/documents/components/jumptodoc.react.jsx
+++ b/app/addons/documents/components/jumptodoc.react.jsx
@@ -38,6 +38,7 @@ const JumpToDoc = ({database, loadOptions}) => {
 
 JumpToDoc.propTypes = {
   database: React.PropTypes.object.isRequired,
+  loadOptions: React.PropTypes.func.isRequired,
 };
 
 export default JumpToDoc;


Mime
View raw message