diff options
Diffstat (limited to 'web/react/components/user_settings')
3 files changed, 46 insertions, 10 deletions
diff --git a/web/react/components/user_settings/custom_theme_chooser.jsx b/web/react/components/user_settings/custom_theme_chooser.jsx index 35f836adb..b7d90922a 100644 --- a/web/react/components/user_settings/custom_theme_chooser.jsx +++ b/web/react/components/user_settings/custom_theme_chooser.jsx @@ -3,6 +3,9 @@ import Constants from '../../utils/constants.jsx'; +const OverlayTrigger = ReactBootstrap.OverlayTrigger; +const Popover = ReactBootstrap.Popover; + export default class CustomThemeChooser extends React.Component { constructor(props) { super(props); @@ -19,6 +22,15 @@ export default class CustomThemeChooser extends React.Component { }); $('.color-picker').on('changeColor', this.onPickerChange); } + componentDidUpdate() { + const theme = this.props.theme; + Constants.THEME_ELEMENTS.forEach((element) => { + if (theme.hasOwnProperty(element.id) && element.id !== 'codeTheme') { + $('#' + element.id).data('colorpicker').color.setColor(theme[element.id]); + $('#' + element.id).colorpicker('update'); + } + }); + } onPickerChange(e) { const theme = this.props.theme; theme[e.target.id] = e.color.toHex(); @@ -72,6 +84,19 @@ export default class CustomThemeChooser extends React.Component { ); }); + var popoverContent = ( + <Popover + bsStyle='info' + id='code-popover' + className='code-popover' + > + <img + width='200' + src={'/static/images/themes/code_themes/' + theme[element.id] + '.png'} + /> + </Popover> + ); + elements.push( <div className='col-sm-4 form-group' @@ -85,16 +110,22 @@ export default class CustomThemeChooser extends React.Component { <select className='form-control' type='text' - defaultValue={theme[element.id]} + value={theme[element.id]} onChange={this.onInputChange} > {codeThemeOptions} </select> + <OverlayTrigger + placement='top' + overlay={popoverContent} + ref='headerOverlay' + > <span className='input-group-addon'> <img src={'/static/images/themes/code_themes/' + theme[element.id] + '.png'} /> </span> + </OverlayTrigger> </div> </div> ); @@ -112,7 +143,7 @@ export default class CustomThemeChooser extends React.Component { <input className='form-control' type='text' - defaultValue={theme[element.id]} + value={theme[element.id]} onChange={this.onInputChange} /> <span className='input-group-addon'><i></i></span> diff --git a/web/react/components/user_settings/manage_outgoing_hooks.jsx b/web/react/components/user_settings/manage_outgoing_hooks.jsx index fdbac9831..ede639691 100644 --- a/web/react/components/user_settings/manage_outgoing_hooks.jsx +++ b/web/react/components/user_settings/manage_outgoing_hooks.jsx @@ -36,7 +36,7 @@ export default class ManageOutgoingHooks extends React.Component { if (this.state.triggerWords.length !== 0) { hook.trigger_words = this.state.triggerWords.trim().split(','); } - hook.callback_urls = this.state.callbackURLs.split('\n'); + hook.callback_urls = this.state.callbackURLs.split('\n').map((url) => url.trim()); Client.addOutgoingHook( hook, diff --git a/web/react/components/user_settings/user_settings_general.jsx b/web/react/components/user_settings/user_settings_general.jsx index 962efd7a2..014038dd4 100644 --- a/web/react/components/user_settings/user_settings_general.jsx +++ b/web/react/components/user_settings/user_settings_general.jsx @@ -9,6 +9,7 @@ import UserStore from '../../stores/user_store.jsx'; import ErrorStore from '../../stores/error_store.jsx'; import * as Client from '../../utils/client.jsx'; +import Constants from '../../utils/constants.jsx'; import * as AsyncClient from '../../utils/async_client.jsx'; import * as Utils from '../../utils/utils.jsx'; @@ -51,7 +52,7 @@ export default class UserSettingsGeneralTab extends React.Component { } if (user.username === username) { - this.setState({clientError: 'You must submit a new username.', emailError: '', serverError: ''}); + this.updateSection(''); return; } @@ -66,7 +67,7 @@ export default class UserSettingsGeneralTab extends React.Component { const nickname = this.state.nickname.trim(); if (user.nickname === nickname) { - this.setState({clientError: 'You must submit a new nickname.', emailError: '', serverError: ''}); + this.updateSection(''); return; } @@ -82,7 +83,7 @@ export default class UserSettingsGeneralTab extends React.Component { const lastName = this.state.lastName.trim(); if (user.first_name === firstName && user.last_name === lastName) { - this.setState({clientError: 'You must submit a new first or last name.', emailError: '', serverError: ''}); + this.updateSection(''); return; } @@ -98,10 +99,6 @@ export default class UserSettingsGeneralTab extends React.Component { const email = this.state.email.trim().toLowerCase(); const confirmEmail = this.state.confirmEmail.trim().toLowerCase(); - if (user.email === email) { - return; - } - if (email === '' || !Utils.isEmail(email)) { this.setState({emailError: 'Please enter a valid email address.', clientError: '', serverError: ''}); return; @@ -112,6 +109,11 @@ export default class UserSettingsGeneralTab extends React.Component { return; } + if (user.email === email) { + this.updateSection(''); + return; + } + user.email = email; this.submitUser(user, true); } @@ -155,6 +157,9 @@ export default class UserSettingsGeneralTab extends React.Component { if (picture.type !== 'image/jpeg' && picture.type !== 'image/png') { this.setState({clientError: 'Only JPG or PNG images may be used for profile pictures.'}); return; + } else if (picture.size > Constants.MAX_FILE_SIZE) { + this.setState({clientError: 'Unable to upload profile image. File is too large.'}); + return; } var formData = new FormData(); |