diff options
| -rw-r--r-- | modern/src/other/ChangeServerPage.js | 22 |
1 files changed, 13 insertions, 9 deletions
diff --git a/modern/src/other/ChangeServerPage.js b/modern/src/other/ChangeServerPage.js index 70b18993..0343a941 100644 --- a/modern/src/other/ChangeServerPage.js +++ b/modern/src/other/ChangeServerPage.js @@ -1,8 +1,8 @@ -import React, { useState } from 'react'; +import React from 'react'; import ElectricalServicesIcon from '@mui/icons-material/ElectricalServices'; import { makeStyles } from '@mui/styles'; import { - Autocomplete, Button, Container, TextField, + Autocomplete, Container, createFilterOptions, TextField, } from '@mui/material'; import { useTranslation } from '../common/components/LocalizationProvider'; @@ -38,11 +38,9 @@ const ChangeServerPage = () => { const classes = useStyles(); const t = useTranslation(); - const [url, setUrl] = useState(currentServer); - const [loading, setLoading] = useState(false); + const filter = createFilterOptions(); - const handleSubmit = () => { - setLoading(true); + const handleSubmit = (url) => { if (window.webkit && window.webkit.messageHandlers.appInterface) { window.webkit.messageHandlers.appInterface.postMessage(`server|${url}`); } else if (window.appInterface) { @@ -60,10 +58,16 @@ const ChangeServerPage = () => { className={classes.field} options={officialServers} renderInput={(params) => <TextField {...params} label={t('settingsServer')} />} - value={url} - onChange={(_, value) => setUrl(value)} + value={currentServer} + onChange={(_, value) => handleSubmit(value)} + filterOptions={(options, params) => { + const filtered = filter(options, params); + if (params.inputValue && !filtered.includes(params.inputValue)) { + filtered.push(params.inputValue); + } + return filtered; + }} /> - <Button variant="outlined" color="secondary" onClick={handleSubmit} disabled={loading}>{t('sharedSave')}</Button> </Container> ); }; |