IntenseWebs/mattermost
3
0
Fork 0
mirror of https://github.com/mattermost/mattermost.git synced 2025-02-25 18:55:24 -06:00
Code Issues Packages Projects Releases Wiki Activity

Refactor login, claim and create_team into views and add actions (#3110)

Browse Source
This commit is contained in:
Joram Wilander
2016-05-26 09:46:18 -04:00
committed by Harrison Healey
parent 9c0caaa765
commit 6fecfcc7ca
44 changed files with 163 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
webapp/components/create_team/components/display_name.jsx
View File

@@ -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);

97
webapp/components/create_team/components/team_url.jsx
View File

@@ -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 * as Utils from 'utils/utils.jsx';
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);

4
webapp/components/create_team/create_team.jsx → webapp/components/create_team/create_team_controller.jsx
View File

@@ -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
};