diff --git a/package.json b/package.json index 38b12f77027..a03ac54cf75 100644 --- a/package.json +++ b/package.json @@ -55,7 +55,7 @@ "start": "hadron-build develop", "pretest": "mongodb-runner install", "test": "xvfb-maybe hadron-build test", - "check": "mongodb-js-precommit ./src/app/*.js ./src/app/**/**/*.js ./src/{app/**/*.js,main/**/*.js} ./test/*.js", + "check": "mongodb-js-precommit ./src/app/*.js ./src/app/**/**/*.js ./src/{app/**/*.js,main/**/*.js} ./test/*.js ./src/internal-packages/**/*.js ./src/internal-packages/**/**/*{.js,.jsx} ./src/internal-packages/**/**/**/*{.js,.jsx} ./src/internal-packages/**/**/**/**/*{.js,.jsx}", "ci": "npm run check && npm run test-unit", "clean": "hadron-build clean", "compile-ui": "hadron-build ui", diff --git a/src/internal-packages/crud/index.js b/src/internal-packages/crud/index.js index dd12364b1ee..9c5cabdd974 100644 --- a/src/internal-packages/crud/index.js +++ b/src/internal-packages/crud/index.js @@ -1,5 +1,3 @@ -'use strict'; - const app = require('ampersand-app'); const Document = require('./lib/component/document'); const DocumentList = require('./lib/component/document-list'); diff --git a/src/internal-packages/crud/lib/actions.js b/src/internal-packages/crud/lib/actions.js index 4ddd3f84356..90351033582 100644 --- a/src/internal-packages/crud/lib/actions.js +++ b/src/internal-packages/crud/lib/actions.js @@ -1,5 +1,3 @@ -'use strict'; - const Reflux = require('reflux'); const Actions = Reflux.createActions([ diff --git a/src/internal-packages/crud/lib/component/binary-value.jsx b/src/internal-packages/crud/lib/component/binary-value.jsx index 2249b89a344..653175bf597 100644 --- a/src/internal-packages/crud/lib/component/binary-value.jsx +++ b/src/internal-packages/crud/lib/component/binary-value.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const truncate = require('hadron-app-registry').truncate; @@ -35,7 +33,21 @@ class BinaryValue extends React.Component { */ constructor(props) { super(props); - this.value = props.element.currentValue; + this.element = props.element; + } + + /** + * Render the value. + * + * @returns {Component} The component. + */ + renderValue() { + const type = this.element.currentValue.sub_type; + const buffer = this.element.currentValue.buffer; + if (type === UUID || type === UUID_OLD) { + return `Binary('${truncate(buffer.toString())}')`; + } + return `Binary('${truncate(buffer.toString(BASE_64))}')`; } /** @@ -50,22 +62,12 @@ class BinaryValue extends React.Component { ); } - - /** - * Render the value. - * - * @returns {Component} The component. - */ - renderValue() { - var type = this.value.sub_type; - var buffer = this.value.buffer; - if (type === UUID || type === UUID_OLD) { - return `Binary('${truncate(buffer.toString())}')`; - } - return `Binary('${truncate(buffer.toString(BASE_64))}')`; - } } BinaryValue.displayName = 'BinaryValue'; +BinaryValue.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = BinaryValue; diff --git a/src/internal-packages/crud/lib/component/code-value.jsx b/src/internal-packages/crud/lib/component/code-value.jsx index 7463aab1536..eba854ee096 100644 --- a/src/internal-packages/crud/lib/component/code-value.jsx +++ b/src/internal-packages/crud/lib/component/code-value.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const truncate = require('hadron-app-registry').truncate; @@ -20,7 +18,7 @@ class CodeValue extends React.Component { */ constructor(props) { super(props); - this.value = props.element.currentValue; + this.element = props.element; } /** @@ -31,7 +29,7 @@ class CodeValue extends React.Component { render() { return (
- {truncate(this.value.code)} + {truncate(this.element.currentValue.code)}
); } @@ -39,4 +37,8 @@ class CodeValue extends React.Component { CodeValue.displayName = 'CodeValue'; +CodeValue.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = CodeValue; diff --git a/src/internal-packages/crud/lib/component/document-actions.jsx b/src/internal-packages/crud/lib/component/document-actions.jsx index 711e7a9089c..1f767231b78 100644 --- a/src/internal-packages/crud/lib/component/document-actions.jsx +++ b/src/internal-packages/crud/lib/component/document-actions.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const IconButton = require('hadron-app-registry').IconButton; @@ -8,15 +6,6 @@ const IconButton = require('hadron-app-registry').IconButton; */ class DocumentActions extends React.Component { - /** - * The component constructor. - * - * @param {Object} props - The properties. - */ - constructor(props) { - super(props); - } - /** * Render the actions. * @@ -24,18 +13,18 @@ class DocumentActions extends React.Component { */ render() { return ( -
+
); @@ -44,4 +33,10 @@ class DocumentActions extends React.Component { DocumentActions.displayName = 'DocumentActions'; +DocumentActions.propTypes = { + edit: React.PropTypes.func.isRequired, + remove: React.PropTypes.func.isRequired, + clone: React.PropTypes.func.isRequired +}; + module.exports = DocumentActions; diff --git a/src/internal-packages/crud/lib/component/document-footer.jsx b/src/internal-packages/crud/lib/component/document-footer.jsx index b63cf939d28..b05ee8ce7b7 100644 --- a/src/internal-packages/crud/lib/component/document-footer.jsx +++ b/src/internal-packages/crud/lib/component/document-footer.jsx @@ -1,6 +1,3 @@ -'use strict'; - -const _ = require('lodash'); const React = require('react'); const Element = require('hadron-document').Element; const TextButton = require('hadron-app-registry').TextButton; @@ -39,7 +36,7 @@ const MODES = { 'Error': 'error', 'Editing': 'modified', 'Viewing': 'viewing' -} +}; /** * The empty message. @@ -130,7 +127,7 @@ class DocumentFooter extends React.Component { * Handle the user clicking the update button. */ handleUpdate() { - var object = this.props.doc.generateObject(); + const object = this.props.doc.generateObject(); this.setState({ mode: PROGRESS, message: UPDATING }); this.actions.update(object); } @@ -146,7 +143,7 @@ class DocumentFooter extends React.Component { * Handles a trigger from the store. * * @param {Boolean} success - If the update succeeded. - * @param {Error, Document} object - The error or document. + * @param {Object} object - The error or document. */ handleStoreUpdate(success, object) { if (success) { @@ -156,6 +153,15 @@ class DocumentFooter extends React.Component { } } + /** + * Get the style of the footer based on the current mode. + * + * @returns {String} The style. + */ + style() { + return `document-footer ${MODES[this.state.mode]}`; + } + /** * Render the footer. * @@ -164,33 +170,30 @@ class DocumentFooter extends React.Component { render() { return (
-
+
{this.state.message}
-
+
); } - - /** - * Get the style of the footer based on the current mode. - * - * @returns {String} The style. - */ - style() { - return `document-footer ${MODES[this.state.mode]}`; - } } DocumentFooter.displayName = 'DocumentFooter'; +DocumentFooter.propTypes = { + doc: React.PropTypes.object.isRequired, + actions: React.PropTypes.object.isRequired, + updateStore: React.PropTypes.object.isRequired +}; + module.exports = DocumentFooter; diff --git a/src/internal-packages/crud/lib/component/document-list.jsx b/src/internal-packages/crud/lib/component/document-list.jsx index 5547f1ce52c..cbc18989fc9 100644 --- a/src/internal-packages/crud/lib/component/document-list.jsx +++ b/src/internal-packages/crud/lib/component/document-list.jsx @@ -1,8 +1,5 @@ -'use strict'; - const _ = require('lodash'); const React = require('react'); -const ReactDOM = require('react-dom'); const app = require('ampersand-app'); const Action = require('hadron-action'); const ObjectID = require('bson').ObjectID; @@ -15,6 +12,8 @@ const InsertDocumentStore = require('../store/insert-document-store'); const InsertDocumentDialog = require('./insert-document-dialog'); const Actions = require('../actions'); +/* eslint no-return-assign:0 */ + /** * The full document list container class. */ @@ -31,13 +30,15 @@ const SCROLL_EVENT = 'scroll'; class DocumentList extends React.Component { /** - * Attach the scroll event to the parent container. + * The component constructor. + * + * @param {Object} props - The properties. */ - attachScrollEvent() { - this._node.parentNode.addEventListener( - SCROLL_EVENT, - this.handleScroll.bind(this) - ); + constructor(props) { + super(props); + this.loading = false; + this.samplingMessage = app.appRegistry.getComponent('Component::Query::SamplingMessage'); + this.state = { docs: [], nextSkip: 0, namespace: NamespaceStore.ns }; } /** @@ -51,6 +52,21 @@ class DocumentList extends React.Component { this.unsibscribeInsert = InsertDocumentStore.listen(this.handleInsert.bind(this)); } + /** + * Determine if the component should update. + * + * @param {Object} nextProps - The next properties. + * @param {Object} nextState - The next state. + * + * @returns {Boolean} If the component should update. + */ + shouldComponentUpdate(nextProps, nextState) { + return (nextState.docs.length !== this.state.docs.length) || + (nextState.nextSkip !== this.state.nextSkip) || + (nextState.loadedCount !== this.state.loadedCount) || + (nextState.namespace !== this.state.namespace); + } + /** * Unsibscribe from the document list store when unmounting. */ @@ -62,15 +78,13 @@ class DocumentList extends React.Component { } /** - * The component constructor. - * - * @param {Object} props - The properties. + * Attach the scroll event to the parent container. */ - constructor(props) { - super(props); - this.loading = false; - this.samplingMessage = app.appRegistry.getComponent('Component::Query::SamplingMessage'); - this.state = { docs: [], nextSkip: 0, namespace: NamespaceStore.ns }; + attachScrollEvent() { + this._node.parentNode.addEventListener( + SCROLL_EVENT, + this.handleScroll.bind(this) + ); } /** @@ -115,7 +129,7 @@ class DocumentList extends React.Component { * @param {Object} id - The id of the removed document. */ handleRemove(id) { - var index = _.findIndex(this.state.docs, (component) => { + const index = _.findIndex(this.state.docs, (component) => { if (id instanceof ObjectID) { return id.equals(component.props.doc._id); } @@ -135,7 +149,7 @@ class DocumentList extends React.Component { * @param {Event} evt - The scroll event. */ handleScroll(evt) { - var container = evt.srcElement; + const container = evt.srcElement; if (container.scrollTop > (this._node.offsetHeight - this._scrollDelta())) { // If we are scrolling downwards, and have hit the distance to initiate a scroll // from the end of the list, we will fire the event to load more documents. @@ -154,9 +168,8 @@ class DocumentList extends React.Component { * Handle insert of a new document. * * @param {Boolean} success - If the insert was successful. - * @param {Object} object - The new document or error. */ - handleInsert(success, object) { + handleInsert(success) { if (success) { this.setState({ count: this.state.count + 1 }); this.loadMore(); @@ -174,40 +187,6 @@ class DocumentList extends React.Component { } } - /** - * Render the document list. - * - * @returns {React.Component} The document list. - */ - render() { - return ( -
- -
-
-
    this._node = c}> - {this.state.docs} - -
-
-
-
- ); - } - - /** - * Get the document list item components. - * - * @param {Array} docs - The raw documents. - * - * @return {Array} The document list item components. - */ - renderDocuments(docs) { - return _.map(docs, (doc) => { - return (); - }); - } - /** * Get the key for a doc. * @@ -216,20 +195,7 @@ class DocumentList extends React.Component { * @returns {String} The unique key. */ _key(doc) { - return `${NamespaceStore.ns}_${JSON.stringify(doc._id)}` - } - - /** - * Determine if the component should update. - * - * @param {Object} nextProps - The next properties. - * @param {Object} nextState - The next state. - */ - shouldComponentUpdate(nextProps, nextState) { - return (nextState.docs.length !== this.state.docs.length) || - (nextState.nextSkip !== this.state.nextSkip) || - (nextState.loadedCount !== this.state.loadedCount) || - (nextState.namespace !== this.state.namespace); + return `${NamespaceStore.ns}_${JSON.stringify(doc._id)}`; } /** @@ -244,6 +210,40 @@ class DocumentList extends React.Component { } return this.scrollDelta; } + + /** + * Get the document list item components. + * + * @param {Array} docs - The raw documents. + * + * @return {Array} The document list item components. + */ + renderDocuments(docs) { + return _.map(docs, (doc) => { + return (); + }); + } + + /** + * Render the document list. + * + * @returns {React.Component} The document list. + */ + render() { + return ( +
+ +
+
+
    this._node = c}> + {this.state.docs} + +
+
+
+
+ ); + } } DocumentList.displayName = 'DocumentList'; diff --git a/src/internal-packages/crud/lib/component/document.jsx b/src/internal-packages/crud/lib/component/document.jsx index 92eda762dee..04b0117a674 100644 --- a/src/internal-packages/crud/lib/component/document.jsx +++ b/src/internal-packages/crud/lib/component/document.jsx @@ -1,5 +1,3 @@ -'use strict'; - const app = require('ampersand-app'); const React = require('react'); const Reflux = require('reflux'); @@ -49,6 +47,22 @@ class Document extends React.Component { this.removeStore = this.createRemoveStore(this.actions); } + /** + * Subscribe to the update store on mount. + */ + componentDidMount() { + this.unsubscribeUpdate = this.updateStore.listen(this.handleStoreUpdate.bind(this)); + this.unsubscribeRemove = this.removeStore.listen(this.handleStoreRemove.bind(this)); + } + + /** + * Unsubscribe from the udpate store on unmount. + */ + componentWillUnmount() { + this.unsubscribeUpdate(); + this.unsubscribeRemove(); + } + /** * Create the scoped update store. * @@ -129,7 +143,7 @@ class Document extends React.Component { * Handle the result from the driver. * * @param {Error} error - The error. - * @param {Object} doc - The document. + * @param {Object} result - The document. * * @returns {Object} The trigger event. */ @@ -139,27 +153,11 @@ class Document extends React.Component { }); } - /** - * Subscribe to the update store on mount. - */ - componentDidMount() { - this.unsubscribeUpdate = this.updateStore.listen(this.handleStoreUpdate.bind(this)); - this.unsubscribeRemove = this.removeStore.listen(this.handleStoreRemove.bind(this)); - } - - /** - * Unsubscribe from the udpate store on unmount. - */ - componentWillUnmount() { - this.unsubscribeUpdate(); - this.unsubscribeRemove(); - } - /** * Handles a trigger from the store. * * @param {Boolean} success - If the update succeeded. - * @param {Error, Document} object - The error or document. + * @param {Object} object - The error or document. */ handleStoreUpdate(success, object) { if (this.state.editing) { @@ -173,7 +171,7 @@ class Document extends React.Component { * Handles a trigger from the store. * * @param {Boolean} success - If the update succeeded. - * @param {Error, Document} object - The error or document. + * @param {Object} object - The error or document. */ handleStoreRemove(success) { if (success) { @@ -207,7 +205,7 @@ class Document extends React.Component { * Handle the editing of the document. */ handleEdit() { - var doc = new HadronDocument(this.doc); + const doc = new HadronDocument(this.doc); doc.on(Element.Events.Added, this.handleModify.bind(this)); doc.on(Element.Events.Removed, this.handleModify.bind(this)); doc.on(HadronDocument.Events.Cancel, this.handleCancel.bind(this)); @@ -269,29 +267,23 @@ class Document extends React.Component { * @returns {Array} The editable elements. */ editableElements() { - var components = []; - for (let element of this.state.doc.elements) { - components.push() + const components = []; + for (const element of this.state.doc.elements) { + components.push(); } - components.push(); + components.push(); return components; } - /** - * Render a single document list item. - */ - render() { - return ( -
  • -
      -
      - {this.elements()} -
      - {this.renderActions()} -
    - {this.renderFooter()} -
  • - ); + style() { + let style = LIST_ITEM_CLASS; + if (this.state.editing) { + style = style.concat(' editing'); + } + if (this.state.deleting && !this.state.deleteFinished) { + style = style.concat(' deleting'); + } + return style; } /** @@ -324,7 +316,6 @@ class Document extends React.Component { actions={this.actions} /> ); } else if (this.state.deleting) { - console.log(this.state); return ( +
      +
      + {this.elements()} +
      + {this.renderActions()} +
    + {this.renderFooter()} + + ); } } Document.displayName = 'Document'; +Document.propTypes = { + doc: React.PropTypes.object.isRequired, + editable: React.PropTypes.bool +}; + module.exports = Document; diff --git a/src/internal-packages/crud/lib/component/editable-element.jsx b/src/internal-packages/crud/lib/component/editable-element.jsx index a1511e4ba30..05af300fc32 100644 --- a/src/internal-packages/crud/lib/component/editable-element.jsx +++ b/src/internal-packages/crud/lib/component/editable-element.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const Element = require('hadron-document').Element; const EditableKey = require('./editable-key'); @@ -25,11 +23,6 @@ const EDITED = 'edited'; */ const REMOVED = 'removed'; -/** - * The editing class constant. - */ -const EDITING = 'editing'; - /** * The caret for expanding elements. */ @@ -98,101 +91,21 @@ class EditableElement extends React.Component { this.element.on(Element.Events.Converted, this.handleConvert.bind(this)); } - /** - * Render a single editable element. - * - * @returns {React.Component} The element component. - */ - render() { - return this.element.elements ? this.renderExpandable() : this.renderNonExpandable(); - } - - /** - * Render a non-expandable element. - * - * @returns {Component} The component. - */ - renderNonExpandable() { - return ( -
  • - {this.renderAction()} -
    - - : - {this.renderValue()} - - -
  • - ); - } - - /** - * Render the value for the component. - * - * @returns {Component} The value component. - */ - renderValue() { - if (this.element.isValueEditable()) { - return (); - } - var props = { element: this.element }; - return React.createElement(this.valueComponent(this.element.currentType), props); - } - - /** - * Render an expandable element. - * - * @returns {Component} The component. - */ - renderExpandable() { - return ( -
  • -
    - {this.renderAction()} -
    -
    - - : -
    - {this.element.currentType} -
    -
    -
      - {this.elementComponents()} -
    -
  • - ); - } - /** * Get the components for the elements. * * @returns {Array} The components. */ elementComponents() { - var components = []; - var index = 0; - for (let element of this.element.elements) { + const components = []; + let index = 0; + for (const element of this.element.elements) { components.push(); index++; } return components; } - /** - * Get the revert or remove action. - * - * @returns {Component} The component. - */ - renderAction() { - if (this.element.isRevertable()) { - return (); - } else if (this.element.isNotActionable()) { - return (); - } - return (); - } - /** * Handle the addition of an element. */ @@ -241,7 +154,7 @@ class EditableElement extends React.Component { * @returns {String} The element style. */ style() { - var style = `${PROPERTY_CLASS} ${this.element.currentType.toLowerCase()}`; + let style = `${PROPERTY_CLASS} ${this.element.currentType.toLowerCase()}`; if (this.element.isAdded()) { style = style.concat(` ${ADDED}`); } else if (this.element.isEdited()) { @@ -261,13 +174,100 @@ class EditableElement extends React.Component { /** * Get the value component for the type. * + * @param {String} type - The type. + * * @returns {Component} The value component. */ valueComponent(type) { return require(VALUE_MAPPINGS[type] || './non-editable-value'); } + + /** + * Get the revert or remove action. + * + * @returns {Component} The component. + */ + renderAction() { + if (this.element.isRevertable()) { + return (); + } else if (this.element.isNotActionable()) { + return (); + } + return (); + } + + /** + * Render a non-expandable element. + * + * @returns {Component} The component. + */ + renderNonExpandable() { + return ( +
  • + {this.renderAction()} +
    + + : + {this.renderValue()} + + +
  • + ); + } + + /** + * Render the value for the component. + * + * @returns {Component} The value component. + */ + renderValue() { + if (this.element.isValueEditable()) { + return (); + } + const props = { element: this.element }; + return React.createElement(this.valueComponent(this.element.currentType), props); + } + + /** + * Render an expandable element. + * + * @returns {Component} The component. + */ + renderExpandable() { + return ( +
  • +
    + {this.renderAction()} +
    +
    + + : +
    + {this.element.currentType} +
    +
    +
      + {this.elementComponents()} +
    +
  • + ); + } + + /** + * Render a single editable element. + * + * @returns {React.Component} The element component. + */ + render() { + return this.element.elements ? this.renderExpandable() : this.renderNonExpandable(); + } } EditableElement.displayName = 'EditableElement'; +EditableElement.propTypes = { + element: React.PropTypes.object.isRequired, + index: React.PropTypes.number +}; + module.exports = EditableElement; diff --git a/src/internal-packages/crud/lib/component/editable-key.jsx b/src/internal-packages/crud/lib/component/editable-key.jsx index d0d7843dc71..91460dfeeb0 100644 --- a/src/internal-packages/crud/lib/component/editable-key.jsx +++ b/src/internal-packages/crud/lib/component/editable-key.jsx @@ -1,8 +1,8 @@ -'use strict'; - const React = require('react'); const inputSize = require('./utils').inputSize; +/* eslint no-return-assign:0 */ + /** * The editing class constant. */ @@ -54,54 +54,13 @@ class EditableKey extends React.Component { } } - /** - * Render a single editable key. - * - * @returns {React.Component} The element component. - */ - render() { - return ( - this._node = c} - size={inputSize(this.renderValue())} - tabIndex={this.isEditable() ? 0 : -1} - onBlur={this.handleBlur.bind(this)} - onFocus={this.handleFocus.bind(this)} - onChange={this.handleChange.bind(this)} - onKeyDown={this.handleKeyDown.bind(this)} - onKeyUp={this.handleKeyUp.bind(this)} - value={this.renderValue()} - title={this.renderTitle()} /> - ); - } - - /** - * Render the value of the key. - */ - renderValue() { - return this.element.parent.currentType === 'Array' ? this.props.index : this.element.currentKey; - } - - /** - * Render the title. - * - * @returns {String} The title. - */ - renderTitle() { - if (this.state.duplicate) { - return `Duplicate key: '${this.element.currentKey}' - this will overwrite previous values.` - } - return this.element.currentKey; - } /** * When hitting a key on the last element some special things may happen. * * @param {Event} evt - The event. */ handleKeyDown(evt) { - var value = evt.target.value; + const value = evt.target.value; if (evt.keyCode === ESC) { if (value.length === 0) { this.element.remove(); @@ -113,10 +72,12 @@ class EditableKey extends React.Component { /** * If they key is a colon, tab to the next input. + * + * @param {Object} evt - The event. */ handleKeyUp(evt) { if (evt.keyCode === COLON) { - var value = evt.target.value; + const value = evt.target.value; if (value !== ':') { this.element.rename(value.replace(':', '')); evt.target.value = ''; @@ -131,7 +92,7 @@ class EditableKey extends React.Component { * @param {Event} evt - The event. */ handleChange(evt) { - var value = evt.target.value; + const value = evt.target.value; this._node.size = inputSize(value); if (this.isEditable()) { if (this.element.isDuplicateKey(value)) { @@ -193,7 +154,7 @@ class EditableKey extends React.Component { * @returns {String} The key style. */ style() { - var style = KEY_CLASS; + let style = KEY_CLASS; if (this.state.editing) { style = style.concat(` ${EDITING}`); } @@ -202,8 +163,57 @@ class EditableKey extends React.Component { } return style; } + + /** + * Render the value of the key. + * + * @returns {String} The value for the key. + */ + renderValue() { + return this.element.parent.currentType === 'Array' ? this.props.index : this.element.currentKey; + } + + /** + * Render the title. + * + * @returns {String} The title. + */ + renderTitle() { + if (this.state.duplicate) { + return `Duplicate key: '${this.element.currentKey}' - this will overwrite previous values.`; + } + return this.element.currentKey; + } + + /** + * Render a single editable key. + * + * @returns {React.Component} The element component. + */ + render() { + return ( + this._node = c} + size={inputSize(this.renderValue())} + tabIndex={this.isEditable() ? 0 : -1} + onBlur={this.handleBlur.bind(this)} + onFocus={this.handleFocus.bind(this)} + onChange={this.handleChange.bind(this)} + onKeyDown={this.handleKeyDown.bind(this)} + onKeyUp={this.handleKeyUp.bind(this)} + value={this.renderValue()} + title={this.renderTitle()} /> + ); + } } EditableKey.displayName = 'EditableKey'; +EditableKey.propTypes = { + element: React.PropTypes.object.isRequired, + index: React.PropTypes.number +}; + module.exports = EditableKey; diff --git a/src/internal-packages/crud/lib/component/editable-value.jsx b/src/internal-packages/crud/lib/component/editable-value.jsx index 4363f600e73..f83f351afb2 100644 --- a/src/internal-packages/crud/lib/component/editable-value.jsx +++ b/src/internal-packages/crud/lib/component/editable-value.jsx @@ -1,11 +1,10 @@ -'use strict'; - const _ = require('lodash'); const React = require('react'); const inputSize = require('./utils').inputSize; -const ElementFactory = require('hadron-app-registry').ElementFactory; const TypeChecker = require('hadron-type-checker'); +/* eslint no-return-assign:0 */ + /** * Escape key code. */ @@ -58,27 +57,6 @@ class EditableValue extends React.Component { this.element.parent.currentType === 'Array'; } - /** - * Render a single editable value. - * - * @returns {React.Component} The element component. - */ - render() { - return ( - this._node = c} - type='text' - size={inputSize(this.element.currentValue)} - className={this.style()} - onBlur={this.handleBlur.bind(this)} - onFocus={this.handleFocus.bind(this)} - onChange={this.handleChange.bind(this)} - onKeyDown={this.handleKeyDown.bind(this)} - onPaste={this.handlePaste.bind(this)} - value={this.element.currentValue} /> - ); - } - /** * When hitting a key on the last element some special things may happen. * @@ -98,7 +76,7 @@ class EditableValue extends React.Component { evt.stopPropagation(); } } else if (evt.keyCode === ESC) { - var value = evt.target.value; + const value = evt.target.value; if (value.length === 0 && this.element.currentKey.length === 0) { this.element.remove(); } else { @@ -131,14 +109,14 @@ class EditableValue extends React.Component { * @param {Event} evt - The event. */ handleChange(evt) { - var value = evt.target.value; + const value = evt.target.value; if (this._pasting) { this.element.bulkEdit(value); this._pasting = false; } else { this._node.size = inputSize(value); - var currentType = this.element.currentType; - var castableTypes = TypeChecker.castableTypes(value); + const currentType = this.element.currentType; + const castableTypes = TypeChecker.castableTypes(value); if (_.includes(castableTypes, currentType)) { this.element.edit(TypeChecker.cast(value, currentType)); } else { @@ -169,8 +147,33 @@ class EditableValue extends React.Component { style() { return this.state.editing ? `${VALUE_CLASS} ${EDITING}` : VALUE_CLASS; } + + /** + * Render a single editable value. + * + * @returns {React.Component} The element component. + */ + render() { + return ( + this._node = c} + type="text" + size={inputSize(this.element.currentValue)} + className={this.style()} + onBlur={this.handleBlur.bind(this)} + onFocus={this.handleFocus.bind(this)} + onChange={this.handleChange.bind(this)} + onKeyDown={this.handleKeyDown.bind(this)} + onPaste={this.handlePaste.bind(this)} + value={this.element.currentValue} /> + ); + } } EditableValue.displayName = 'EditableValue'; +EditableValue.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = EditableValue; diff --git a/src/internal-packages/crud/lib/component/hotspot.jsx b/src/internal-packages/crud/lib/component/hotspot.jsx index a1b27f82cef..dade7f29413 100644 --- a/src/internal-packages/crud/lib/component/hotspot.jsx +++ b/src/internal-packages/crud/lib/component/hotspot.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -17,6 +15,15 @@ class Hotspot extends React.Component { this.element = props.element; } + /** + * Never needs to re-render. + * + * @returns {Boolean} false. + */ + shouldComponentUpdate() { + return false; + } + /** * When clicking on a hotspot we append or remove on the parent. */ @@ -67,18 +74,15 @@ class Hotspot extends React.Component { */ render() { return ( -
    +
    ); } - - /** - * Never needs to re-render. - */ - shouldComponentUpdate() { - return false; - } } Hotspot.displayName = 'Hotspot'; +Hotspot.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = Hotspot; diff --git a/src/internal-packages/crud/lib/component/insert-document-dialog.jsx b/src/internal-packages/crud/lib/component/insert-document-dialog.jsx index d26113f7c4d..55133d70cc0 100644 --- a/src/internal-packages/crud/lib/component/insert-document-dialog.jsx +++ b/src/internal-packages/crud/lib/component/insert-document-dialog.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const Modal = require('react-bootstrap').Modal; const OpenInsertDocumentDialogStore = require('../store/open-insert-document-dialog-store'); @@ -60,9 +58,8 @@ class InsertDocumentDialog extends React.Component { * Handles completion of the document insert. * * @param {Boolean} success - If the operation succeeded. - * @param {Object} doc - The document or error. */ - handleDocumentInsert(success, doc) { + handleDocumentInsert(success) { if (success) { this.setState({ open: false }); } @@ -82,7 +79,7 @@ class InsertDocumentDialog extends React.Component { */ render() { return ( - + Insert Document @@ -94,12 +91,12 @@ class InsertDocumentDialog extends React.Component { diff --git a/src/internal-packages/crud/lib/component/insert-document-footer.jsx b/src/internal-packages/crud/lib/component/insert-document-footer.jsx index 96fbde6d626..93085dfaa2d 100644 --- a/src/internal-packages/crud/lib/component/insert-document-footer.jsx +++ b/src/internal-packages/crud/lib/component/insert-document-footer.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const InsertDocumentStore = require('../store/insert-document-store'); const Actions = require('../actions'); @@ -13,7 +11,7 @@ const MODES = { 'Progress': 'in-progress', 'Error': 'error', 'Modifying': 'modifying' -} +}; /** * Component for the insert document footer. @@ -82,7 +80,7 @@ class InsertDocumentFooter extends React.Component { render() { return (
    -
    +
    {this.state.message}
    diff --git a/src/internal-packages/crud/lib/component/insert-document.jsx b/src/internal-packages/crud/lib/component/insert-document.jsx index aabd86b0a11..2c5909922a1 100644 --- a/src/internal-packages/crud/lib/component/insert-document.jsx +++ b/src/internal-packages/crud/lib/component/insert-document.jsx @@ -1,6 +1,3 @@ -'use strict'; - -const _ = require('lodash'); const React = require('react'); const Element = require('hadron-document').Element; const EditableElement = require('./editable-element'); @@ -45,15 +42,31 @@ class InsertDocument extends React.Component { this.setState({}); } + /** + * Get the editable elements. + * + * @returns {Array} The editable elements. + */ + renderElements() { + const components = []; + for (const element of this.doc.elements) { + components.push(); + } + components.push(); + return components; + } + /** * Render a single document list item. + * + * @returns {React.Component} The component. */ render() { return (
      1. -
        +
        {this.renderElements(this.doc)}
      @@ -61,22 +74,12 @@ class InsertDocument extends React.Component {
    ); } - - /** - * Get the editable elements. - * - * @returns {Array} The editable elements. - */ - renderElements() { - var components = []; - for (let element of this.doc.elements) { - components.push() - } - components.push(); - return components; - } } InsertDocument.displayName = 'InsertDocument'; +InsertDocument.propTypes = { + doc: React.PropTypes.object +}; + module.exports = InsertDocument; diff --git a/src/internal-packages/crud/lib/component/max-key-value.jsx b/src/internal-packages/crud/lib/component/max-key-value.jsx index b0468c82a42..390ee500252 100644 --- a/src/internal-packages/crud/lib/component/max-key-value.jsx +++ b/src/internal-packages/crud/lib/component/max-key-value.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -12,16 +10,6 @@ const VALUE_CLASS = 'document-property-value'; */ class MaxKeyValue extends React.Component { - /** - * The component constructor. - * - * @param {Object} props - The properties. - */ - constructor(props) { - super(props); - this.value = props.element.currentValue; - } - /** * Render a single max key value. * diff --git a/src/internal-packages/crud/lib/component/min-key-value.jsx b/src/internal-packages/crud/lib/component/min-key-value.jsx index 9751e98281f..91480b54908 100644 --- a/src/internal-packages/crud/lib/component/min-key-value.jsx +++ b/src/internal-packages/crud/lib/component/min-key-value.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -12,16 +10,6 @@ const VALUE_CLASS = 'document-property-value'; */ class MinKeyValue extends React.Component { - /** - * The component constructor. - * - * @param {Object} props - The properties. - */ - constructor(props) { - super(props); - this.value = props.element.currentValue; - } - /** * Render a single min key value. * diff --git a/src/internal-packages/crud/lib/component/no-action.jsx b/src/internal-packages/crud/lib/component/no-action.jsx index b18dccf0bc7..4cc540cf930 100644 --- a/src/internal-packages/crud/lib/component/no-action.jsx +++ b/src/internal-packages/crud/lib/component/no-action.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -12,16 +10,6 @@ const ACTIONS = 'actions'; */ class NoAction extends React.Component { - /** - * The component constructor. - * - * @param {Object} props - The properties. - */ - constructor(props) { - super(props); - this.element = props.element; - } - /** * Render a single editable key. * diff --git a/src/internal-packages/crud/lib/component/non-editable-value.jsx b/src/internal-packages/crud/lib/component/non-editable-value.jsx index c1d3a91e3d3..b94979e63c2 100644 --- a/src/internal-packages/crud/lib/component/non-editable-value.jsx +++ b/src/internal-packages/crud/lib/component/non-editable-value.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -19,7 +17,7 @@ class NonEditableValue extends React.Component { */ constructor(props) { super(props); - this.value = props.element.currentValue; + this.element = props.element; } /** @@ -30,7 +28,7 @@ class NonEditableValue extends React.Component { render() { return (
    - {String(this.value)} + {String(this.element.currentValue)}
    ); } @@ -38,4 +36,8 @@ class NonEditableValue extends React.Component { NonEditableValue.displayName = 'NonEditableValue'; +NonEditableValue.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = NonEditableValue; diff --git a/src/internal-packages/crud/lib/component/objectid-value.jsx b/src/internal-packages/crud/lib/component/objectid-value.jsx index 90d7a77cbc6..b20ab111a89 100644 --- a/src/internal-packages/crud/lib/component/objectid-value.jsx +++ b/src/internal-packages/crud/lib/component/objectid-value.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -19,7 +17,7 @@ class ObjectIDValue extends React.Component { */ constructor(props) { super(props); - this.value = props.element.currentValue; + this.element = props.element; } /** @@ -30,7 +28,7 @@ class ObjectIDValue extends React.Component { render() { return (
    - {String(this.value)} + {String(this.element.currentValue)}
    ); } @@ -38,4 +36,8 @@ class ObjectIDValue extends React.Component { ObjectIDValue.displayName = 'ObjectIDValue'; +ObjectIDValue.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = ObjectIDValue; diff --git a/src/internal-packages/crud/lib/component/remove-action.jsx b/src/internal-packages/crud/lib/component/remove-action.jsx index f3d62b09f6a..f1edf6a4cf3 100644 --- a/src/internal-packages/crud/lib/component/remove-action.jsx +++ b/src/internal-packages/crud/lib/component/remove-action.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -22,6 +20,13 @@ class RemoveAction extends React.Component { this.element = props.element; } + /** + * Remove the change. + */ + handleClick() { + this.element.remove(); + } + /** * Render a single editable key. * @@ -30,19 +35,16 @@ class RemoveAction extends React.Component { render() { return (
    - +
    ); } - - /** - * Remove the change. - */ - handleClick() { - this.element.remove(); - } } RemoveAction.displayName = 'RemoveAction'; +RemoveAction.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = RemoveAction; diff --git a/src/internal-packages/crud/lib/component/remove-document-footer.jsx b/src/internal-packages/crud/lib/component/remove-document-footer.jsx index 9e7611c0c9f..a01be126dff 100644 --- a/src/internal-packages/crud/lib/component/remove-document-footer.jsx +++ b/src/internal-packages/crud/lib/component/remove-document-footer.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const TextButton = require('hadron-app-registry').TextButton; @@ -31,12 +29,7 @@ const MODES = { 'Success': 'success', 'Error': 'error', 'Deleting': 'error' -} - -/** - * The empty message. - */ -const EMPTY = ''; +}; /** * The modified message. @@ -113,7 +106,7 @@ class RemoveDocumentFooter extends React.Component { * Handles a trigger from the store. * * @param {Boolean} success - If the delete succeeded. - * @param {Error, Document} object - The error or document. + * @param {Object} object - The error or document. */ handleStoreRemove(success, object) { if (success) { @@ -123,6 +116,15 @@ class RemoveDocumentFooter extends React.Component { } } + /** + * Get the style of the footer based on the current mode. + * + * @returns {String} The style. + */ + style() { + return `document-footer ${MODES[this.state.mode]}`; + } + /** * Render the footer. * @@ -131,33 +133,31 @@ class RemoveDocumentFooter extends React.Component { render() { return (
    -
    +
    {this.state.message}
    -
    +
    ); } - - /** - * Get the style of the footer based on the current mode. - * - * @returns {String} The style. - */ - style() { - return `document-footer ${MODES[this.state.mode]}`; - } } RemoveDocumentFooter.displayName = 'RemoveDocumentFooter'; +RemoveDocumentFooter.propTypes = { + doc: React.PropTypes.object.isRequired, + actions: React.PropTypes.object.isRequired, + removeStore: React.PropTypes.object.isRequired, + cancelHandler: React.PropTypes.func.isRequired +}; + module.exports = RemoveDocumentFooter; diff --git a/src/internal-packages/crud/lib/component/revert-action.jsx b/src/internal-packages/crud/lib/component/revert-action.jsx index 9313e9dc109..445157ed4d2 100644 --- a/src/internal-packages/crud/lib/component/revert-action.jsx +++ b/src/internal-packages/crud/lib/component/revert-action.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -22,6 +20,13 @@ class RevertAction extends React.Component { this.element = props.element; } + /** + * Revert the change. + */ + handleClick() { + this.element.revert(); + } + /** * Render a single editable key. * @@ -30,19 +35,16 @@ class RevertAction extends React.Component { render() { return (
    - +
    ); } - - /** - * Revert the change. - */ - handleClick() { - this.element.revert(); - } } RevertAction.displayName = 'RevertAction'; +RevertAction.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = RevertAction; diff --git a/src/internal-packages/crud/lib/component/timestamp-value.jsx b/src/internal-packages/crud/lib/component/timestamp-value.jsx index 54a953246d0..def050eaceb 100644 --- a/src/internal-packages/crud/lib/component/timestamp-value.jsx +++ b/src/internal-packages/crud/lib/component/timestamp-value.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -19,7 +17,7 @@ class TimestampValue extends React.Component { */ constructor(props) { super(props); - this.value = props.element.currentValue; + this.element = props.element; } /** @@ -30,7 +28,7 @@ class TimestampValue extends React.Component { render() { return (
    - {String(this.value)} + {String(this.element.currentValue)}
    ); } @@ -38,4 +36,8 @@ class TimestampValue extends React.Component { TimestampValue.displayName = 'TimestampValue'; +TimestampValue.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = TimestampValue; diff --git a/src/internal-packages/crud/lib/component/types.jsx b/src/internal-packages/crud/lib/component/types.jsx index 5ca2427b3ad..07066595c20 100644 --- a/src/internal-packages/crud/lib/component/types.jsx +++ b/src/internal-packages/crud/lib/component/types.jsx @@ -1,7 +1,5 @@ -'use strict'; - +const _ = require('lodash'); const React = require('react'); -const Element = require('hadron-document').Element; const TypeChecker = require('hadron-type-checker'); require('bootstrap/js/dropdown'); @@ -27,7 +25,7 @@ class Types extends React.Component { * @param {Event} evt - The event. */ handleTypeChange(evt) { - var newType = evt.target.innerText; + const newType = evt.target.innerText; if (newType === 'Object') { this.element.edit('{'); this.element.next(); @@ -41,12 +39,20 @@ class Types extends React.Component { } /** - * Render a type list. + * Get the castable value for this value. * - * @returns {React.Component} The element component. + * @returns {Object} The cast value. */ - render() { - return this.isTypeChangeable() ? this.renderDropdown() : this.renderLabel(); + castableValue() { + if (this.element.elements) { + if (this.element.currentType === 'Object') { + return {}; + } + return _.map(this.element.elements, (element) => { + return element.currentValue; + }); + } + return this.element.currentValue; } /** @@ -56,19 +62,19 @@ class Types extends React.Component { */ renderDropdown() { return ( -
    +
    -
      +
        {this.renderTypes()}
    @@ -82,8 +88,8 @@ class Types extends React.Component { */ renderLabel() { return ( -
    - {this.element.currentType} +
    + {this.element.currentType}
    ); } @@ -104,23 +110,19 @@ class Types extends React.Component { } /** - * Get the castable value for this value. + * Render a type list. * - * @returns {Object} The cast value. + * @returns {React.Component} The element component. */ - castableValue() { - if (this.element.elements) { - if (this.element.currentType === 'Object') { - return {}; - } - return _.map(this.element.elements, (element) => { - return element.currentValue; - }); - } - return this.element.currentValue; + render() { + return this.isTypeChangeable() ? this.renderDropdown() : this.renderLabel(); } } Types.displayName = 'Types'; +Types.propTypes = { + element: React.PropTypes.object.isRequired +}; + module.exports = Types; diff --git a/src/internal-packages/crud/lib/component/utils.js b/src/internal-packages/crud/lib/component/utils.js index f78ec2153cf..e8879be576f 100644 --- a/src/internal-packages/crud/lib/component/utils.js +++ b/src/internal-packages/crud/lib/component/utils.js @@ -1,5 +1,3 @@ -'use strict'; - /** * Get the size value for an input field when editing. * @@ -8,7 +6,7 @@ * @returns {Integer} The size. */ function inputSize(value) { - var length = String(value).length; + const length = String(value).length; return length === 0 ? 1 : length; } diff --git a/src/internal-packages/crud/lib/store/insert-document-store.jsx b/src/internal-packages/crud/lib/store/insert-document-store.jsx index 770f52afa22..8706bb7e2ec 100644 --- a/src/internal-packages/crud/lib/store/insert-document-store.jsx +++ b/src/internal-packages/crud/lib/store/insert-document-store.jsx @@ -1,5 +1,3 @@ -'use strict'; - const Reflux = require('reflux'); const app = require('ampersand-app'); const NamespaceStore = require('hadron-reflux-store').NamespaceStore; diff --git a/src/internal-packages/crud/lib/store/load-more-documents-store.js b/src/internal-packages/crud/lib/store/load-more-documents-store.js index 22c955b50c1..bb57083d586 100644 --- a/src/internal-packages/crud/lib/store/load-more-documents-store.js +++ b/src/internal-packages/crud/lib/store/load-more-documents-store.js @@ -1,5 +1,3 @@ -'use strict'; - const Reflux = require('reflux'); const app = require('ampersand-app'); const NamespaceStore = require('hadron-reflux-store').NamespaceStore; @@ -23,10 +21,12 @@ const LoadMoreDocumentsStore = Reflux.createStore({ * @param {Integer} skip - The number of documents to skip. */ loadMoreDocuments: function(skip) { - var filter = app.queryOptions.query.serialize(); - var options = { skip: skip, limit: 20, sort: [[ '_id', 1 ]] }; + const filter = app.queryOptions.query.serialize(); + const options = { skip: skip, limit: 20, sort: [[ '_id', 1 ]] }; app.dataService.find(NamespaceStore.ns, filter, options, (error, documents) => { - this.trigger(documents); + if (!error) { + this.trigger(documents); + } }); } }); diff --git a/src/internal-packages/crud/lib/store/open-insert-document-dialog-store.js b/src/internal-packages/crud/lib/store/open-insert-document-dialog-store.js index d44e82d98c1..5e883bcd061 100644 --- a/src/internal-packages/crud/lib/store/open-insert-document-dialog-store.js +++ b/src/internal-packages/crud/lib/store/open-insert-document-dialog-store.js @@ -1,5 +1,3 @@ -'use strict'; - const Reflux = require('reflux'); const Actions = require('../actions'); const HadronDocument = require('hadron-document'); @@ -23,9 +21,9 @@ const OpenInsertDocumentDialogStore = Reflux.createStore({ * @param {Booelan} clone - If the operation is a clone. */ openInsertDocumentDialog: function(doc, clone) { - var hadronDoc = new HadronDocument(doc, true); + const hadronDoc = new HadronDocument(doc, true); if (clone) { - var firstElement = hadronDoc.elements.firstElement; + const firstElement = hadronDoc.elements.firstElement; // We need to remove the _id or we will get an duplicate key error on // insert, and we currently do not allow editing of the _id field. if (firstElement.currentKey === '_id') { diff --git a/src/internal-packages/crud/lib/store/remove-document-store.js b/src/internal-packages/crud/lib/store/remove-document-store.js index c930a6c7daf..7e6ac453351 100644 --- a/src/internal-packages/crud/lib/store/remove-document-store.js +++ b/src/internal-packages/crud/lib/store/remove-document-store.js @@ -1,5 +1,3 @@ -'use strict'; - const Reflux = require('reflux'); const Actions = require('../actions'); @@ -22,7 +20,7 @@ const RemoveDocumentStore = Reflux.createStore({ */ remove: function(id) { this.trigger(id); - }, + } }); module.exports = RemoveDocumentStore; diff --git a/src/internal-packages/crud/lib/store/reset-document-list-store.js b/src/internal-packages/crud/lib/store/reset-document-list-store.js index a84922bd9ee..0e200d5fc9c 100644 --- a/src/internal-packages/crud/lib/store/reset-document-list-store.js +++ b/src/internal-packages/crud/lib/store/reset-document-list-store.js @@ -1,10 +1,7 @@ -'use strict'; - const Reflux = require('reflux'); const app = require('ampersand-app'); const NamespaceStore = require('hadron-reflux-store').NamespaceStore; const Action = require('hadron-action'); -const metrics = require('mongodb-js-metrics')(); /** * The reflux store for resetting the document list. @@ -26,13 +23,17 @@ const ResetDocumentListStore = Reflux.createStore({ reset: function(filter) { if (NamespaceStore.ns) { app.dataService.count(NamespaceStore.ns, filter, {}, (err, count) => { - var options = { limit: 20, sort: [[ '_id', 1 ]] }; - app.dataService.find(NamespaceStore.ns, filter, options, (error, documents) => { - this.trigger(documents, count); - }); + if (!err) { + const options = { limit: 20, sort: [[ '_id', 1 ]] }; + app.dataService.find(NamespaceStore.ns, filter, options, (error, documents) => { + if (!error) { + this.trigger(documents, count); + } + }); + } }); } - }, + } }); module.exports = ResetDocumentListStore; diff --git a/src/internal-packages/indexes/index.js b/src/internal-packages/indexes/index.js index 54410a69239..cc670740633 100644 --- a/src/internal-packages/indexes/index.js +++ b/src/internal-packages/indexes/index.js @@ -1,5 +1,3 @@ -'use strict'; - const app = require('ampersand-app'); const Indexes = require('./lib/component/indexes'); const NameColumn = require('./lib/component/name-column'); diff --git a/src/internal-packages/indexes/lib/action/index-actions.js b/src/internal-packages/indexes/lib/action/index-actions.js index a2df0ae8c51..a287df528e7 100644 --- a/src/internal-packages/indexes/lib/action/index-actions.js +++ b/src/internal-packages/indexes/lib/action/index-actions.js @@ -1,5 +1,3 @@ -'use strict'; - const Reflux = require('reflux'); const IndexActions = Reflux.createActions([ 'loadIndexes', 'sortIndexes' ]); diff --git a/src/internal-packages/indexes/lib/component/index-header-column.jsx b/src/internal-packages/indexes/lib/component/index-header-column.jsx index 9948a063e3a..be2548fe934 100644 --- a/src/internal-packages/indexes/lib/component/index-header-column.jsx +++ b/src/internal-packages/indexes/lib/component/index-header-column.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const Action = require('../action/index-actions'); const SortIndexesStore = require('../store/sort-indexes-store'); @@ -40,25 +38,13 @@ class IndexHeaderColumn extends React.Component { * initial load of indexes. * * @param {Array} indexes - The indexes. + * @param {String} sortOrder - The sort order. + * @param {String} sortField - The sort field. */ handleIndexChange(indexes, sortOrder, sortField) { this.setState({ sortOrder: sortOrder, sortField: sortField }); } - /** - * Render the index header column. - * - * @returns {React.Component} The index header column. - */ - render() { - return ( - - {this.props.name} - - - ); - } - /** * Handle the index sort click. * @@ -73,12 +59,28 @@ class IndexHeaderColumn extends React.Component { _renderClassName() { return this.state.sortField === this.props.name ? 'active' : ''; } + + /** + * Render the index header column. + * + * @returns {React.Component} The index header column. + */ + render() { + return ( + + {this.props.name} + + + ); + } } IndexHeaderColumn.displayName = 'IndexHeaderColumn'; IndexHeaderColumn.propTypes = { - sortOrder: React.PropTypes.string.isRequired + sortOrder: React.PropTypes.string.isRequired, + hook: React.PropTypes.string.isRequired, + name: React.PropTypes.string.isRequired }; module.exports = IndexHeaderColumn; diff --git a/src/internal-packages/indexes/lib/component/index-header.jsx b/src/internal-packages/indexes/lib/component/index-header.jsx index e65d73a7085..4750ca28b2e 100644 --- a/src/internal-packages/indexes/lib/component/index-header.jsx +++ b/src/internal-packages/indexes/lib/component/index-header.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const IndexHeaderColumn = require('./index-header-column'); const SortIndexesStore = require('../store/sort-indexes-store'); @@ -40,6 +38,7 @@ class IndexHeader extends React.Component { * initial load of indexes. * * @param {Array} indexes - The indexes. + * @param {String} sortOrder - The sort order. */ handleIndexChange(indexes, sortOrder) { this.setState({ sortOrder: sortOrder }); @@ -54,11 +53,11 @@ class IndexHeader extends React.Component { return ( - - - - - + + + + + ); diff --git a/src/internal-packages/indexes/lib/component/index-list.jsx b/src/internal-packages/indexes/lib/component/index-list.jsx index 77bbdef45c1..cc5cf31f12f 100644 --- a/src/internal-packages/indexes/lib/component/index-list.jsx +++ b/src/internal-packages/indexes/lib/component/index-list.jsx @@ -1,5 +1,3 @@ -'use strict'; - const _ = require('lodash'); const React = require('react'); const Index = require('./index'); @@ -10,6 +8,16 @@ const SortIndexesStore = require('../store/sort-indexes-store'); */ class IndexList extends React.Component { + /** + * The component constructor. + * + * @param {Object} props - The properties. + */ + constructor(props) { + super(props); + this.state = { indexes: [] }; + } + /** * Subscribe on mount. */ @@ -24,23 +32,13 @@ class IndexList extends React.Component { this.unsubscribeSort(); } - /** - * The component constructor. - * - * @param {Object} props - The properties. - */ - constructor(props) { - super(props); - this.state = { indexes: [] }; - } - /** * Handles the sort indexes store triggering with indexes in a new order or the * initial load of indexes. * * @param {Array} indexes - The indexes. */ - handleIndexChange(indexes, sortOrder) { + handleIndexChange(indexes) { this.setState({ indexes: indexes }); } @@ -50,11 +48,11 @@ class IndexList extends React.Component { * @returns {React.Component} The index list. */ render() { - let indexes = _.map(this.state.indexes, (model) => { + const indexes = _.map(this.state.indexes, (model) => { return (); }); return ( - + {indexes} ); diff --git a/src/internal-packages/indexes/lib/component/index.jsx b/src/internal-packages/indexes/lib/component/index.jsx index 266b7b438cc..1477fc15e41 100644 --- a/src/internal-packages/indexes/lib/component/index.jsx +++ b/src/internal-packages/indexes/lib/component/index.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const NameColumn = require('./name-column'); const TypeColumn = require('./type-column'); diff --git a/src/internal-packages/indexes/lib/component/indexes.jsx b/src/internal-packages/indexes/lib/component/indexes.jsx index f551e1972c7..a5ca18d3c6a 100644 --- a/src/internal-packages/indexes/lib/component/indexes.jsx +++ b/src/internal-packages/indexes/lib/component/indexes.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const IndexHeader = require('./index-header'); const IndexList = require('./index-list'); @@ -9,15 +7,6 @@ const IndexList = require('./index-list'); */ class Indexes extends React.Component { - /** - * The component constructor. - * - * @param {Object} props - The properties. - */ - constructor(props) { - super(props); - } - /** * Render the indexes. * @@ -26,9 +15,9 @@ class Indexes extends React.Component { render() { return (
    -
    -
    -
    +
    +
    +
    diff --git a/src/internal-packages/indexes/lib/component/name-column.jsx b/src/internal-packages/indexes/lib/component/name-column.jsx index 33ccb2fc722..7cdd842500d 100644 --- a/src/internal-packages/indexes/lib/component/name-column.jsx +++ b/src/internal-packages/indexes/lib/component/name-column.jsx @@ -1,5 +1,3 @@ -'use strict'; - const _ = require('lodash'); const React = require('react'); @@ -8,38 +6,6 @@ const React = require('react'); */ class NameColumn extends React.Component { - /** - * The component constructor. - * - * @param {Object} props - The properties. - */ - constructor(props) { - super(props); - } - - /** - * Render the name column. - * - * @returns {React.Component} The name column. - */ - render() { - let fields = _.map(this.props.index.fields.serialize(), (field) => { - return this.renderField(field); - }); - return ( - - ); - } - /** * Render the direction of the index field. * @@ -50,23 +16,22 @@ class NameColumn extends React.Component { renderDirection(field) { if (field.value === 1) { return ( - - + + ); } else if (field.value === -1) { return ( - - - - ); - } else { - return ( - - {field.value} + + ); } + return ( + + {field.value} + + ); } /** @@ -78,14 +43,37 @@ class NameColumn extends React.Component { */ renderField(field) { return ( - - + + {field.field} {this.renderDirection(field)} ); } + + /** + * Render the name column. + * + * @returns {React.Component} The name column. + */ + render() { + const fields = _.map(this.props.index.fields.serialize(), (field) => { + return this.renderField(field); + }); + return ( + + ); + } } NameColumn.displayName = 'NameColumn'; diff --git a/src/internal-packages/indexes/lib/component/property-column.jsx b/src/internal-packages/indexes/lib/component/property-column.jsx index d9935ffeb58..c939a47a2f0 100644 --- a/src/internal-packages/indexes/lib/component/property-column.jsx +++ b/src/internal-packages/indexes/lib/component/property-column.jsx @@ -1,5 +1,3 @@ -'use strict'; - const _ = require('lodash'); const format = require('util').format; const React = require('react'); @@ -10,23 +8,22 @@ const openIndexHelpLink = require('../index-link-helper'); */ class PropertyColumn extends React.Component { - /** - * Render the property column. - * - * @returns {React.Component} The property column. - */ - render() { - let properties = _.map(this.props.index.properties, (prop) => { - return this.renderProperty(prop); - }); - return ( - - ); + _clickHelp(evt) { + evt.preventDefault(); + evt.stopPropagation(); + openIndexHelpLink(evt.target.parentNode.innerText); + } + + _link() { + return (); + } + + _partialTooltip() { + return format('partialFilterExpression: %j', this.props.index.extra.partialFilterExpression); + } + + _ttlTooltip() { + return format('expireAfterSeconds: %d', this.props.index.extra.expireAfterSeconds); } /** @@ -37,7 +34,7 @@ class PropertyColumn extends React.Component { renderCardinality() { if (this.props.index.cardinality === 'compound') { return ( -
    +
    {this.props.index.cardinality} {this._link()}
    @@ -55,45 +52,46 @@ class PropertyColumn extends React.Component { renderProperty(prop) { if (prop === 'ttl') { return ( -
    +
    {prop} {this._link()}
    ); } else if (prop === 'partial') { return ( -
    - {prop} - {this._link()} -
    - ); - } else { - return ( -
    +
    {prop} {this._link()}
    ); } + return ( +
    + {prop} + {this._link()} +
    + ); } - _clickHelp(evt) { - evt.preventDefault(); - evt.stopPropagation(); - openIndexHelpLink(evt.target.parentNode.innerText); - } - - _link() { - return (); - } - - _partialTooltip() { - return format('partialFilterExpression: %j', this.props.index.extra.partialFilterExpression); + /** + * Render the property column. + * + * @returns {React.Component} The property column. + */ + render() { + const properties = _.map(this.props.index.properties, (prop) => { + return this.renderProperty(prop); + }); + return ( +
    + ); } - _ttlTooltip() { - return format('expireAfterSeconds: %d', this.props.index.extra.expireAfterSeconds); - } } PropertyColumn.displayProperty = 'PropertyColumn'; diff --git a/src/internal-packages/indexes/lib/component/size-column.jsx b/src/internal-packages/indexes/lib/component/size-column.jsx index ad54eee1b4f..4ecc5972836 100644 --- a/src/internal-packages/indexes/lib/component/size-column.jsx +++ b/src/internal-packages/indexes/lib/component/size-column.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const numeral = require('numeral'); @@ -8,13 +6,9 @@ const numeral = require('numeral'); */ class SizeColumn extends React.Component { - /** - * The component constructor. - * - * @param {Object} props - The properties. - */ - constructor(props) { - super(props); + _format(size) { + const precision = size <= 1000 ? '0' : '0.0'; + return numeral(size).format(precision + ' b'); } /** @@ -23,27 +17,22 @@ class SizeColumn extends React.Component { * @returns {React.Component} The size column. */ render() { - let indexSize = this._format(this.props.size).split(' '); + const indexSize = this._format(this.props.size).split(' '); return ( - ); } - - _format(size) { - let precision = size <= 1000 ? '0' : '0.0'; - return numeral(size).format(precision + ' b'); - } } SizeColumn.displaySize = 'SizeColumn'; diff --git a/src/internal-packages/indexes/lib/component/type-column.jsx b/src/internal-packages/indexes/lib/component/type-column.jsx index 95a0b472200..25cffaa2166 100644 --- a/src/internal-packages/indexes/lib/component/type-column.jsx +++ b/src/internal-packages/indexes/lib/component/type-column.jsx @@ -1,6 +1,5 @@ -'use strict'; - const _ = require('lodash'); +const format = require('util').format; const React = require('react'); const openIndexHelpLink = require('../index-link-helper'); @@ -9,21 +8,27 @@ const openIndexHelpLink = require('../index-link-helper'); */ class TypeColumn extends React.Component { - /** - * Render the type column. - * - * @returns {React.Component} The type column. - */ - render() { - return ( - - ); + _clickHelp(evt) { + evt.preventDefault(); + evt.stopPropagation(); + openIndexHelpLink(evt.target.parentNode.innerText); + } + + _link() { + return (); + } + + _textTooltip() { + const info = _.pick(this.props.index.extra, ['weights', 'default_language', 'language_override']); + return _.map(info, (v, k) => { + return format('%s: %j', k, v); + }).join('\n'); } /** * Render the type div. + * + * @returns {React.Component} The type div. */ renderType() { if (this.props.index.type === 'text') { @@ -42,21 +47,17 @@ class TypeColumn extends React.Component { ); } - _clickHelp(evt) { - evt.preventDefault(); - evt.stopPropagation(); - openIndexHelpLink(evt.target.parentNode.innerText); - } - - _link() { - return (); - } - - _textTooltip() { - let info = _.pick(this.props.index.extra, ['weights', 'default_language', 'language_override']); - return _.map(info, (v, k) => { - return format('%s: %j', k, v); - }).join('\n'); + /** + * Render the type column. + * + * @returns {React.Component} The type column. + */ + render() { + return ( + + ); } } diff --git a/src/internal-packages/indexes/lib/component/usage-column.jsx b/src/internal-packages/indexes/lib/component/usage-column.jsx index 2b42114155f..c500cd0d02e 100644 --- a/src/internal-packages/indexes/lib/component/usage-column.jsx +++ b/src/internal-packages/indexes/lib/component/usage-column.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); /** @@ -23,12 +21,12 @@ class UsageColumn extends React.Component { */ render() { return ( -
    -
    - {this.props.index.name} -
    -
    -

    - {fields} -

    -
    -
    +
    + {this.props.index.name} +
    +
    +

    + {fields} +

    +
    +
    -
    - {properties} - {this.renderCardinality()} -
    -
    +
    + {properties} + {this.renderCardinality()} +
    +
    -
    +
    +
    {indexSize[0]}
    -
    +
    {indexSize[1]}
    -
    -
    +
    +
    - {this.renderType()} - + {this.renderType()} + - -
    +
    + +
    {this.props.usage}
    -
    +
    since  {this.props.since.toDateString()} @@ -43,7 +41,8 @@ class UsageColumn extends React.Component { UsageColumn.displayUsage = 'UsageColumn'; UsageColumn.propTypes = { - usage: React.PropTypes.number.isRequired + usage: React.PropTypes.number.isRequired, + since: React.PropTypes.any.isRequired }; module.exports = UsageColumn; diff --git a/src/internal-packages/indexes/lib/index-link-helper.js b/src/internal-packages/indexes/lib/index-link-helper.js index c7fcb7ce180..58fda227850 100644 --- a/src/internal-packages/indexes/lib/index-link-helper.js +++ b/src/internal-packages/indexes/lib/index-link-helper.js @@ -1,5 +1,3 @@ -'use strict'; - const _ = require('lodash'); const shell = require('electron').shell; @@ -26,7 +24,7 @@ const HELP_URLS = { * @param {String} section - The name of the section to open. */ function openIndexHelpLink(section) { - let url = _.get(HELP_URLS, section, 'UNKNOWN'); + const url = _.get(HELP_URLS, section, 'UNKNOWN'); if (url) { shell.openExternal(url); } diff --git a/src/internal-packages/indexes/lib/store/load-indexes-store.js b/src/internal-packages/indexes/lib/store/load-indexes-store.js index a210c0c0706..d6714875eab 100644 --- a/src/internal-packages/indexes/lib/store/load-indexes-store.js +++ b/src/internal-packages/indexes/lib/store/load-indexes-store.js @@ -1,5 +1,3 @@ -'use strict'; - const _ = require('lodash'); const Reflux = require('reflux'); const app = require('ampersand-app'); @@ -25,7 +23,9 @@ const LoadIndexesStore = Reflux.createStore({ loadIndexes: function() { if (NamespaceStore.ns) { app.dataService.indexes(NamespaceStore.ns, {}, (err, indexes) => { - this.trigger(this._convertToModels(indexes)); + if (!err) { + this.trigger(this._convertToModels(indexes)); + } }); } }, @@ -38,9 +38,9 @@ const LoadIndexesStore = Reflux.createStore({ * @returns {Array} The index models. */ _convertToModels(indexes) { - let maxSize = this._computeMaxSize(indexes); + const maxSize = this._computeMaxSize(indexes); return _.map(indexes, (index) => { - let model = new IndexModel(new IndexModel().parse(index)); + const model = new IndexModel(new IndexModel().parse(index)); model.relativeSize = model.size / maxSize * 100; return model; }); diff --git a/src/internal-packages/indexes/lib/store/sort-indexes-store.js b/src/internal-packages/indexes/lib/store/sort-indexes-store.js index 5555b6fb813..4d88bcae087 100644 --- a/src/internal-packages/indexes/lib/store/sort-indexes-store.js +++ b/src/internal-packages/indexes/lib/store/sort-indexes-store.js @@ -1,5 +1,3 @@ -'use strict'; - const Reflux = require('reflux'); const Action = require('../action/index-actions'); const LoadIndexesStore = require('./load-indexes-store'); @@ -65,7 +63,7 @@ const SortIndexesStore = Reflux.createStore({ * @returns {Function} The function. */ _comparator(field) { - let order = (this.sortOrder === ASC) ? 1 : -1; + const order = (this.sortOrder === ASC) ? 1 : -1; if (field === 'properties') { return this._propertiesComparator(order); } @@ -77,7 +75,7 @@ const SortIndexesStore = Reflux.createStore({ return -order; } return 0; - } + }; }, /** @@ -89,8 +87,8 @@ const SortIndexesStore = Reflux.createStore({ */ _propertiesComparator(order) { return function(a, b) { - let aValue = (a.cardinality === 'compound') ? 'compound' : (a.properties[0] || ''); - let bValue = (b.cardinality === 'compound') ? 'compound' : (b.properties[0] || ''); + const aValue = (a.cardinality === 'compound') ? 'compound' : (a.properties[0] || ''); + const bValue = (b.cardinality === 'compound') ? 'compound' : (b.properties[0] || ''); if (aValue > bValue) { return order; } @@ -98,7 +96,7 @@ const SortIndexesStore = Reflux.createStore({ return -order; } return 0; - } + }; }, /** @@ -111,9 +109,8 @@ const SortIndexesStore = Reflux.createStore({ return 'name'; } else if (this.sortField === USAGE) { return 'usageCount'; - } else { - return this.sortField.toLowerCase(); } + return this.sortField.toLowerCase(); } }); diff --git a/src/internal-packages/query/lib/component/sampling-message.jsx b/src/internal-packages/query/lib/component/sampling-message.jsx index b626a17f3f0..1fc8adc0281 100644 --- a/src/internal-packages/query/lib/component/sampling-message.jsx +++ b/src/internal-packages/query/lib/component/sampling-message.jsx @@ -1,5 +1,3 @@ -'use strict'; - const React = require('react'); const app = require('ampersand-app'); const TextButton = require('hadron-app-registry').TextButton; @@ -11,6 +9,20 @@ const pluralize = require('pluralize'); */ class SamplingMessage extends React.Component { + /** + * The component constructor. + * + * @param {Object} props - The properties. + */ + constructor(props) { + super(props); + this.state = { count: 0, loaded: 20 }; + this.resetDocumentListStore = app.appRegistry.getStore('Store::CRUD::ResetDocumentListStore'); + this.insertDocumentStore = app.appRegistry.getStore('Store::CRUD::InsertDocumentStore'); + this.documentRemovedAction = app.appRegistry.getAction('Action::CRUD::DocumentRemoved'); + this.loadMoreDocumentsStore = app.appRegistry.getStore('Store::CRUD::LoadMoreDocumentsStore'); + } + /** * Fetch the state when the component mounts. */ @@ -21,6 +33,20 @@ class SamplingMessage extends React.Component { this.unsubscribeLoadMore = this.loadMoreDocumentsStore.listen(this.handleLoadMore.bind(this)); } + /** + * Only update when the count changes. + * + * @param {Object} nextProps - The next properties. + * @param {Object} nextState - The next state. + * + * @returns {Boolean} If the component should update. + */ + shouldComponentUpdate(nextProps, nextState) { + return (nextState.count !== this.state.count) || + (nextState.loaded !== this.state.loaded) || + (nextProps.sampleSize !== this.props.sampleSize); + } + /** * Unsibscribe from the document list store when unmounting. */ @@ -31,22 +57,10 @@ class SamplingMessage extends React.Component { this.unsubscribeLoadMore(); } - /** - * The component constructor. - * - * @param {Object} props - The properties. - */ - constructor(props) { - super(props); - this.state = { count: 0, loaded: 20 }; - this.resetDocumentListStore = app.appRegistry.getStore('Store::CRUD::ResetDocumentListStore'); - this.insertDocumentStore = app.appRegistry.getStore('Store::CRUD::InsertDocumentStore'); - this.documentRemovedAction = app.appRegistry.getAction('Action::CRUD::DocumentRemoved'); - this.loadMoreDocumentsStore = app.appRegistry.getStore('Store::CRUD::LoadMoreDocumentsStore'); - } - /** * Handle updating the count on document insert. + * + * @param {Boolean} success - If the insert succeeded. */ handleInsert(success) { if (success) { @@ -80,16 +94,20 @@ class SamplingMessage extends React.Component { this.setState({ loaded: this.state.loaded + documents.length }); } - /** - * Render the sampling message. - * - * @returns {React.Component} The document list. - */ - render() { - if (this.props.insertHandler) { - return this.renderQueryMessage(); + + _loadedMessage() { + if (this.state.count > 20) { + return ( + + Displaying documents 1-{this.state.loaded}  + + ); } - return this.renderSamplingMessage(); + } + + _samplePercentage() { + const percent = (this.state.count === 0) ? 0 : this.props.sampleSize / this.state.count; + return numeral(percent).format('0.00%'); } /** @@ -98,14 +116,14 @@ class SamplingMessage extends React.Component { * @returns {React.Component} The sampling message. */ renderSamplingMessage() { - var noun = pluralize('document', this.state.count); + const noun = pluralize('document', this.state.count); return ( -
    +
    Query returned  {this.state.count} {noun}. This report is based on a sample of  {this.props.sampleSize} {noun} ({this._samplePercentage()}). - +
    ); } @@ -116,44 +134,37 @@ class SamplingMessage extends React.Component { * @returns {React.Component} The count message. */ renderQueryMessage() { - var noun = pluralize('document', this.state.count); + const noun = pluralize('document', this.state.count); return ( -
    +
    Query returned {this.state.count} {noun}.  {this._loadedMessage()} + className="btn btn-default btn-xs open-insert" + text="+ Insert" />
    ); } /** - * Only update when the count changes. + * Render the sampling message. + * + * @returns {React.Component} The document list. */ - shouldComponentUpdate(nextProps, nextState) { - return (nextState.count !== this.state.count) || - (nextState.loaded != this.state.loaded) || - (nextProps.sampleSize !== this.props.sampleSize); - } - - _loadedMessage() { - if (this.state.count > 20) { - return ( - - Displaying documents 1-{this.state.loaded}  - - ); + render() { + if (this.props.insertHandler) { + return this.renderQueryMessage(); } - } - - _samplePercentage() { - var percent = (this.state.count === 0) ? 0 : this.props.sampleSize / this.state.count; - return numeral(percent).format('0.00%'); + return this.renderSamplingMessage(); } } SamplingMessage.displayName = 'SamplingMessage'; +SamplingMessage.propTypes = { + sampleSize: React.PropTypes.number, + insertHandler: React.PropTypes.func +}; + module.exports = SamplingMessage; diff --git a/src/internal-packages/schema/index.js b/src/internal-packages/schema/index.js index 010935e4532..9bfaec9df93 100644 --- a/src/internal-packages/schema/index.js +++ b/src/internal-packages/schema/index.js @@ -1,5 +1,3 @@ -'use strict'; - const app = require('ampersand-app'); const SchemaComponent = require('./lib/component'); const SchemaAction = require('./lib/action'); diff --git a/src/internal-packages/schema/lib/component/document.jsx b/src/internal-packages/schema/lib/component/document.jsx index 049128b95ee..cd9536d0741 100644 --- a/src/internal-packages/schema/lib/component/document.jsx +++ b/src/internal-packages/schema/lib/component/document.jsx @@ -2,8 +2,6 @@ const React = require('react'); const pluralize = require('pluralize'); const _ = require('lodash'); -const debug = require('debug')('mongodb-compass:schema:array'); - const DocumentMinichart = React.createClass({ propTypes: { diff --git a/src/internal-packages/schema/lib/d3/coordinates.js b/src/internal-packages/schema/lib/d3/coordinates.js index 1e99bd8d0cf..e442e3f7400 100644 --- a/src/internal-packages/schema/lib/d3/coordinates.js +++ b/src/internal-packages/schema/lib/d3/coordinates.js @@ -55,7 +55,7 @@ const minicharts_d3fns_geo = function() { // const project = d3.geo.mercator(); // const unproject = d3.geo.mercator().invert; - let update; + const update = null; function querybuilder() { if (circleCenter && circleOuter) { diff --git a/src/internal-packages/schema/lib/d3/d3-tip.js b/src/internal-packages/schema/lib/d3/d3-tip.js index d84c2514f9d..9c9cf52d8c1 100644 --- a/src/internal-packages/schema/lib/d3/d3-tip.js +++ b/src/internal-packages/schema/lib/d3/d3-tip.js @@ -20,13 +20,13 @@ // // Returns a tip return function() { - var direction = d3_tip_direction; - var offset = d3_tip_offset; - var html = d3_tip_html; - var node = initNode(); - var svg = null; - var point = null; - var target = null; + const direction = d3_tip_direction; + const offset = d3_tip_offset; + const html = d3_tip_html; + const node = initNode(); + let svg = null; + let point = null; + let target = null; function tip(vis) { svg = getSVGNode(vis); @@ -41,17 +41,17 @@ // // Returns a tip tip.show = function() { - var args = Array.prototype.slice.call(arguments); + const args = Array.prototype.slice.call(arguments); if (args[args.length - 1] instanceof SVGElement) { target = args.pop(); } - var content = html.apply(this, args), + const content = html.apply(this, args), poffset = offset.apply(this, args), dir = direction.apply(this, args), nodel = getNodeEl(), i = directions.length, - coords, + coords = null, scrollTop = document.documentElement.scrollTop || document.body.scrollTop, scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft; @@ -77,7 +77,7 @@ // // Returns a tip tip.hide = function() { - var nodel = getNodeEl(); + const nodel = getNodeEl(); nodel.style({ opacity: 0, 'pointer-events': 'none' @@ -95,7 +95,7 @@ if (arguments.length < 2 && typeof n === 'string') { return getNodeEl().attr(n); } else { - var args = Array.prototype.slice.call(arguments); + const args = Array.prototype.slice.call(arguments); d3.selection.prototype.attr.apply(getNodeEl(), args); } @@ -112,7 +112,7 @@ if (arguments.length < 2 && typeof n === 'string') { return getNodeEl().style(n); } else { - var args = Array.prototype.slice.call(arguments); + const args = Array.prototype.slice.call(arguments); d3.selection.prototype.style.apply(getNodeEl(), args); } @@ -183,7 +183,7 @@ return ' '; } - var direction_callbacks = d3.map({ + const direction_callbacks = d3.map({ n: direction_n, s: direction_s, e: direction_e, @@ -197,7 +197,7 @@ directions = direction_callbacks.keys(); function direction_n() { - var bbox = getScreenBBox(); + const bbox = getScreenBBox(); return { top: bbox.n.y - node.offsetHeight, left: bbox.n.x - node.offsetWidth / 2 @@ -205,7 +205,7 @@ } function direction_s() { - var bbox = getScreenBBox(); + const bbox = getScreenBBox(); return { top: bbox.s.y, left: bbox.s.x - node.offsetWidth / 2 @@ -213,7 +213,7 @@ } function direction_e() { - var bbox = getScreenBBox(); + const bbox = getScreenBBox(); return { top: bbox.e.y - node.offsetHeight / 2, left: bbox.e.x @@ -221,7 +221,7 @@ } function direction_w() { - var bbox = getScreenBBox(); + const bbox = getScreenBBox(); return { top: bbox.w.y - node.offsetHeight / 2, left: bbox.w.x - node.offsetWidth @@ -229,7 +229,7 @@ } function direction_nw() { - var bbox = getScreenBBox(); + const bbox = getScreenBBox(); return { top: bbox.nw.y - node.offsetHeight, left: bbox.nw.x - node.offsetWidth @@ -237,7 +237,7 @@ } function direction_ne() { - var bbox = getScreenBBox(); + const bbox = getScreenBBox(); return { top: bbox.ne.y - node.offsetHeight, left: bbox.ne.x @@ -245,7 +245,7 @@ } function direction_sw() { - var bbox = getScreenBBox(); + const bbox = getScreenBBox(); return { top: bbox.sw.y, left: bbox.sw.x - node.offsetWidth @@ -253,7 +253,7 @@ } function direction_se() { - var bbox = getScreenBBox(); + const bbox = getScreenBBox(); return { top: bbox.se.y, left: bbox.e.x @@ -261,7 +261,7 @@ } function initNode() { - var node = d3.select(document.createElement('div')); + const node = d3.select(document.createElement('div')); node.style({ position: 'absolute', top: 0, @@ -308,13 +308,13 @@ // // Returns an Object {n, s, e, w, nw, sw, ne, se} function getScreenBBox() { - var targetel = target || d3.event.target; + const targetel = target || d3.event.target; while ('undefined' === typeof targetel.getScreenCTM && 'undefined' === targetel.parentNode) { targetel = targetel.parentNode; } - var bbox = {}, + const bbox = {}, matrix = targetel.getScreenCTM(), tbbox = targetel.getBBox(), width = tbbox.width, diff --git a/src/internal-packages/schema/lib/d3/shared.js b/src/internal-packages/schema/lib/d3/shared.js index 1d039bad895..166ec6e5cff 100644 --- a/src/internal-packages/schema/lib/d3/shared.js +++ b/src/internal-packages/schema/lib/d3/shared.js @@ -1,12 +1,12 @@ /* eslint camelcase: 0 */ -var d3 = require('d3'); +const d3 = require('d3'); // source: http://bit.ly/1Tc9Tp5 function decimalPlaces(number) { return ((+number).toFixed(20)).replace(/^-?\d*\.?|0+$/g, '').length; } -var minicharts_d3fns_shared = { +const minicharts_d3fns_shared = { margin: { top: 10, @@ -16,11 +16,11 @@ var minicharts_d3fns_shared = { }, friendlyPercentFormat: function(vmax) { - var prec1Format = d3.format('.1r'); - var intFormat = d3.format('.0f'); - var format = vmax > 1 ? intFormat : prec1Format; - var maxFormatted = format(vmax); - var maxDecimals = decimalPlaces(maxFormatted); + const prec1Format = d3.format('.1r'); + const intFormat = d3.format('.0f'); + const format = vmax > 1 ? intFormat : prec1Format; + const maxFormatted = format(vmax); + const maxDecimals = decimalPlaces(maxFormatted); return function(v, incPrec) { if (v === vmax) { diff --git a/src/internal-packages/server-stats/lib/d3/stats-chart.js b/src/internal-packages/server-stats/lib/d3/stats-chart.js index 201876ff935..4ba253da7c2 100644 --- a/src/internal-packages/server-stats/lib/d3/stats-chart.js +++ b/src/internal-packages/server-stats/lib/d3/stats-chart.js @@ -1,5 +1,6 @@ const d3 = require('d3'); -// const debug = require('debug')('mongodb-compass:server-stats-chart'); + +/* eslint complexity:0 */ const graphfunction = function() { let width = 520; @@ -125,12 +126,11 @@ const graphfunction = function() { } errorState = true; return; - } else { - if (errorState) { - errorState = false; - container.selectAll('rect.error-overlay').remove(); - container.selectAll('text.error-message').remove(); - } + } + if (errorState) { + errorState = false; + container.selectAll('rect.error-overlay').remove(); + container.selectAll('text.error-message').remove(); } // Redraw anything hidden by errors container.selectAll('.legend, .overlay, .axis-labels, .line-div') diff --git a/src/internal-packages/status/index.js b/src/internal-packages/status/index.js index 5e2773a2db3..416300a4901 100644 --- a/src/internal-packages/status/index.js +++ b/src/internal-packages/status/index.js @@ -1,5 +1,3 @@ -'use strict'; - const app = require('ampersand-app'); const StatusComponent = require('./lib/component'); const StatusAction = require('./lib/action');