diff options
author | David Lu <david.lu@hotmail.com> | 2016-07-14 15:56:49 -0400 |
---|---|---|
committer | Corey Hulen <corey@hulen.com> | 2016-07-14 11:56:49 -0800 |
commit | 0b200cc9245193aa01b00ecc8bf41483f6b32e7e (patch) | |
tree | 6548d918383d38689b949d03caf831ad2c81466f /webapp/components | |
parent | 70283c20f69576d52b4f35ed9c138749523c6ca7 (diff) | |
download | chat-0b200cc9245193aa01b00ecc8bf41483f6b32e7e.tar.gz chat-0b200cc9245193aa01b00ecc8bf41483f6b32e7e.tar.bz2 chat-0b200cc9245193aa01b00ecc8bf41483f6b32e7e.zip |
PLT-3266 Added channel header to create channel modal (#3559)
* Added channel header to create channel modal
removed React FindDOMNode
* made css changes
Diffstat (limited to 'webapp/components')
-rw-r--r-- | webapp/components/new_channel_flow.jsx | 6 | ||||
-rw-r--r-- | webapp/components/new_channel_modal.jsx | 44 |
2 files changed, 46 insertions, 4 deletions
diff --git a/webapp/components/new_channel_flow.jsx b/webapp/components/new_channel_flow.jsx index db06cf0be..f6e91afc4 100644 --- a/webapp/components/new_channel_flow.jsx +++ b/webapp/components/new_channel_flow.jsx @@ -65,6 +65,7 @@ class NewChannelFlow extends React.Component { channelDisplayName: '', channelName: '', channelPurpose: '', + channelHeader: '', nameModified: false }; } @@ -78,6 +79,7 @@ class NewChannelFlow extends React.Component { channelDisplayName: '', channelName: '', channelPurpose: '', + channelHeader: '', nameModified: false }); } @@ -99,6 +101,7 @@ class NewChannelFlow extends React.Component { name: this.state.channelName, display_name: this.state.channelDisplayName, purpose: this.state.channelPurpose, + header: this.state.channelHeader, type: this.state.channelType }; Client.createChannel( @@ -153,7 +156,8 @@ class NewChannelFlow extends React.Component { channelDataChanged(data) { this.setState({ channelDisplayName: data.displayName, - channelPurpose: data.purpose + channelPurpose: data.purpose, + channelHeader: data.header }); if (!this.state.nameModified) { this.setState({channelName: Utils.cleanUpUrlable(data.displayName.trim())}); diff --git a/webapp/components/new_channel_modal.jsx b/webapp/components/new_channel_modal.jsx index 23eee625d..1198335ca 100644 --- a/webapp/components/new_channel_modal.jsx +++ b/webapp/components/new_channel_modal.jsx @@ -89,8 +89,9 @@ class NewChannelModal extends React.Component { handleChange() { const newData = { - displayName: ReactDOM.findDOMNode(this.refs.display_name).value, - purpose: ReactDOM.findDOMNode(this.refs.channel_purpose).value + displayName: this.refs.display_name.value, + header: this.refs.channel_header.value, + purpose: this.refs.channel_purpose.value }; this.props.onDataChanged(newData); } @@ -258,7 +259,7 @@ class NewChannelModal extends React.Component { </p> </div> </div> - <div className='form-group less'> + <div className='form-group'> <div className='col-sm-3'> <label className='form__label control-label'> <FormattedMessage @@ -293,6 +294,43 @@ class NewChannelModal extends React.Component { }} /> </p> + </div> + </div> + <div className='form-group less'> + <div className='col-sm-3'> + <label className='form__label control-label'> + <FormattedMessage + id='channel_modal.header' + defaultMessage='Header' + /> + </label> + <label className='form__label light'> + <FormattedMessage + id='channel_modal.optional' + defaultMessage='(optional)' + /> + </label> + </div> + <div className='col-sm-9'> + <textarea + className='form-control no-resize' + ref='channel_header' + rows='4' + placeholder={this.props.intl.formatMessage({id: 'channel_modal.header'})} + maxLength='128' + value={this.props.channelData.header} + onChange={this.handleChange} + tabIndex='2' + /> + <p className='input__help'> + <FormattedMessage + id='channel_modal.headerHelp' + defaultMessage='Set text that will appear in the header of the {term} beside the {term} name. For example, include frequently used links by typing [Link Title](http://example.com).' + values={{ + term: (channelTerm) + }} + /> + </p> {serverError} </div> </div> |