1 files changed, 71 insertions, 33 deletions

diff --git a/web/react/components/team_signup_welcome_page.jsx b/web/react/components/team_signup_welcome_page.jsx
index f0c680bd8..f90fe2a2e 100644
--- a/web/react/components/team_signup_welcome_page.jsx
+++ b/web/react/components/team_signup_welcome_page.jsx
@@ -1,17 +1,22 @@
 // Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
 // See License.txt for license information.
 
-var utils = require('../utils/utils.jsx');
-var client = require('../utils/client.jsx');
+var Utils = require('../utils/utils.jsx');
+var Client = require('../utils/client.jsx');
 var BrowserStore = require('../stores/browser_store.jsx');
 
-module.exports = React.createClass({
-    displayName: 'TeamSignupWelcomePage',
-    propTypes: {
-        state: React.PropTypes.object,
-        updateParent: React.PropTypes.func
-    },
-    submitNext: function(e) {
+export default class TeamSignupWelcomePage extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.submitNext = this.submitNext.bind(this);
+        this.handleDiffEmail = this.handleDiffEmail.bind(this);
+        this.handleDiffSubmit = this.handleDiffSubmit.bind(this);
+        this.handleKeyPress = this.handleKeyPress.bind(this);
+
+        this.state = {useDiff: false};
+    }
+    submitNext(e) {
         if (!BrowserStore.isLocalStorageSupported()) {
             this.setState({storageError: 'This service requires local storage to be enabled. Please enable it or exit private browsing.'});
             return;
@@ -19,18 +24,18 @@ module.exports = React.createClass({
         e.preventDefault();
         this.props.state.wizard = 'team_display_name';
         this.props.updateParent(this.props.state);
-    },
-    handleDiffEmail: function(e) {
+    }
+    handleDiffEmail(e) {
         e.preventDefault();
         this.setState({useDiff: true});
-    },
-    handleDiffSubmit: function(e) {
+    }
+    handleDiffSubmit(e) {
         e.preventDefault();
 
         var state = {useDiff: true, serverError: ''};
 
         var email = this.refs.email.getDOMNode().value.trim().toLowerCase();
-        if (!email || !utils.isEmail(email)) {
+        if (!email || !Utils.isEmail(email)) {
             state.emailError = 'Please enter a valid email address';
             this.setState(state);
             return;
@@ -41,7 +46,7 @@ module.exports = React.createClass({
         }
         state.emailError = '';
 
-        client.signupTeam(email,
+        Client.signupTeam(email,
             function success(data) {
                 if (data.follow_link) {
                     window.location.href = data.follow_link;
@@ -56,23 +61,20 @@ module.exports = React.createClass({
                 this.setState(this.state);
             }.bind(this)
         );
-    },
-    getInitialState: function() {
-        return {useDiff: false};
-    },
-    handleKeyPress: function(event) {
+    }
+    handleKeyPress(event) {
         if (event.keyCode === 13) {
             this.submitNext(event);
         }
-    },
-    componentWillMount: function() {
+    }
+    componentWillMount() {
         document.addEventListener('keyup', this.handleKeyPress, false);
-    },
-    componentWillUnmount: function() {
+    }
+    componentWillUnmount() {
         document.removeEventListener('keyup', this.handleKeyPress, false);
-    },
-    render: function() {
-        client.track('signup', 'signup_team_01_welcome');
+    }
+    render() {
+        Client.track('signup', 'signup_team_01_welcome');
 
         var storageError = null;
         if (this.state.storageError) {
@@ -105,7 +107,10 @@ module.exports = React.createClass({
         return (
             <div>
                 <p>
-                    <img className='signup-team-logo' src='/static/images/logo.png' />
+                    <img
+                        className='signup-team-logo'
+                        src='/static/images/logo.png'
+                    />
                     <h3 className='sub-heading'>Welcome to:</h3>
                     <h1 className='margin--top-none'>{config.SiteName}</h1>
                 </p>
@@ -121,7 +126,14 @@ module.exports = React.createClass({
                     You can add other administrators later.
                 </p>
                 <div className='form-group'>
-                    <button className='btn-primary btn form-group' type='submit' onClick={this.submitNext}><i className='glyphicon glyphicon-ok'></i>Yes, this address is correct</button>
+                    <button
+                        className='btn-primary btn form-group'
+                        type='submit'
+                        onClick={this.submitNext}
+                    >
+                        <i className='glyphicon glyphicon-ok'></i>
+                        Yes, this address is correct
+                    </button>
                     {storageError}
                 </div>
                 <hr />
@@ -129,16 +141,42 @@ module.exports = React.createClass({
                     <div className={emailDivClass}>
                         <div className='row'>
                             <div className='col-sm-9'>
-                                <input type='email' ref='email' className='form-control' placeholder='Email Address' maxLength='128' />
+                                <input
+                                    type='email'
+                                    ref='email'
+                                    className='form-control'
+                                    placeholder='Email Address'
+                                    maxLength='128'
+                                />
                             </div>
                         </div>
                         {emailError}
                     </div>
                     {serverError}
-                    <button className='btn btn-md btn-primary' type='button' onClick={this.handleDiffSubmit}>Use this instead</button>
+                    <button
+                        className='btn btn-md btn-primary'
+                        type='button'
+                        onClick={this.handleDiffSubmit}
+                    >
+                        Use this instead
+                    </button>
                 </div>
-                <a href='#' onClick={this.handleDiffEmail} className={differentEmailLinkClass}>Use a different email</a>
+                <a
+                    href='#'
+                    onClick={this.handleDiffEmail}
+                    className={differentEmailLinkClass}
+                >
+                    Use a different email
+                </a>
             </div>
         );
     }
-});
+}
+
+TeamSignupWelcomePage.defaultProps = {
+    state: {}
+};
+TeamSignupWelcomePage.propTypes = {
+    updateParent: React.PropTypes.func.isRequired,
+    state: React.PropTypes.object
+};