diff options
author | Joram Wilander <jwawilander@gmail.com> | 2016-05-26 09:46:18 -0400 |
---|---|---|
committer | Harrison Healey <harrisonmhealey@gmail.com> | 2016-05-26 09:46:18 -0400 |
commit | 6fecfcc7ca9f7cf29b4cf87ebeb63b09df70a8c7 (patch) | |
tree | d0d8d9833156f2a21f37a1ff746acd18342d3ebe /webapp/components/create_team | |
parent | 9c0caaa76505d4d473f987298acace4f198eb447 (diff) | |
download | chat-6fecfcc7ca9f7cf29b4cf87ebeb63b09df70a8c7.tar.gz chat-6fecfcc7ca9f7cf29b4cf87ebeb63b09df70a8c7.tar.bz2 chat-6fecfcc7ca9f7cf29b4cf87ebeb63b09df70a8c7.zip |
Refactor login, claim and create_team into views and add actions (#3110)
Diffstat (limited to 'webapp/components/create_team')
-rw-r--r-- | webapp/components/create_team/components/display_name.jsx | 38 | ||||
-rw-r--r-- | webapp/components/create_team/components/team_url.jsx | 95 | ||||
-rw-r--r-- | webapp/components/create_team/create_team_controller.jsx (renamed from webapp/components/create_team/create_team.jsx) | 4 |
3 files changed, 45 insertions, 92 deletions
diff --git a/webapp/components/create_team/components/display_name.jsx b/webapp/components/create_team/components/display_name.jsx index e8f1717bb..e6dcd221a 100644 --- a/webapp/components/create_team/components/display_name.jsx +++ b/webapp/components/create_team/components/display_name.jsx @@ -1,29 +1,19 @@ // Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. -import ReactDOM from 'react-dom'; -import * as utils from 'utils/utils.jsx'; -import Client from 'utils/web_client.jsx'; -import {Link} from 'react-router'; +import {track} from 'actions/analytics_actions.jsx'; -import {injectIntl, intlShape, defineMessages, FormattedMessage} from 'react-intl'; +import * as Utils from 'utils/utils.jsx'; +import Constants from 'utils/constants.jsx'; import logoImage from 'images/logo.png'; -const holders = defineMessages({ - required: { - id: 'create_team.display_name.required', - defaultMessage: 'This field is required' - }, - charLength: { - id: 'create_team.display_name.charLength', - defaultMessage: 'Name must be 4 or more characters up to a maximum of 15' - } -}); - import React from 'react'; +import ReactDOM from 'react-dom'; +import {Link} from 'react-router'; +import {FormattedMessage} from 'react-intl'; -class TeamSignupDisplayNamePage extends React.Component { +export default class TeamSignupDisplayNamePage extends React.Component { constructor(props) { super(props); @@ -35,19 +25,18 @@ class TeamSignupDisplayNamePage extends React.Component { submitNext(e) { e.preventDefault(); - const {formatMessage} = this.props.intl; var displayName = ReactDOM.findDOMNode(this.refs.name).value.trim(); if (!displayName) { - this.setState({nameError: formatMessage(holders.required)}); + this.setState({nameError: Utils.localizeMessage('create_team.display_name.required', 'This field is required')}); return; - } else if (displayName.length < 4 || displayName.length > 15) { - this.setState({nameError: formatMessage(holders.charLength)}); + } else if (displayName.length < Constants.MIN_TEAMNAME_LENGTH || displayName.length > Constants.MAX_TEAMNAME_LENGTH) { + this.setState({nameError: Utils.localizeMessage('create_team.display_name.charLength', 'Name must be 4 or more characters up to a maximum of 15')}); return; } this.props.state.wizard = 'team_url'; this.props.state.team.display_name = displayName; - this.props.state.team.name = utils.cleanUpUrlable(displayName); + this.props.state.team.name = Utils.cleanUpUrlable(displayName); this.props.updateParent(this.props.state); } @@ -57,7 +46,7 @@ class TeamSignupDisplayNamePage extends React.Component { } render() { - Client.track('signup', 'signup_team_02_name'); + track('signup', 'signup_team_02_name'); var nameError = null; var nameDivClass = 'form-group'; @@ -128,9 +117,6 @@ class TeamSignupDisplayNamePage extends React.Component { } TeamSignupDisplayNamePage.propTypes = { - intl: intlShape.isRequired, state: React.PropTypes.object, updateParent: React.PropTypes.func }; - -export default injectIntl(TeamSignupDisplayNamePage); diff --git a/webapp/components/create_team/components/team_url.jsx b/webapp/components/create_team/components/team_url.jsx index 34e696938..b6c634816 100644 --- a/webapp/components/create_team/components/team_url.jsx +++ b/webapp/components/create_team/components/team_url.jsx @@ -2,45 +2,20 @@ // See License.txt for license information. import $ from 'jquery'; -import ReactDOM from 'react-dom'; + import * as Utils from 'utils/utils.jsx'; -import Client from 'utils/web_client.jsx'; -import * as AsyncClient from 'utils/async_client.jsx'; -import TeamStore from 'stores/team_store.jsx'; -import UserStore from 'stores/user_store.jsx'; -import Constants from 'utils/constants.jsx'; -import {browserHistory} from 'react-router'; -import {injectIntl, intlShape, defineMessages, FormattedMessage, FormattedHTMLMessage} from 'react-intl'; +import {checkIfTeamExists, createTeam} from 'actions/team_actions.jsx'; +import {track} from 'actions/analytics_actions.jsx'; +import Constants from 'utils/constants.jsx'; import logoImage from 'images/logo.png'; -const holders = defineMessages({ - required: { - id: 'create_team.team_url.required', - defaultMessage: 'This field is required' - }, - regex: { - id: 'create_team.team_url.regex', - defaultMessage: "Use only lower case letters, numbers and dashes. Must start with a letter and can't end in a dash." - }, - charLength: { - id: 'create_team.team_url.charLength', - defaultMessage: 'Name must be 4 or more characters up to a maximum of 15' - }, - taken: { - id: 'create_team.team_url.taken', - defaultMessage: 'URL is taken or contains a reserved word' - }, - unavailable: { - id: 'create_team.team_url.unavailable', - defaultMessage: 'This URL is unavailable. Please try another.' - } -}); - import React from 'react'; +import ReactDOM from 'react-dom'; +import {FormattedMessage, FormattedHTMLMessage} from 'react-intl'; -class TeamUrl extends React.Component { +export default class TeamUrl extends React.Component { constructor(props) { super(props); @@ -58,10 +33,9 @@ class TeamUrl extends React.Component { submitNext(e) { e.preventDefault(); - const {formatMessage} = this.props.intl; const name = ReactDOM.findDOMNode(this.refs.name).value.trim(); if (!name) { - this.setState({nameError: formatMessage(holders.required)}); + this.setState({nameError: Utils.localizeMessage('create_team.team_url.required', 'This field is required')}); return; } @@ -69,17 +43,17 @@ class TeamUrl extends React.Component { const urlRegex = /^[a-z]+([a-z\-0-9]+|(__)?)[a-z0-9]+$/g; if (cleanedName !== name || !urlRegex.test(name)) { - this.setState({nameError: formatMessage(holders.regex)}); + this.setState({nameError: Utils.localizeMessage('create_team.team_url.regex', "Use only lower case letters, numbers and dashes. Must start with a letter and can't end in a dash.")}); return; - } else if (cleanedName.length < 4 || cleanedName.length > 15) { - this.setState({nameError: formatMessage(holders.charLength)}); + } else if (cleanedName.length < Constants.MIN_TEAMNAME_LENGTH || cleanedName.length > Constants.MAX_TEAMNAME_LENGTH) { + this.setState({nameError: Utils.localizeMessage('create_team.team_url.charLength', 'Name must be 4 or more characters up to a maximum of 15')}); return; } if (global.window.mm_config.RestrictTeamNames === 'true') { for (let index = 0; index < Constants.RESERVED_TEAM_NAMES.length; index++) { if (cleanedName.indexOf(Constants.RESERVED_TEAM_NAMES[index]) === 0) { - this.setState({nameError: formatMessage(holders.taken)}); + this.setState({nameError: Utils.localizeMessage('create_team.team_url.taken', 'URL is taken or contains a reserved word')}); return; } } @@ -90,30 +64,24 @@ class TeamUrl extends React.Component { teamSignup.team.type = 'O'; teamSignup.team.name = name; - Client.findTeamByName(name, - (findTeam) => { - if (findTeam) { - this.setState({nameError: formatMessage(holders.unavailable)}); - $('#finish-button').button('reset'); - } else { - Client.createTeam(teamSignup.team, - (team) => { - Client.track('signup', 'signup_team_08_complete'); - $('#sign-up-button').button('reset'); - AsyncClient.getDirectProfiles(); - TeamStore.saveTeam(team); - TeamStore.appendTeamMember({team_id: team.id, user_id: UserStore.getCurrentId(), roles: 'admin'}); - TeamStore.emitChange(); - browserHistory.push('/' + team.name + '/channels/town-square'); - }, - (err) => { - this.setState({nameError: err.message}); - $('#finish-button').button('reset'); - } - ); - + checkIfTeamExists(name, + (foundTeam) => { + if (foundTeam) { + this.setState({nameError: Utils.localizeMessage('create_team.team_url.unavailable', 'This URL is unavailable. Please try another.')}); $('#finish-button').button('reset'); + return; } + + createTeam(teamSignup.team, + () => { + track('signup', 'signup_team_08_complete'); + $('#sign-up-button').button('reset'); + }, + (err) => { + this.setState({nameError: err.message}); + $('#finish-button').button('reset'); + } + ); }, (err) => { this.setState({nameError: err.message}); @@ -121,15 +89,17 @@ class TeamUrl extends React.Component { } ); } + handleFocus(e) { e.preventDefault(); e.currentTarget.select(); } + render() { $('body').tooltip({selector: '[data-toggle=tooltip]', trigger: 'hover click'}); - Client.track('signup', 'signup_team_03_url'); + track('signup', 'signup_team_03_url'); let nameError = null; let nameDivClass = 'form-group'; @@ -223,9 +193,6 @@ class TeamUrl extends React.Component { } TeamUrl.propTypes = { - intl: intlShape.isRequired, state: React.PropTypes.object, updateParent: React.PropTypes.func }; - -export default injectIntl(TeamUrl); diff --git a/webapp/components/create_team/create_team.jsx b/webapp/components/create_team/create_team_controller.jsx index 8a119a122..ad2a008bd 100644 --- a/webapp/components/create_team/create_team.jsx +++ b/webapp/components/create_team/create_team_controller.jsx @@ -8,7 +8,7 @@ import {browserHistory, Link} from 'react-router'; import React from 'react'; -export default class CreateTeam extends React.Component { +export default class CreateTeamController extends React.Component { constructor(props) { super(props); @@ -67,6 +67,6 @@ export default class CreateTeam extends React.Component { } } -CreateTeam.propTypes = { +CreateTeamController.propTypes = { children: React.PropTypes.node }; |