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

* 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
This commit is contained in:
Tasos Boulis
2022-10-24 17:59:09 +03:00
committed by GitHub
parent 83b6c64cf3
commit 0f51a628f0
2 changed files with 20 additions and 20 deletions

View File

@@ -41,7 +41,7 @@ describe('Add Server Modal', function desc() {
let newServerView; let newServerView;
it('MM-T1312 should focus the first text input', async () => { 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; isFocused.should.be.true;
}); });

View File

@@ -300,28 +300,9 @@ function ConfigureServer({
{cardTitle || formatMessage({id: 'renderer.components.configureServer.cardtitle', defaultMessage: 'Enter your server details'})} {cardTitle || formatMessage({id: 'renderer.components.configureServer.cardtitle', defaultMessage: 'Enter your server details'})}
</p> </p>
<div className='ConfigureServer__card-form'> <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 <Input
name='url' name='url'
className='ConfigureServer__card-form-input' className='ConfigureServer__card-form-input'
containerClassName='ConfigureServer__card-form-input-container'
type='text' type='text'
inputSize={SIZE.LARGE} inputSize={SIZE.LARGE}
value={url} value={url}
@@ -337,6 +318,25 @@ function ConfigureServer({
disabled={waiting} disabled={waiting}
darkMode={darkMode} 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 <SaveButton
id='connectConfigureServer' id='connectConfigureServer'
extraClasses='ConfigureServer__card-form-button' extraClasses='ConfigureServer__card-form-button'