replace React bunder based on webpack with Vite #952

interface/src/framework/ap/APSettingsForm.tsx

@@ -6,7 +6,7 @@ import { Button, Checkbox, MenuItem } from '@mui/material';
 import WarningIcon from '@mui/icons-material/Warning';
 import CancelIcon from '@mui/icons-material/Cancel';
 
-import { createAPSettingsValidator, validate } from '../../validators';
+import { createAPSettingsValidator, validate } from 'validators';
 import {
   BlockFormControlLabel,
   ButtonRow,
@@ -15,13 +15,13 @@ import {
   ValidatedPasswordField,
   ValidatedTextField,
   BlockNavigation
-} from '../../components';
+} from 'components';
 
-import { APProvisionMode, APSettings } from '../../types';
-import { numberValue, updateValueDirty, useRest } from '../../utils';
-import * as APApi from '../../api/ap';
+import { APProvisionMode, APSettings } from 'types';
+import { numberValue, updateValueDirty, useRest } from 'utils';
+import * as APApi from 'api/ap';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 export const isAPEnabled = ({ provision_mode }: APSettings) => {
   return provision_mode === APProvisionMode.AP_MODE_ALWAYS || provision_mode === APProvisionMode.AP_MODE_DISCONNECTED;

interface/src/framework/ap/APStatusForm.tsx

@@ -6,12 +6,12 @@ import DeviceHubIcon from '@mui/icons-material/DeviceHub';
 import ComputerIcon from '@mui/icons-material/Computer';
 import RefreshIcon from '@mui/icons-material/Refresh';
 
-import * as APApi from '../../api/ap';
-import { APNetworkStatus, APStatus } from '../../types';
-import { ButtonRow, FormLoader, SectionContent } from '../../components';
-import { useRest } from '../../utils';
+import * as APApi from 'api/ap';
+import { APNetworkStatus, APStatus } from 'types';
+import { ButtonRow, FormLoader, SectionContent } from 'components';
+import { useRest } from 'utils';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 export const apStatusHighlight = ({ status }: APStatus, theme: Theme) => {
   switch (status) {

interface/src/framework/ap/AccessPoint.tsx

@@ -3,12 +3,12 @@ import { Navigate, Routes, Route } from 'react-router-dom';
 
 import { Tab } from '@mui/material';
 
-import { AuthenticatedContext } from '../../contexts/authentication';
+import { AuthenticatedContext } from 'contexts/authentication';
 import APStatusForm from './APStatusForm';
 import APSettingsForm from './APSettingsForm';
-import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from '../../components';
+import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from 'components';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const AccessPoint: FC = () => {
   const { LL } = useI18nContext();

interface/src/framework/mqtt/Mqtt.tsx

@@ -3,13 +3,13 @@ import { Navigate, Route, Routes } from 'react-router-dom';
 
 import { Tab } from '@mui/material';
 
-import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from '../../components';
-import { AuthenticatedContext } from '../../contexts/authentication';
+import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from 'components';
+import { AuthenticatedContext } from 'contexts/authentication';
 
 import MqttStatusForm from './MqttStatusForm';
 import MqttSettingsForm from './MqttSettingsForm';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const Mqtt: FC = () => {
   const { LL } = useI18nContext();

interface/src/framework/mqtt/MqttSettingsForm.tsx

@@ -6,7 +6,7 @@ import { Button, Checkbox, MenuItem, Grid, Typography, InputAdornment } from '@m
 import WarningIcon from '@mui/icons-material/Warning';
 import CancelIcon from '@mui/icons-material/Cancel';
 
-import { createMqttSettingsValidator, validate } from '../../validators';
+import { createMqttSettingsValidator, validate } from 'validators';
 import {
   BlockFormControlLabel,
   ButtonRow,
@@ -15,12 +15,12 @@ import {
   ValidatedPasswordField,
   ValidatedTextField,
   BlockNavigation
-} from '../../components';
-import { MqttSettings } from '../../types';
-import { numberValue, updateValueDirty, useRest } from '../../utils';
-import * as MqttApi from '../../api/mqtt';
+} from 'components';
+import { MqttSettings } from 'types';
+import { numberValue, updateValueDirty, useRest } from 'utils';
+import * as MqttApi from 'api/mqtt';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const MqttSettingsForm: FC = () => {
   const { loadData, saving, data, setData, origData, dirtyFlags, setDirtyFlags, blocker, saveData, errorMessage } =

interface/src/framework/mqtt/MqttStatusForm.tsx

@@ -7,12 +7,12 @@ import ReportIcon from '@mui/icons-material/Report';
 import SpeakerNotesOffIcon from '@mui/icons-material/SpeakerNotesOff';
 import AutoAwesomeMotionIcon from '@mui/icons-material/AutoAwesomeMotion';
 
-import { ButtonRow, FormLoader, SectionContent } from '../../components';
-import { MqttStatus, MqttDisconnectReason } from '../../types';
-import * as MqttApi from '../../api/mqtt';
-import { useRest } from '../../utils';
+import { ButtonRow, FormLoader, SectionContent } from 'components';
+import { MqttStatus, MqttDisconnectReason } from 'types';
+import * as MqttApi from 'api/mqtt';
+import { useRest } from 'utils';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 export const mqttStatusHighlight = ({ enabled, connected }: MqttStatus, theme: Theme) => {
   if (!enabled) {

interface/src/framework/network/NetworkConnection.tsx

@@ -3,15 +3,15 @@ import { Navigate, Routes, Route, useNavigate } from 'react-router-dom';
 
 import { Tab } from '@mui/material';
 
-import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from '../../components';
-import { WiFiNetwork } from '../../types';
-import { AuthenticatedContext } from '../../contexts/authentication';
+import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from 'components';
+import { WiFiNetwork } from 'types';
+import { AuthenticatedContext } from 'contexts/authentication';
 import { WiFiConnectionContext } from './WiFiConnectionContext';
 import NetworkStatusForm from './NetworkStatusForm';
 import WiFiNetworkScanner from './WiFiNetworkScanner';
 import NetworkSettingsForm from './NetworkSettingsForm';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const NetworkConnection: FC = () => {
   const { LL } = useI18nContext();

interface/src/framework/network/NetworkSettingsForm.tsx

@@ -31,19 +31,19 @@ import {
   ValidatedTextField,
   MessageBox,
   BlockNavigation
-} from '../../components';
-import { NetworkSettings } from '../../types';
-import * as NetworkApi from '../../api/network';
-import { numberValue, updateValueDirty, useRest } from '../../utils';
-import * as EMSESP from '../../project/api';
+} from 'components';
+import { NetworkSettings } from 'types';
+import * as NetworkApi from 'api/network';
+import { numberValue, updateValueDirty, useRest } from 'utils';
+import * as EMSESP from 'project/api';
 
 import { WiFiConnectionContext } from './WiFiConnectionContext';
 import { isNetworkOpen, networkSecurityMode } from './WiFiNetworkSelector';
 import { ValidateFieldsError } from 'async-validator';
-import { validate } from '../../validators';
-import { createNetworkSettingsValidator } from '../../validators/network';
+import { validate } from 'validators';
+import { createNetworkSettingsValidator } from 'validators/network';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 import RestartMonitor from '../system/RestartMonitor';
 
 const WiFiSettingsForm: FC = () => {

interface/src/framework/network/NetworkStatusForm.tsx

@@ -9,12 +9,12 @@ import DnsIcon from '@mui/icons-material/Dns';
 import RefreshIcon from '@mui/icons-material/Refresh';
 import RouterIcon from '@mui/icons-material/Router';
 
-import { ButtonRow, FormLoader, SectionContent } from '../../components';
-import { NetworkConnectionStatus, NetworkStatus } from '../../types';
-import * as NetworkApi from '../../api/network';
-import { useRest } from '../../utils';
+import { ButtonRow, FormLoader, SectionContent } from 'components';
+import { NetworkConnectionStatus, NetworkStatus } from 'types';
+import * as NetworkApi from 'api/network';
+import { useRest } from 'utils';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const isConnected = ({ status }: NetworkStatus) =>
   status === NetworkConnectionStatus.WIFI_STATUS_CONNECTED ||

interface/src/framework/network/WiFiConnectionContext.tsx

@@ -1,5 +1,5 @@
 import { createContext } from 'react';
-import { WiFiNetwork } from '../../types';
+import { WiFiNetwork } from 'types';
 
 export interface WiFiConnectionContextValue {
   selectedNetwork?: WiFiNetwork;

interface/src/framework/network/WiFiNetworkScanner.tsx

@@ -4,13 +4,13 @@ import { useSnackbar } from 'notistack';
 import { Button } from '@mui/material';
 import PermScanWifiIcon from '@mui/icons-material/PermScanWifi';
 
-import * as NetworkApi from '../../api/network';
-import { WiFiNetwork, WiFiNetworkList } from '../../types';
-import { ButtonRow, FormLoader, SectionContent } from '../../components';
+import * as NetworkApi from 'api/network';
+import { WiFiNetwork, WiFiNetworkList } from 'types';
+import { ButtonRow, FormLoader, SectionContent } from 'components';
 
 import WiFiNetworkSelector from './WiFiNetworkSelector';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const NUM_POLLS = 10;
 const POLLING_FREQUENCY = 500;

interface/src/framework/network/WiFiNetworkSelector.tsx

@@ -6,13 +6,13 @@ import LockOpenIcon from '@mui/icons-material/LockOpen';
 import LockIcon from '@mui/icons-material/Lock';
 import WifiIcon from '@mui/icons-material/Wifi';
 
-import { MessageBox } from '../../components';
+import { MessageBox } from 'components';
 
-import { WiFiEncryptionType, WiFiNetwork, WiFiNetworkList } from '../../types';
+import { WiFiEncryptionType, WiFiNetwork, WiFiNetworkList } from 'types';
 
 import { WiFiConnectionContext } from './WiFiConnectionContext';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 interface WiFiNetworkSelectorProps {
   networkList: WiFiNetworkList;

interface/src/framework/ntp/NTPSettingsForm.tsx

@@ -5,7 +5,7 @@ import { Button, Checkbox, MenuItem } from '@mui/material';
 import WarningIcon from '@mui/icons-material/Warning';
 import CancelIcon from '@mui/icons-material/Cancel';
 
-import { validate } from '../../validators';
+import { validate } from 'validators';
 import {
   BlockFormControlLabel,
   ButtonRow,
@@ -13,14 +13,14 @@ import {
   SectionContent,
   ValidatedTextField,
   BlockNavigation
-} from '../../components';
-import { NTPSettings } from '../../types';
-import { updateValueDirty, useRest } from '../../utils';
-import * as NTPApi from '../../api/ntp';
+} from 'components';
+import { NTPSettings } from 'types';
+import { updateValueDirty, useRest } from 'utils';
+import * as NTPApi from 'api/ntp';
 import { selectedTimeZone, timeZoneSelectItems, TIME_ZONES } from './TZ';
-import { NTP_SETTINGS_VALIDATOR } from '../../validators/ntp';
+import { NTP_SETTINGS_VALIDATOR } from 'validators/ntp';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const NTPSettingsForm: FC = () => {
   const { loadData, saving, data, setData, origData, dirtyFlags, setDirtyFlags, blocker, saveData, errorMessage } =

interface/src/framework/ntp/NTPStatusForm.tsx

@@ -26,13 +26,13 @@ import UpdateIcon from '@mui/icons-material/Update';
 import DnsIcon from '@mui/icons-material/Dns';
 import CancelIcon from '@mui/icons-material/Cancel';
 
-import * as NTPApi from '../../api/ntp';
-import { NTPStatus, NTPSyncStatus } from '../../types';
-import { ButtonRow, FormLoader, SectionContent } from '../../components';
-import { extractErrorMessage, formatDateTime, formatLocalDateTime, useRest } from '../../utils';
-import { AuthenticatedContext } from '../../contexts/authentication';
+import * as NTPApi from 'api/ntp';
+import { NTPStatus, NTPSyncStatus } from 'types';
+import { ButtonRow, FormLoader, SectionContent } from 'components';
+import { extractErrorMessage, formatDateTime, formatLocalDateTime, useRest } from 'utils';
+import { AuthenticatedContext } from 'contexts/authentication';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 export const isNtpActive = ({ status }: NTPStatus) => status === NTPSyncStatus.NTP_ACTIVE;
 export const isNtpEnabled = ({ status }: NTPStatus) => status !== NTPSyncStatus.NTP_DISABLED;
@@ -127,7 +127,6 @@ const NTPStatusForm: FC = () => {
           onClick={configureTime}
           disabled={processing}
           color="primary"
-          autoFocus
         >
           {LL.UPDATE()}
         </Button>

interface/src/framework/ntp/NetworkTime.tsx

@@ -3,13 +3,13 @@ import { Navigate, Route, Routes } from 'react-router-dom';
 
 import { Tab } from '@mui/material';
 
-import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from '../../components';
-import { AuthenticatedContext } from '../../contexts/authentication';
+import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from 'components';
+import { AuthenticatedContext } from 'contexts/authentication';
 
 import NTPStatusForm from './NTPStatusForm';
 import NTPSettingsForm from './NTPSettingsForm';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const NetworkTime: FC = () => {
   const { LL } = useI18nContext();

interface/src/framework/security/GenerateToken.tsx

@@ -13,13 +13,13 @@ import {
 
 import CloseIcon from '@mui/icons-material/Close';
 
-import { extractErrorMessage } from '../../utils';
+import { extractErrorMessage } from 'utils';
 import { useSnackbar } from 'notistack';
-import { MessageBox } from '../../components';
-import * as SecurityApi from '../../api/security';
-import { Token } from '../../types';
+import { MessageBox } from 'components';
+import * as SecurityApi from 'api/security';
+import { Token } from 'types';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 interface GenerateTokenProps {
   username?: string;

interface/src/framework/security/ManageUsersForm.tsx

@@ -9,18 +9,17 @@ import CheckIcon from '@mui/icons-material/Check';
 import CloseIcon from '@mui/icons-material/Close';
 import VpnKeyIcon from '@mui/icons-material/VpnKey';
 
-import { Table } from '@table-library/react-table-library/table';
 import { useTheme } from '@table-library/react-table-library/theme';
-import { Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table';
+import { Table, Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table';
 
-import * as SecurityApi from '../../api/security';
-import { SecuritySettings, User } from '../../types';
-import { ButtonRow, FormLoader, MessageBox, SectionContent } from '../../components';
-import { createUserValidator } from '../../validators';
-import { useRest } from '../../utils';
-import { AuthenticatedContext } from '../../contexts/authentication';
+import * as SecurityApi from 'api/security';
+import { SecuritySettings, User } from 'types';
+import { ButtonRow, FormLoader, MessageBox, SectionContent } from 'components';
+import { createUserValidator } from 'validators';
+import { useRest } from 'utils';
+import { AuthenticatedContext } from 'contexts/authentication';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 import GenerateToken from './GenerateToken';
 import UserForm from './UserForm';

interface/src/framework/security/Security.tsx

@@ -3,12 +3,12 @@ import { Navigate, Routes, Route } from 'react-router-dom';
 
 import { Tab } from '@mui/material';
 
-import { RouterTabs, useRouterTab, useLayoutTitle } from '../../components';
+import { RouterTabs, useRouterTab, useLayoutTitle } from 'components';
 
 import SecuritySettingsForm from './SecuritySettingsForm';
 import ManageUsersForm from './ManageUsersForm';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const Security: FC = () => {
   const { LL } = useI18nContext();

interface/src/framework/security/SecuritySettingsForm.tsx

@@ -5,21 +5,14 @@ import { Button } from '@mui/material';
 import WarningIcon from '@mui/icons-material/Warning';
 import CancelIcon from '@mui/icons-material/Cancel';
 
-import * as SecurityApi from '../../api/security';
-import { SecuritySettings } from '../../types';
-import {
-  ButtonRow,
-  FormLoader,
-  MessageBox,
-  SectionContent,
-  ValidatedPasswordField,
-  BlockNavigation
-} from '../../components';
-import { SECURITY_SETTINGS_VALIDATOR, validate } from '../../validators';
-import { updateValueDirty, useRest } from '../../utils';
-import { AuthenticatedContext } from '../../contexts/authentication';
+import * as SecurityApi from 'api/security';
+import { SecuritySettings } from 'types';
+import { ButtonRow, FormLoader, MessageBox, SectionContent, ValidatedPasswordField, BlockNavigation } from 'components';
+import { SECURITY_SETTINGS_VALIDATOR, validate } from 'validators';
+import { updateValueDirty, useRest } from 'utils';
+import { AuthenticatedContext } from 'contexts/authentication';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const SecuritySettingsForm: FC = () => {
   const { LL } = useI18nContext();

interface/src/framework/security/UserForm.tsx

@@ -7,12 +7,12 @@ import SaveIcon from '@mui/icons-material/Save';
 
 import { Button, Checkbox, Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material';
 
-import { BlockFormControlLabel, ValidatedPasswordField, ValidatedTextField } from '../../components';
-import { User } from '../../types';
-import { updateValue } from '../../utils';
-import { validate } from '../../validators';
+import { BlockFormControlLabel, ValidatedPasswordField, ValidatedTextField } from 'components';
+import { User } from 'types';
+import { updateValue } from 'utils';
+import { validate } from 'validators';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 interface UserFormProps {
   creating: boolean;
@@ -93,7 +93,6 @@ const UserForm: FC<UserFormProps> = ({ creating, validator, user, setUser, onDon
               variant="outlined"
               onClick={validateAndDone}
               color="primary"
-              autoFocus
             >
               {creating ? LL.ADD(0) : LL.UPDATE()}
             </Button>

interface/src/framework/system/GeneralFileUpload.tsx

@@ -3,19 +3,19 @@ import { AxiosPromise } from 'axios';
 
 import { Typography, Button, Box } from '@mui/material';
 
-import { FileUploadConfig } from '../../api/endpoints';
+import { FileUploadConfig } from 'api/endpoints';
 
-import { SingleUpload, useFileUpload } from '../../components';
+import { SingleUpload, useFileUpload } from 'components';
 
 import DownloadIcon from '@mui/icons-material/GetApp';
 
 import { useSnackbar } from 'notistack';
 
-import { extractErrorMessage } from '../../utils';
+import { extractErrorMessage } from 'utils';
 
-import * as EMSESP from '../../project/api';
+import * as EMSESP from 'project/api';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 interface UploadFileProps {
   uploadGeneralFile: (file: File, config?: FileUploadConfig) => AxiosPromise<void>;

interface/src/framework/system/OTASettingsForm.tsx

@@ -4,7 +4,7 @@ import { Button, Checkbox } from '@mui/material';
 import WarningIcon from '@mui/icons-material/Warning';
 import CancelIcon from '@mui/icons-material/Cancel';
 
-import * as SystemApi from '../../api/system';
+import * as SystemApi from 'api/system';
 import {
   BlockFormControlLabel,
   ButtonRow,
@@ -13,16 +13,16 @@ import {
   ValidatedPasswordField,
   ValidatedTextField,
   BlockNavigation
-} from '../../components';
+} from 'components';
 
-import { OTASettings } from '../../types';
-import { numberValue, updateValueDirty, useRest } from '../../utils';
+import { OTASettings } from 'types';
+import { numberValue, updateValueDirty, useRest } from 'utils';
 
 import { ValidateFieldsError } from 'async-validator';
-import { validate } from '../../validators';
-import { OTA_SETTINGS_VALIDATOR } from '../../validators/system';
+import { validate } from 'validators';
+import { OTA_SETTINGS_VALIDATOR } from 'validators/system';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const OTASettingsForm: FC = () => {
   const { loadData, saving, data, setData, origData, dirtyFlags, setDirtyFlags, blocker, saveData, errorMessage } =

interface/src/framework/system/RestartMonitor.tsx

@@ -1,10 +1,9 @@
-import { useEffect } from 'react';
-import { FC, useRef, useState } from 'react';
+import { FC, useRef, useState, useEffect } from 'react';
 
-import * as SystemApi from '../../api/system';
-import { FormLoader } from '../../components';
+import * as SystemApi from 'api/system';
+import { FormLoader } from 'components';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const RESTART_TIMEOUT = 2 * 60 * 1000;
 const POLL_TIMEOUT = 2000;

interface/src/framework/system/System.tsx

@@ -3,15 +3,15 @@ import { Navigate, Routes, Route } from 'react-router-dom';
 
 import { Tab } from '@mui/material';
 
-import { useRouterTab, RouterTabs, useLayoutTitle, RequireAdmin } from '../../components';
-import { AuthenticatedContext } from '../../contexts/authentication';
+import { useRouterTab, RouterTabs, useLayoutTitle, RequireAdmin } from 'components';
+import { AuthenticatedContext } from 'contexts/authentication';
 import UploadFileForm from './UploadFileForm';
 import SystemStatusForm from './SystemStatusForm';
 import OTASettingsForm from './OTASettingsForm';
 
 import SystemLog from './SystemLog';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const System: FC = () => {
   const { LL } = useI18nContext();

interface/src/framework/system/SystemLog.tsx

@@ -2,21 +2,21 @@ import { FC, useState, useEffect, useCallback, useLayoutEffect } from 'react';
 
 import { Box, styled, Button, Checkbox, MenuItem, Grid, Slider, FormLabel } from '@mui/material';
 
-import * as SystemApi from '../../api/system';
-import { addAccessTokenParameter } from '../../api/authentication';
+import * as SystemApi from 'api/system';
+import { addAccessTokenParameter } from 'api/authentication';
 
-import { SectionContent, FormLoader, BlockFormControlLabel, ValidatedTextField } from '../../components';
+import { SectionContent, FormLoader, BlockFormControlLabel, ValidatedTextField } from 'components';
 
-import { LogSettings, LogEntry, LogEntries, LogLevel } from '../../types';
-import { updateValue, useRest, extractErrorMessage } from '../../utils';
+import { LogSettings, LogEntry, LogEntries, LogLevel } from 'types';
+import { updateValue, useRest, extractErrorMessage } from 'utils';
 
 import DownloadIcon from '@mui/icons-material/GetApp';
 
 import { useSnackbar } from 'notistack';
 
-import { EVENT_SOURCE_ROOT } from '../../api/endpoints';
+import { EVENT_SOURCE_ROOT } from 'api/endpoints';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 export const LOG_EVENTSOURCE_URL = EVENT_SOURCE_ROOT + 'log';
 
@@ -137,7 +137,7 @@ const SystemLog: FC = () => {
 
   const onDownload = () => {
     let result = '';
-    for (let i of logEntries.events) {
+    for (const i of logEntries.events) {
       result += i.t + ' ' + levelLabel(i.l) + ' ' + i.i + ': [' + i.n + '] ' + i.m + '\n';
     }
     const a = document.createElement('a');

interface/src/framework/system/SystemStatusForm.tsx

@@ -31,17 +31,17 @@ import BuildIcon from '@mui/icons-material/Build';
 import TimerIcon from '@mui/icons-material/Timer';
 import CancelIcon from '@mui/icons-material/Cancel';
 
-import { ButtonRow, FormLoader, SectionContent, MessageBox } from '../../components';
-import { SystemStatus, Version } from '../../types';
-import * as SystemApi from '../../api/system';
-import { extractErrorMessage, useRest } from '../../utils';
+import { ButtonRow, FormLoader, SectionContent, MessageBox } from 'components';
+import { SystemStatus, Version } from 'types';
+import * as SystemApi from 'api/system';
+import { extractErrorMessage, useRest } from 'utils';
 
-import { AuthenticatedContext } from '../../contexts/authentication';
+import { AuthenticatedContext } from 'contexts/authentication';
 
 import axios from 'axios';
 import RestartMonitor from './RestartMonitor';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 export const VERSIONCHECK_ENDPOINT = 'https://api.github.com/repos/emsesp/EMS-ESP32/releases/latest';
 export const VERSIONCHECK_DEV_ENDPOINT = 'https://api.github.com/repos/emsesp/EMS-ESP32/releases/tags/latest';
@@ -131,7 +131,6 @@ const SystemStatusForm: FC = () => {
           onClick={restart}
           disabled={processing}
           color="primary"
-          autoFocus
         >
           {LL.RESTART()}
         </Button>
@@ -238,7 +237,6 @@ const SystemStatusForm: FC = () => {
           variant="outlined"
           onClick={factoryReset}
           disabled={processing}
-          autoFocus
           color="error"
         >
           {LL.FACTORY_RESET()}

interface/src/framework/system/UploadFileForm.tsx

@@ -1,13 +1,13 @@
 import { FC, useRef, useState } from 'react';
 
-import * as SystemApi from '../../api/system';
-import { SectionContent } from '../../components';
-import { FileUploadConfig } from '../../api/endpoints';
+import * as SystemApi from 'api/system';
+import { SectionContent } from 'components';
+import { FileUploadConfig } from 'api/endpoints';
 
 import GeneralFileUpload from './GeneralFileUpload';
 import RestartMonitor from './RestartMonitor';
 
-import { useI18nContext } from '../../i18n/i18n-react';
+import { useI18nContext } from 'i18n/i18n-react';
 
 const UploadFileForm: FC = () => {
   const [restarting, setRestarting] = useState<boolean>();