diff options
Diffstat (limited to 'web/react/components/signup_team.jsx')
| -rw-r--r-- | web/react/components/signup_team.jsx | 159 |
1 files changed, 91 insertions, 68 deletions
diff --git a/web/react/components/signup_team.jsx b/web/react/components/signup_team.jsx index 26c46dad0..2adf8d111 100644 --- a/web/react/components/signup_team.jsx +++ b/web/react/components/signup_team.jsx @@ -6,6 +6,8 @@ import EmailSignUpPage from './team_signup_with_email.jsx'; import SSOSignupPage from './team_signup_with_sso.jsx'; import LdapSignUpPage from './team_signup_with_ldap.jsx'; import Constants from '../utils/constants.jsx'; +import TeamStore from '../stores/team_store.jsx'; +import * as AsyncClient from '../utils/async_client.jsx'; import {FormattedMessage} from 'mm-intl'; @@ -14,6 +16,7 @@ export default class TeamSignUp extends React.Component { super(props); this.updatePage = this.updatePage.bind(this); + this.onTeamUpdate = this.onTeamUpdate.bind(this); var count = 0; @@ -46,11 +49,34 @@ export default class TeamSignUp extends React.Component { this.setState({page}); } + componentWillMount() { + if (global.window.mm_config.EnableTeamListing === 'true') { + AsyncClient.getAllTeams(); + this.onTeamUpdate(); + } + } + + componentDidMount() { + TeamStore.addChangeListener(this.onTeamUpdate); + } + + componentWillUnmount() { + TeamStore.removeChangeListener(this.onTeamUpdate); + } + + onTeamUpdate() { + this.setState({ + teams: TeamStore.getAll() + }); + } + render() { - var teamListing = null; + let teamListing = null; if (global.window.mm_config.EnableTeamListing === 'true') { - if (this.props.teams.length === 0) { + if (this.state.teams == null) { + teamListing = (<div/>); + } else if (this.state.teams.length === 0) { if (global.window.mm_config.EnableTeamCreation !== 'true') { teamListing = ( <div> @@ -72,23 +98,26 @@ export default class TeamSignUp extends React.Component { </h4> <div className='signup-team-all'> { - this.props.teams.map((team) => { - return ( - <div - key={'team_' + team.name} - className='signup-team-dir' - > - <a - href={'/' + team.name} + Object.values(this.state.teams).map((team) => { + if (team.allow_team_listing) { + return ( + <div + key={'team_' + team.name} + className='signup-team-dir' > - <span className='signup-team-dir__name'>{team.display_name}</span> - <span - className='glyphicon glyphicon-menu-right right signup-team-dir__arrow' - aria-hidden='true' - /> - </a> - </div> - ); + <a + href={'/' + team.name} + > + <span className='signup-team-dir__name'>{team.display_name}</span> + <span + className='glyphicon glyphicon-menu-right right signup-team-dir__arrow' + aria-hidden='true' + /> + </a> + </div> + ); + } + return null; }) } </div> @@ -103,42 +132,26 @@ export default class TeamSignUp extends React.Component { } } + let signupMethod = null; + if (global.window.mm_config.EnableTeamCreation !== 'true') { if (teamListing == null) { - return ( - <div> - <FormattedMessage - id='signup_team.disabled' - defaultMessage='Team creation has been disabled. Please contact an administrator for access.' - /> - </div> + signupMethod = ( + <FormattedMessage + id='signup_team.disabled' + defaultMessage='Team creation has been disabled. Please contact an administrator for access.' + /> ); } - - return ( - <div> - {teamListing} - </div> - ); - } - - if (this.state.page === 'choose') { - return ( - <div> - {teamListing} - <ChoosePage - updatePage={this.updatePage} - /> - </div> + } else if (this.state.page === 'choose') { + signupMethod = ( + <ChoosePage + updatePage={this.updatePage} + /> ); - } - - if (this.state.page === 'email') { - return ( - <div> - {teamListing} - <EmailSignUpPage/> - </div> + } else if (this.state.page === 'email') { + signupMethod = ( + <EmailSignUpPage/> ); } else if (this.state.page === 'ldap') { return ( @@ -148,35 +161,45 @@ export default class TeamSignUp extends React.Component { </div> ); } else if (this.state.page === 'gitlab') { - return ( - <div> - {teamListing} - <SSOSignupPage service={Constants.GITLAB_SERVICE}/> - </div> + signupMethod = ( + <SSOSignupPage service={Constants.GITLAB_SERVICE}/> ); } else if (this.state.page === 'google') { - return ( - <div> - {teamListing} - <SSOSignupPage service={Constants.GOOGLE_SERVICE}/> - </div> + signupMethod = ( + <SSOSignupPage service={Constants.GOOGLE_SERVICE}/> ); } else if (this.state.page === 'none') { - return ( - <div> - <FormattedMessage - id='signup_team.none' - defaultMessage='No team creation method has been enabled. Please contact an administrator for access.' - /> - </div> + signupMethod = ( + <FormattedMessage + id='signup_team.none' + defaultMessage='No team creation method has been enabled. Please contact an administrator for access.' + /> ); } - return null; + return ( + <div className='col-sm-12'> + <div className='signup-team__container'> + <img + className='signup-team-logo' + src='/static/images/logo.png' + /> + <h1>{global.window.mm_config.SiteName}</h1> + <h4 className='color--light'> + <FormattedMessage + id='web.root.singup_info' + /> + </h4> + <div id='signup-team'> + {teamListing} + {signupMethod} + </div> + </div> + </div> + ); } } TeamSignUp.propTypes = { - teams: React.PropTypes.array }; |