Optimize WebUI rendering when using Dialog Boxes #1116

This commit is contained in:
Proddy
2023-04-28 12:46:59 +02:00
parent b9402d3a01
commit cfe8c410ae
59 changed files with 1446 additions and 1120 deletions

View File

@@ -1,7 +1,7 @@
import CancelIcon from '@mui/icons-material/Cancel';
import PowerSettingsNewIcon from '@mui/icons-material/PowerSettingsNew';
import WarningIcon from '@mui/icons-material/Warning';
import { Box, Button, Checkbox, MenuItem, Grid, Typography, Divider, InputAdornment } from '@mui/material';
import { Box, Button, Checkbox, MenuItem, Grid, Typography, Divider, InputAdornment, TextField } from '@mui/material';
import { useState } from 'react';
import { toast } from 'react-toastify';
@@ -132,7 +132,7 @@ const SettingsApplication: FC = () => {
<Box color="warning.main">
<Typography variant="body2">{LL.BOARD_PROFILE_TEXT()}</Typography>
</Box>
<ValidatedTextField
<TextField
name="board_profile"
label={LL.BOARD_PROFILE()}
value={data.board_profile}
@@ -148,7 +148,7 @@ const SettingsApplication: FC = () => {
<MenuItem key={'CUSTOM'} value={'CUSTOM'}>
{LL.CUSTOM()}&hellip;
</MenuItem>
</ValidatedTextField>
</TextField>
{data.board_profile === 'CUSTOM' && (
<>
<Grid
@@ -230,7 +230,7 @@ const SettingsApplication: FC = () => {
/>
</Grid>
<Grid item xs={12} sm={6} md={4}>
<ValidatedTextField
<TextField
name="phy_type"
label={LL.PHY_TYPE()}
disabled={saving}
@@ -244,7 +244,7 @@ const SettingsApplication: FC = () => {
<MenuItem value={0}>{LL.DISABLED(1)}</MenuItem>
<MenuItem value={1}>LAN8720</MenuItem>
<MenuItem value={2}>TLK110</MenuItem>
</ValidatedTextField>
</TextField>
</Grid>
</Grid>
{data.phy_type !== 0 && (
@@ -257,7 +257,7 @@ const SettingsApplication: FC = () => {
alignItems="flex-start"
>
<Grid item xs={12} sm={6} md={4}>
<ValidatedTextField
<TextField
name="eth_power"
label={LL.GPIO_OF('PHY Power') + ' (-1=' + LL.DISABLED(1) + ')'}
fullWidth
@@ -270,7 +270,7 @@ const SettingsApplication: FC = () => {
/>
</Grid>
<Grid item xs={12} sm={6} md={4}>
<ValidatedTextField
<TextField
name="eth_phy_addr"
label={LL.ADDRESS_OF('PHY I²C')}
fullWidth
@@ -283,7 +283,7 @@ const SettingsApplication: FC = () => {
/>
</Grid>
<Grid item xs={12} sm={6} md={4}>
<ValidatedTextField
<TextField
name="eth_clock_mode"
label="PHY Clk"
disabled={saving}
@@ -298,7 +298,7 @@ const SettingsApplication: FC = () => {
<MenuItem value={1}>GPIO0_OUT</MenuItem>
<MenuItem value={2}>GPIO16_OUT</MenuItem>
<MenuItem value={3}>GPIO17_OUT</MenuItem>
</ValidatedTextField>
</TextField>
</Grid>
</Grid>
)}
@@ -309,7 +309,7 @@ const SettingsApplication: FC = () => {
</Typography>
<Grid container spacing={1} direction="row" justifyContent="flex-start" alignItems="flex-start">
<Grid item xs={12} sm={6}>
<ValidatedTextField
<TextField
name="tx_mode"
label={LL.TX_MODE()}
disabled={saving}
@@ -324,10 +324,10 @@ const SettingsApplication: FC = () => {
<MenuItem value={2}>EMS+</MenuItem>
<MenuItem value={3}>HT3</MenuItem>
<MenuItem value={4}>{LL.HARDWARE()}</MenuItem>
</ValidatedTextField>
</TextField>
</Grid>
<Grid item xs={12} sm={6}>
<ValidatedTextField
<TextField
name="ems_bus_id"
label={LL.ID_OF(LL.EMS_BUS(1))}
disabled={saving}
@@ -349,14 +349,14 @@ const SettingsApplication: FC = () => {
<MenuItem value={0x4b}>Gateway 4 (0x4B)</MenuItem>
<MenuItem value={0x4c}>Gateway 5 (0x4C)</MenuItem>
<MenuItem value={0x4d}>Gateway 7 (0x4D)</MenuItem>
</ValidatedTextField>
</TextField>
</Grid>
</Grid>
<Typography sx={{ pt: 2 }} variant="h6" color="primary">
{LL.GENERAL_OPTIONS()}
</Typography>
<Grid item>
<ValidatedTextField
<TextField
name="locale"
label={LL.LANGUAGE_ENTITIES()}
disabled={saving}
@@ -376,7 +376,7 @@ const SettingsApplication: FC = () => {
<MenuItem value="pl">Polski (PL)</MenuItem>
<MenuItem value="sv">Svenska (SV)</MenuItem>
<MenuItem value="tr">Türk (TR)</MenuItem>
</ValidatedTextField>
</TextField>
</Grid>
{data.led_gpio !== 0 && (
<BlockFormControlLabel
@@ -478,7 +478,7 @@ const SettingsApplication: FC = () => {
</Typography>
<Grid container spacing={1} direction="row" justifyContent="flex-start" alignItems="flex-start">
<Grid item xs={12} sm={6} md={4}>
<ValidatedTextField
<TextField
name="bool_dashboard"
label={LL.BOOLEAN_FORMAT_DASHBOARD()}
value={data.bool_dashboard}
@@ -492,10 +492,10 @@ const SettingsApplication: FC = () => {
<MenuItem value={2}>{LL.ONOFF_CAP()}</MenuItem>
<MenuItem value={3}>true/false</MenuItem>
<MenuItem value={5}>1/0</MenuItem>
</ValidatedTextField>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={4}>
<ValidatedTextField
<TextField
name="bool_format"
label={LL.BOOLEAN_FORMAT_API()}
value={data.bool_format}
@@ -511,10 +511,10 @@ const SettingsApplication: FC = () => {
<MenuItem value={4}>true/false</MenuItem>
<MenuItem value={5}>&quot;1&quot;/&quot;0&quot;</MenuItem>
<MenuItem value={6}>1/0</MenuItem>
</ValidatedTextField>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={4}>
<ValidatedTextField
<TextField
name="enum_format"
label={LL.ENUM_FORMAT()}
value={data.enum_format}
@@ -526,7 +526,7 @@ const SettingsApplication: FC = () => {
>
<MenuItem value={1}>{LL.VALUE(1)}</MenuItem>
<MenuItem value={2}>{LL.INDEX()}</MenuItem>
</ValidatedTextField>
</TextField>
</Grid>
</Grid>
{data.dallas_gpio !== 0 && (
@@ -590,7 +590,7 @@ const SettingsApplication: FC = () => {
/>
</Grid>
<Grid item xs={12} sm={6}>
<ValidatedTextField
<TextField
name="syslog_level"
label={LL.LOG_LEVEL()}
value={data.syslog_level}
@@ -607,7 +607,7 @@ const SettingsApplication: FC = () => {
<MenuItem value={6}>INFO</MenuItem>
<MenuItem value={7}>DEBUG</MenuItem>
<MenuItem value={9}>ALL</MenuItem>
</ValidatedTextField>
</TextField>
</Grid>
<Grid item xs={12} sm={6}>
<ValidatedTextField
@@ -635,7 +635,6 @@ const SettingsApplication: FC = () => {
</Button>
</MessageBox>
)}
{!restartNeeded && dirtyFlags && dirtyFlags.length !== 0 && (
<ButtonRow>
<Button