[MM-61144][MM-60704] Show badges and allow Edit Server modal for permissions for pre-defined servers (#3175)

This commit is contained in:
Devin Binnie
2024-10-24 13:12:53 -04:00
committed by GitHub
parent 97a872a925
commit 0652f7ff80
3 changed files with 107 additions and 94 deletions

View File

@@ -171,7 +171,9 @@ export class ServerViewState {
mainWindow); mainWindow);
modalPromise.then((data) => { modalPromise.then((data) => {
ServerManager.editServer(id, data.server); if (!server.isPredefined) {
ServerManager.editServer(id, data.server);
}
PermissionsManager.setForServer(server, data.permissions); PermissionsManager.setForServer(server, data.permissions);
}).catch((e) => { }).catch((e) => {
// e is undefined for user cancellation // e is undefined for user cancellation

View File

@@ -313,23 +313,31 @@ class NewServerModal extends React.PureComponent<Props, State> {
}; };
save = () => { save = () => {
if (!this.state.validationResult) { if (this.props.editMode && this.props.server?.isPredefined) {
return; this.setState({
} saveStarted: true,
}, () => {
this.props.onSave?.(this.props.server!, this.state.permissions);
});
} else {
if (!this.state.validationResult) {
return;
}
if (this.isServerURLErrored()) { if (this.isServerURLErrored()) {
return; return;
} }
this.setState({ this.setState({
saveStarted: true, saveStarted: true,
}, () => { }, () => {
this.props.onSave?.({ this.props.onSave?.({
url: this.state.serverUrl, url: this.state.serverUrl,
name: this.state.serverName, name: this.state.serverName,
id: this.state.serverId, id: this.state.serverId,
}, this.state.permissions); }, this.state.permissions);
}); });
}
}; };
getSaveButtonLabel() { getSaveButtonLabel() {
@@ -413,73 +421,77 @@ class NewServerModal extends React.PureComponent<Props, State> {
</Modal.Header> </Modal.Header>
<Modal.Body> <Modal.Body>
<form> {!(this.props.editMode && this.props.server?.isPredefined) &&
<FormGroup> <>
<FormLabel> <form>
<FormattedMessage <FormGroup>
id='renderer.components.newServerModal.serverURL' <FormLabel>
defaultMessage='Server URL' <FormattedMessage
/> id='renderer.components.newServerModal.serverURL'
</FormLabel> defaultMessage='Server URL'
<FormControl />
id='serverUrlInput' </FormLabel>
type='text' <FormControl
value={this.state.serverUrl} id='serverUrlInput'
placeholder='https://example.com' type='text'
onChange={this.handleServerUrlChange} value={this.state.serverUrl}
onClick={(e: React.MouseEvent<HTMLInputElement>) => { placeholder='https://example.com'
e.stopPropagation(); onChange={this.handleServerUrlChange}
}} onClick={(e: React.MouseEvent<HTMLInputElement>) => {
ref={(ref: HTMLInputElement) => { e.stopPropagation();
this.serverUrlInputRef = ref; }}
if (this.props.setInputRef) { ref={(ref: HTMLInputElement) => {
this.props.setInputRef(ref); this.serverUrlInputRef = ref;
} if (this.props.setInputRef) {
}} this.props.setInputRef(ref);
isInvalid={this.isServerURLErrored()} }
autoFocus={true} }}
/> isInvalid={this.isServerURLErrored()}
<FormControl.Feedback/> autoFocus={true}
<FormText> />
<FormattedMessage <FormControl.Feedback/>
id='renderer.components.newServerModal.serverURL.description' <FormText>
defaultMessage='The URL of your Mattermost server. Must start with http:// or https://.' <FormattedMessage
/> id='renderer.components.newServerModal.serverURL.description'
</FormText> defaultMessage='The URL of your Mattermost server. Must start with http:// or https://.'
</FormGroup> />
<FormGroup className='NewServerModal-noBottomSpace'> </FormText>
<FormLabel> </FormGroup>
<FormattedMessage <FormGroup className='NewServerModal-noBottomSpace'>
id='renderer.components.newServerModal.serverDisplayName' <FormLabel>
defaultMessage='Server Display Name' <FormattedMessage
/> id='renderer.components.newServerModal.serverDisplayName'
</FormLabel> defaultMessage='Server Display Name'
<FormControl />
id='serverNameInput' </FormLabel>
type='text' <FormControl
value={this.state.serverName} id='serverNameInput'
placeholder={this.props.intl.formatMessage({id: 'renderer.components.newServerModal.serverDisplayName', defaultMessage: 'Server Display Name'})} type='text'
onChange={this.handleServerNameChange} value={this.state.serverName}
onClick={(e: React.MouseEvent<HTMLInputElement>) => { placeholder={this.props.intl.formatMessage({id: 'renderer.components.newServerModal.serverDisplayName', defaultMessage: 'Server Display Name'})}
e.stopPropagation(); onChange={this.handleServerNameChange}
}} onClick={(e: React.MouseEvent<HTMLInputElement>) => {
isInvalid={!this.state.serverName.length} e.stopPropagation();
/> }}
<FormControl.Feedback/> isInvalid={!this.state.serverName.length}
<FormText className='NewServerModal-noBottomSpace'> />
<FormattedMessage <FormControl.Feedback/>
id='renderer.components.newServerModal.serverDisplayName.description' <FormText className='NewServerModal-noBottomSpace'>
defaultMessage='The name of the server displayed on your desktop app tab bar.' <FormattedMessage
/> id='renderer.components.newServerModal.serverDisplayName.description'
</FormText> defaultMessage='The name of the server displayed on your desktop app tab bar.'
</FormGroup> />
</form> </FormText>
<div </FormGroup>
className='NewServerModal-validation' </form>
> <div
{this.getServerNameMessage()} className='NewServerModal-validation'
{this.getServerURLMessage()} >
</div> {this.getServerNameMessage()}
{this.getServerURLMessage()}
</div>
</>
}
{this.props.editMode && {this.props.editMode &&
<> <>
<hr/> <hr/>

View File

@@ -209,9 +209,6 @@ class ServerDropdown extends React.PureComponent<Record<string, never>, State> {
}; };
editServer = (serverId: string) => { editServer = (serverId: string) => {
if (this.serverIsPredefined(serverId)) {
return () => {};
}
return (event: React.MouseEvent<HTMLButtonElement>) => { return (event: React.MouseEvent<HTMLButtonElement>) => {
event.stopPropagation(); event.stopPropagation();
window.desktop.serverDropdown.showEditServerModal(serverId); window.desktop.serverDropdown.showEditServerModal(serverId);
@@ -333,23 +330,25 @@ class ServerDropdown extends React.PureComponent<Record<string, never>, State> {
{this.isActiveServer(server) ? <i className='icon-check'/> : <i className='icon-server-variant'/>} {this.isActiveServer(server) ? <i className='icon-check'/> : <i className='icon-server-variant'/>}
<span>{server.name}</span> <span>{server.name}</span>
</div> </div>
{!server.isPredefined && <div className='ServerDropdown__indicators'> <div className='ServerDropdown__indicators'>
<button <button
className='ServerDropdown__button-edit' className='ServerDropdown__button-edit'
onClick={this.editServer(server.id!)} onClick={this.editServer(server.id!)}
> >
<i className='icon-pencil-outline'/> <i className='icon-pencil-outline'/>
</button> </button>
<button {!server.isPredefined &&
className='ServerDropdown__button-remove' <button
onClick={this.removeServer(server.id!)} className='ServerDropdown__button-remove'
> onClick={this.removeServer(server.id!)}
<i className='icon-trash-can-outline'/> >
</button> <i className='icon-trash-can-outline'/>
</button>
}
{badgeDiv && <div className='ServerDropdown__badge'> {badgeDiv && <div className='ServerDropdown__badge'>
{badgeDiv} {badgeDiv}
</div>} </div>}
</div>} </div>
</button> </button>
)} )}
</Draggable> </Draggable>