Repository: couchdb-fauxton Updated Branches: refs/heads/master ef6b8f070 -> 91fc5e367
Open up Databases table to be extended This adds a couple of hooks to the DatabaseTable component to allow extensions to add columns. Project: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/repo Commit: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/commit/91fc5e36 Tree: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/tree/91fc5e36 Diff: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/diff/91fc5e36 Branch: refs/heads/master Commit: 91fc5e367d906ebac763c2bf9153bd944d9976e9 Parents: ef6b8f0 Author: Ben Keen <[email protected]> Authored: Tue May 19 13:30:22 2015 -0700 Committer: Ben Keen <[email protected]> Committed: Thu May 21 11:28:04 2015 -0700 ---------------------------------------------------------------------- app/addons/databases/components.react.jsx | 16 +++++ .../databases/tests/componentsSpec.react.jsx | 62 ++++++++++++++++++++ 2 files changed, 78 insertions(+) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/91fc5e36/app/addons/databases/components.react.jsx ---------------------------------------------------------------------- diff --git a/app/addons/databases/components.react.jsx b/app/addons/databases/components.react.jsx index d42b7de..80b06fa 100644 --- a/app/addons/databases/components.react.jsx +++ b/app/addons/databases/components.react.jsx @@ -68,6 +68,13 @@ define([ }); }, + getExtensionColumns: function () { + var cols = FauxtonAPI.getExtensions('DatabaseTable:head'); + return _.map(cols, function (Item, index) { + return <Item key={index} />; + }); + }, + render: function () { if (this.props.loading) { return ( @@ -85,6 +92,7 @@ define([ <th>Size</th> <th># of Docs</th> <th>Update Seq</th> + {this.getExtensionColumns()} <th>Actions</th> </thead> <tbody> @@ -108,6 +116,13 @@ define([ } }, + getExtensionColumns: function (row) { + var cols = FauxtonAPI.getExtensions('DatabaseTable:databaseRow'); + return _.map(cols, function (Item, index) { + return <Item row={row} key={index} />; + }); + }, + render: function () { var row = this.props.row; var name = row.get("name"); @@ -121,6 +136,7 @@ define([ <td>{size}</td> <td>{row.status.numDocs()} {this.renderGraveyard(row)}</td> <td>{row.status.updateSeq()}</td> + {this.getExtensionColumns(row)} <td> <a className="db-actions btn fonticon-replicate set-replication-start" title={"Replicate "+name} href={"#/replication/"+encoded}></a>  <a className="db-actions btn icon-lock set-permissions" title={"Set permissions for "+name} href={"#/database/"+encoded+"/permissions"}></a> http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/91fc5e36/app/addons/databases/tests/componentsSpec.react.jsx ---------------------------------------------------------------------- diff --git a/app/addons/databases/tests/componentsSpec.react.jsx b/app/addons/databases/tests/componentsSpec.react.jsx index 64c3180..c8fd4e4 100644 --- a/app/addons/databases/tests/componentsSpec.react.jsx +++ b/app/addons/databases/tests/componentsSpec.react.jsx @@ -218,9 +218,71 @@ define([ links.each(function () { assert.include(this.href, '_custom_path', 'link contains custom path'); }); + + React.unmountComponentAtNode(container); }); }); + describe('DatabaseTable', function () { + var container; + + beforeEach(function () { + container = document.createElement('div'); + }); + + afterEach(function () { + React.unmountComponentAtNode(container); + }); + + it('adds multiple extra columns if extended', function () { + var ColHeader1 = React.createClass({ + render: function () { return <th>EXTRA COL 1</th>; } + }); + var ColHeader2 = React.createClass({ + render: function () { return <th>EXTRA COL 2</th>; } + }); + var ColHeader3 = React.createClass({ + render: function () { return <th>EXTRA COL 3</th>; } + }); + + FauxtonAPI.registerExtension('DatabaseTable:head', ColHeader1); + FauxtonAPI.registerExtension('DatabaseTable:head', ColHeader2); + FauxtonAPI.registerExtension('DatabaseTable:head', ColHeader3); + + var table = TestUtils.renderIntoDocument(<Views.DatabaseTable loading={false} body={[]} />, container); + var cols = $(table.getDOMNode()).find('th'); + + // (default # of rows is 5) + assert.equal(cols.length, 8, 'extra columns show up'); + + FauxtonAPI.unRegisterExtension('DatabaseTable:head'); + }); + + it('adds multiple extra column in DatabaseRow if extended', function () { + var Cell = React.createClass({ + render: function () { return <td>EXTRA CELL</td>; } + }); + + FauxtonAPI.registerExtension('DatabaseTable:databaseRow', Cell); + + var row = new Backbone.Model({ name: 'db name' }); + row.status = { + dataSize: function () { return 0; }, + numDocs: function () { return 0; }, + updateSeq: function () { return 0; }, + isGraveYard: function () { return false; } + }; + + var databaseRow = TestUtils.renderIntoDocument(<Views.DatabaseTable body={[row]} />, container); + var links = $(databaseRow.getDOMNode()).find('td'); + + // (default # of rows is 5) + assert.equal(links.length, 6, 'extra column shows up'); + + FauxtonAPI.unRegisterExtension('DatabaseTable:databaseRow'); + }); + + }); });
