From eacc06c7fc712e8b2e71c408327a449bc32c34d9 Mon Sep 17 00:00:00 2001 From: Reed Garmsen Date: Fri, 13 Nov 2015 16:22:32 -0800 Subject: Allow admins to change the display name for the default channel --- web/react/components/channel_header.jsx | 41 +++++++++++--------- web/react/components/navbar.jsx | 56 ++++++++++++++------------- web/react/components/rename_channel_modal.jsx | 51 +++++++++++++++--------- web/sass-files/sass/partials/_forms.scss | 4 ++ 4 files changed, 87 insertions(+), 65 deletions(-) (limited to 'web') diff --git a/web/react/components/channel_header.jsx b/web/react/components/channel_header.jsx index a8d4ec100..79c7f90a9 100644 --- a/web/react/components/channel_header.jsx +++ b/web/react/components/channel_header.jsx @@ -276,26 +276,27 @@ export default class ChannelHeader extends React.Component { ); - if (!ChannelStore.isDefault(channel)) { - if (isAdmin) { - dropdownContents.push( -
  • + - - {'Rename '}{channelTerm}{'...'} - -
    • - ); + {'Rename '}{channelTerm}{'...'} + + + ); + + if (!ChannelStore.isDefault(channel)) { dropdownContents.push(
  • ); } + } + if (!ChannelStore.isDefault(channel)) { dropdownContents.push(
  • - this.setState({showMembersModal: true})} - > - {'Manage Members'} - -
    • - ); + if (!isDirect && isAdmin) { + if (!ChannelStore.isDefault(channel)) { + manageMembersOption = ( +
  • + this.setState({showMembersModal: true})} + > + {'Manage Members'} + +
    • + ); + + deleteChannelOption = ( +
  • + + {'Delete Channel...'} + +
    • + ); + } renameChannelOption = (
  • @@ -206,21 +223,6 @@ export default class Navbar extends React.Component {
    • ); - - deleteChannelOption = ( -
  • - - {'Delete Channel...'} - -
    • - ); } var notificationPreferenceOption; diff --git a/web/react/components/rename_channel_modal.jsx b/web/react/components/rename_channel_modal.jsx index 9fb3af035..f47009cce 100644 --- a/web/react/components/rename_channel_modal.jsx +++ b/web/react/components/rename_channel_modal.jsx @@ -5,6 +5,7 @@ const Utils = require('../utils/utils.jsx'); const Client = require('../utils/client.jsx'); const AsyncClient = require('../utils/async_client.jsx'); const ChannelStore = require('../stores/channel_store.jsx'); +const Constants = require('../utils/constants.jsx'); export default class RenameChannelModal extends React.Component { constructor(props) { @@ -36,10 +37,10 @@ export default class RenameChannelModal extends React.Component { return; } - let channel = ChannelStore.get(this.state.channelId); + const channel = ChannelStore.get(this.state.channelId); const oldName = channel.name; const oldDisplayName = channel.displayName; - let state = {serverError: ''}; + const state = {serverError: ''}; channel.display_name = this.state.displayName.trim(); if (!channel.display_name) { @@ -60,7 +61,7 @@ export default class RenameChannelModal extends React.Component { state.nameError = 'This field must be less than 22 characters'; state.invalid = true; } else { - let cleanedName = Utils.cleanUpUrlable(channel.name); + const cleanedName = Utils.cleanUpUrlable(channel.name); if (cleanedName === channel.name) { state.nameError = ''; } else { @@ -76,7 +77,7 @@ export default class RenameChannelModal extends React.Component { } Client.updateChannel(channel, - function handleUpdateSuccess() { + () => { $(ReactDOM.findDOMNode(this.refs.modal)).modal('hide'); AsyncClient.getChannel(channel.id); @@ -84,12 +85,12 @@ export default class RenameChannelModal extends React.Component { ReactDOM.findDOMNode(this.refs.displayName).value = ''; ReactDOM.findDOMNode(this.refs.channelName).value = ''; - }.bind(this), - function handleUpdateError(err) { + }, + (err) => { state.serverError = err.message; state.invalid = true; this.setState(state); - }.bind(this) + } ); } onNameChange() { @@ -99,10 +100,12 @@ export default class RenameChannelModal extends React.Component { this.setState({displayName: ReactDOM.findDOMNode(this.refs.displayName).value}); } displayNameKeyUp() { - const displayName = ReactDOM.findDOMNode(this.refs.displayName).value.trim(); - const channelName = Utils.cleanUpUrlable(displayName); - ReactDOM.findDOMNode(this.refs.channelName).value = channelName; - this.setState({channelName: channelName}); + if (this.state.channelName !== Constants.DEFAULT_CHANNEL) { + const displayName = ReactDOM.findDOMNode(this.refs.displayName).value.trim(); + const channelName = Utils.cleanUpUrlable(displayName); + ReactDOM.findDOMNode(this.refs.channelName).value = channelName; + this.setState({channelName: channelName}); + } } handleClose() { this.setState({ @@ -150,6 +153,15 @@ export default class RenameChannelModal extends React.Component { serverError =
    ; } + let handleInputLabel = 'Handle'; + let handleInputClass = 'form-control'; + let readOnlyHandleInput = false; + if (this.state.channelName === Constants.DEFAULT_CHANNEL) { + handleInputLabel += ' - Cannot be changed for the default channel'; + handleInputClass += ' disabled-input'; + readOnlyHandleInput = true; + } + return (
    - - Close + + {'Close'} -

    Rename Channel

    +

    {'Rename Channel'}

    - +
    - + {nameError}
    @@ -210,14 +223,14 @@ export default class RenameChannelModal extends React.Component { className='btn btn-default' data-dismiss='modal' > - Cancel + {'Cancel'}
    diff --git a/web/sass-files/sass/partials/_forms.scss b/web/sass-files/sass/partials/_forms.scss index 2d7b6cd26..9499d9b53 100644 --- a/web/sass-files/sass/partials/_forms.scss +++ b/web/sass-files/sass/partials/_forms.scss @@ -43,3 +43,7 @@ margin: 10px 0 0; color: #999; } + +.disabled-input { + background-color: #dddddd !important; +} \ No newline at end of file -- cgit v1.2.3-1-g7c22