[MM-47776] Reverse order of input fields in server welcome screen (#2309) (#2314)

* Reverse order of inputs in Server modals (add/edit)

* Revert "Reverse order of inputs in Server modals (add/edit)"

This reverts commit f3d577dcd5c0e13d6d0e3c2cc4de588008f53e68.

* Update order of server fields in welcome screens

* Update server modal focus test

* Add margin between inputs

(cherry picked from commit 0f51a628f0)

Co-authored-by: Tasos Boulis <tboulis@hotmail.com>
This commit is contained in:
Mattermost Build 2022-10-24 17:59:22 +03:00 committed by GitHub
parent 27a64cce1c
commit e50e2e85b0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 20 additions and 20 deletions

View file

@ -41,7 +41,7 @@ describe('Add Server Modal', function desc() {
let newServerView;
it('MM-T1312 should focus the first text input', async () => {
const isFocused = await newServerView.$eval('#teamNameInput', (el) => el === document.activeElement);
const isFocused = await newServerView.$eval('#teamNameInput', (el) => el.isSameNode(document.activeElement));
isFocused.should.be.true;
});

View file

@ -300,28 +300,9 @@ function ConfigureServer({
{cardTitle || formatMessage({id: 'renderer.components.configureServer.cardtitle', defaultMessage: 'Enter your server details'})}
</p>
<div className='ConfigureServer__card-form'>
<Input
name='name'
className='ConfigureServer__card-form-input'
type='text'
inputSize={SIZE.LARGE}
value={name}
onChange={handleNameOnChange}
customMessage={nameError ? ({
type: STATUS.ERROR,
value: nameError,
}) : ({
type: STATUS.INFO,
value: formatMessage({id: 'renderer.components.configureServer.name.info', defaultMessage: 'The name that will be displayed in your server list'}),
})}
placeholder={formatMessage({id: 'renderer.components.configureServer.name.placeholder', defaultMessage: 'Server display name'})}
disabled={waiting}
darkMode={darkMode}
/>
<Input
name='url'
className='ConfigureServer__card-form-input'
containerClassName='ConfigureServer__card-form-input-container'
type='text'
inputSize={SIZE.LARGE}
value={url}
@ -337,6 +318,25 @@ function ConfigureServer({
disabled={waiting}
darkMode={darkMode}
/>
<Input
name='name'
className='ConfigureServer__card-form-input'
containerClassName='ConfigureServer__card-form-input-container'
type='text'
inputSize={SIZE.LARGE}
value={name}
onChange={handleNameOnChange}
customMessage={nameError ? ({
type: STATUS.ERROR,
value: nameError,
}) : ({
type: STATUS.INFO,
value: formatMessage({id: 'renderer.components.configureServer.name.info', defaultMessage: 'The name that will be displayed in your server list'}),
})}
placeholder={formatMessage({id: 'renderer.components.configureServer.name.placeholder', defaultMessage: 'Server display name'})}
disabled={waiting}
darkMode={darkMode}
/>
<SaveButton
id='connectConfigureServer'
extraClasses='ConfigureServer__card-form-button'