Reformatted team_feature_tab.jsx to meet style guide requirements.

1 files changed, 65 insertions, 40 deletions

diff --git a/web/react/components/team_feature_tab.jsx b/web/react/components/team_feature_tab.jsx
index 4f8f0b2cf..1556d05cd 100644
--- a/web/react/components/team_feature_tab.jsx
+++ b/web/react/components/team_feature_tab.jsx
@@ -7,62 +7,62 @@ var SettingItemMax = require('./setting_item_max.jsx');
 var client = require('../utils/client.jsx');
 var AsyncClient = require('../utils/async_client.jsx');
 
-module.exports = React.createClass({
-    displayName: 'Feature Tab',
-    propTypes: {
-        updateSection: React.PropTypes.func.isRequired,
-        team: React.PropTypes.object.isRequired,
-        activeSection: React.PropTypes.string.isRequired
-    },
-    submitValetFeature: function() {
+export default class FeatureTab extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.submitValetFeature = this.submitValetFeature.bind(this);
+        this.handleValetRadio = this.handleValetRadio.bind(this);
+        this.onUpdateSection = this.onUpdateSection.bind(this);
+
+        this.state = {};
+        var team = this.props.team;
+
+        if (team && team.allow_valet) {
+            this.state.allowValet = 'true';
+        } else {
+            this.state.allowValet = 'false';
+        }
+    }
+    componentWillReceiveProps(newProps) {
+        var team = newProps.team;
+
+        var allowValet = 'false';
+        if (team && team.allow_valet) {
+            allowValet = 'true';
+        }
+
+        this.setState({allowValet: allowValet});
+    }
+    submitValetFeature() {
         var data = {};
         data.allow_valet = this.state.allowValet;
 
         client.updateValetFeature(data,
-            function() {
+            function success() {
                 this.props.updateSection('');
                 AsyncClient.getMyTeam();
             }.bind(this),
-            function(err) {
+            function fail(err) {
                 var state = this.getInitialState();
                 state.serverError = err;
                 this.setState(state);
             }.bind(this)
         );
-    },
-    handleValetRadio: function(val) {
+    }
+    handleValetRadio(val) {
         this.setState({allowValet: val});
         this.refs.wrapper.getDOMNode().focus();
-    },
-    componentWillReceiveProps: function(newProps) {
-        var team = newProps.team;
-
-        var allowValet = 'false';
-        if (team && team.allow_valet) {
-            allowValet = 'true';
-        }
-
-        this.setState({allowValet: allowValet});
-    },
-    getInitialState: function() {
-        var team = this.props.team;
-
-        var allowValet = 'false';
-        if (team && team.allow_valet) {
-            allowValet = 'true';
-        }
-
-        return {allowValet: allowValet};
-    },
-    onUpdateSection: function(e) {
+    }
+    onUpdateSection(e) {
         e.preventDefault();
         if (this.props.activeSection === 'valet') {
             this.props.updateSection('');
         } else {
             this.props.updateSection('valet');
         }
-    },
-    render: function() {
+    }
+    render() {
         var clientError = null;
         var serverError = null;
         if (this.state.clientError) {
@@ -145,10 +145,25 @@ module.exports = React.createClass({
         return (
             <div>
                 <div className='modal-header'>
-                    <button type='button' className='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
-                    <h4 className='modal-title' ref='title'><i className='modal-back'></i>Advanced Features</h4>
+                    <button
+                        type='button'
+                        className='close'
+                        data-dismiss='modal'
+                        aria-label='Close'
+                    >
+                        <span aria-hidden='true'>&times;</span>
+                    </button>
+                    <h4
+                        className='modal-title'
+                        ref='title'
+                    >
+                        <i className='modal-back'></i>Advanced Features
+                    </h4>
                 </div>
-                <div ref='wrapper' className='user-settings'>
+                <div
+                    ref='wrapper'
+                    className='user-settings'
+                >
                     <h3 className='tab-header'>Advanced Features</h3>
                     <div className='divider-dark first'/>
                     {valetSection}
@@ -157,4 +172,14 @@ module.exports = React.createClass({
             </div>
         );
     }
-});
+}
+
+FeatureTab.defaultProps = {
+    team: {},
+    activeSection: ''
+};
+FeatureTab.propTypes = {
+    updateSection: React.PropTypes.func.isRequired,
+    team: React.PropTypes.object.isRequired,
+    activeSection: React.PropTypes.string.isRequired
+};