From 19e8e4a7a10dbf10c777cb5fefa53c5309cff4dc Mon Sep 17 00:00:00 2001 From: Proddy Date: Sat, 22 Apr 2023 09:47:29 +0200 Subject: [PATCH] initial lint cleanup --- interface/src/App.tsx | 7 +- interface/src/AppRouting.tsx | 12 +- interface/src/AuthenticatedRouting.tsx | 18 +-- interface/src/CustomTheme.tsx | 7 +- interface/src/SignIn.tsx | 33 ++-- interface/src/api/ap.ts | 6 +- interface/src/api/authentication.ts | 13 +- interface/src/api/endpoints.ts | 10 +- interface/src/api/features.ts | 7 +- interface/src/api/mqtt.ts | 5 +- interface/src/api/network.ts | 7 +- interface/src/api/ntp.ts | 5 +- interface/src/api/security.ts | 7 +- interface/src/api/system.ts | 8 +- interface/src/components/ButtonRow.tsx | 43 +++-- interface/src/components/MessageBox.tsx | 9 +- interface/src/components/SectionContent.tsx | 5 +- .../inputs/BlockFormControlLabel.tsx | 5 +- .../inputs/ValidatedPasswordField.tsx | 9 +- .../components/inputs/ValidatedTextField.tsx | 8 +- interface/src/components/layout/Layout.tsx | 15 +- .../src/components/layout/LayoutAppBar.tsx | 64 ++++---- .../src/components/layout/LayoutAuthMenu.tsx | 28 ++-- .../src/components/layout/LayoutDrawer.tsx | 8 +- .../src/components/layout/LayoutMenu.tsx | 19 ++- .../src/components/layout/LayoutMenuItem.tsx | 9 +- .../components/loading/ApplicationError.tsx | 5 +- .../src/components/loading/FormLoader.tsx | 5 +- .../src/components/loading/LoadingSpinner.tsx | 6 +- .../components/routing/BlockNavigation.tsx | 4 +- .../src/components/routing/RequireAdmin.tsx | 5 +- .../routing/RequireAuthenticated.tsx | 14 +- .../routing/RequireUnauthenticated.tsx | 5 +- .../src/components/routing/RouterTabs.tsx | 7 +- .../src/components/upload/SingleUpload.tsx | 16 +- .../src/components/upload/useFileUpload.ts | 16 +- .../authentication/Authentication.tsx | 14 +- .../src/contexts/authentication/context.ts | 2 +- .../src/contexts/features/FeaturesLoader.tsx | 15 +- interface/src/contexts/features/context.ts | 2 +- interface/src/framework/ap/APSettingsForm.tsx | 28 ++-- interface/src/framework/ap/APStatusForm.tsx | 15 +- interface/src/framework/ap/AccessPoint.tsx | 10 +- interface/src/framework/mqtt/Mqtt.tsx | 11 +- .../src/framework/mqtt/MqttSettingsForm.tsx | 21 ++- .../src/framework/mqtt/MqttStatusForm.tsx | 102 ++++++------ .../framework/network/NetworkConnection.tsx | 19 ++- .../framework/network/NetworkSettingsForm.tsx | 29 ++-- .../framework/network/NetworkStatusForm.tsx | 19 +-- .../network/WiFiConnectionContext.tsx | 2 +- .../framework/network/WiFiNetworkScanner.tsx | 15 +- .../framework/network/WiFiNetworkSelector.tsx | 50 +++--- .../src/framework/ntp/NTPSettingsForm.tsx | 23 ++- interface/src/framework/ntp/NTPStatusForm.tsx | 25 +-- interface/src/framework/ntp/NetworkTime.tsx | 11 +- .../src/framework/security/GenerateToken.tsx | 12 +- .../framework/security/ManageUsersForm.tsx | 32 ++-- interface/src/framework/security/Security.tsx | 10 +- .../security/SecuritySettingsForm.tsx | 16 +- interface/src/framework/security/UserForm.tsx | 12 +- .../src/framework/system/OTASettingsForm.tsx | 15 +- .../src/framework/system/RestartMonitor.tsx | 3 +- interface/src/framework/system/System.tsx | 15 +- interface/src/framework/system/SystemLog.tsx | 21 ++- .../src/framework/system/SystemStatusForm.tsx | 150 +++++++++--------- .../src/framework/system/UploadFileForm.tsx | 10 +- interface/src/project/Dashboard.tsx | 10 +- interface/src/project/DashboardStatus.tsx | 44 +++-- interface/src/project/DeviceIcon.tsx | 8 +- interface/src/project/Help.tsx | 8 +- interface/src/project/HelpInformation.tsx | 23 ++- interface/src/project/OptionIcon.tsx | 16 +- interface/src/project/SettingsApplication.tsx | 27 ++-- .../src/project/SettingsCustomization.tsx | 144 ++++++++--------- interface/src/project/api.ts | 7 +- interface/src/utils/time.ts | 9 +- interface/src/utils/useRest.ts | 6 +- interface/src/utils/useWs.ts | 2 +- interface/src/validators/ap.ts | 4 +- interface/src/validators/mqtt.ts | 2 +- interface/src/validators/network.ts | 2 +- interface/src/validators/security.ts | 5 +- 82 files changed, 701 insertions(+), 775 deletions(-) diff --git a/interface/src/App.tsx b/interface/src/App.tsx index 4fe3a46a5..5ed0e01dd 100644 --- a/interface/src/App.tsx +++ b/interface/src/App.tsx @@ -1,10 +1,11 @@ -import { FC, useEffect, useState } from 'react'; - +import { useEffect, useState } from 'react'; import { ToastContainer, Slide } from 'react-toastify'; +import type { FC } from 'react'; + import 'react-toastify/dist/ReactToastify.min.css'; -import CustomTheme from 'CustomTheme'; import AppRouting from 'AppRouting'; +import CustomTheme from 'CustomTheme'; import { localStorageDetector } from 'typesafe-i18n/detectors'; import TypesafeI18n from 'i18n/i18n-react'; diff --git a/interface/src/AppRouting.tsx b/interface/src/AppRouting.tsx index b71c9eba2..7e6507621 100644 --- a/interface/src/AppRouting.tsx +++ b/interface/src/AppRouting.tsx @@ -1,16 +1,16 @@ -import { FC, useContext, useEffect } from 'react'; +import { useContext, useEffect } from 'react'; import { Route, Routes, Navigate, useLocation } from 'react-router-dom'; import { toast } from 'react-toastify'; +import type { FC } from 'react'; -import { useI18nContext } from 'i18n/i18n-react'; - -import { Authentication, AuthenticationContext } from 'contexts/authentication'; +import AuthenticatedRouting from 'AuthenticatedRouting'; +import SignIn from 'SignIn'; import { RequireAuthenticated, RequireUnauthenticated } from 'components'; -import SignIn from 'SignIn'; -import AuthenticatedRouting from 'AuthenticatedRouting'; +import { Authentication, AuthenticationContext } from 'contexts/authentication'; +import { useI18nContext } from 'i18n/i18n-react'; interface SecurityRedirectProps { message: string; diff --git a/interface/src/AuthenticatedRouting.tsx b/interface/src/AuthenticatedRouting.tsx index cf4e7c2e0..eaf6041f2 100644 --- a/interface/src/AuthenticatedRouting.tsx +++ b/interface/src/AuthenticatedRouting.tsx @@ -1,21 +1,21 @@ -import { FC, useCallback, useEffect } from 'react'; +import { useCallback, useEffect } from 'react'; import { Navigate, Routes, Route, useNavigate, useLocation } from 'react-router-dom'; -import { AxiosError } from 'axios'; +import Dashboard from './project/Dashboard'; +import Help from './project/Help'; +import Settings from './project/Settings'; +import type { AxiosError } from 'axios'; +import type { FC } from 'react'; import * as AuthenticationApi from 'api/authentication'; import { AXIOS } from 'api/endpoints'; import { Layout, RequireAdmin } from 'components'; -import Dashboard from './project/Dashboard'; -import Settings from './project/Settings'; -import Help from './project/Help'; - -import NetworkConnection from 'framework/network/NetworkConnection'; import AccessPoint from 'framework/ap/AccessPoint'; -import NetworkTime from 'framework/ntp/NetworkTime'; import Mqtt from 'framework/mqtt/Mqtt'; -import System from 'framework/system/System'; +import NetworkConnection from 'framework/network/NetworkConnection'; +import NetworkTime from 'framework/ntp/NetworkTime'; import Security from 'framework/security/Security'; +import System from 'framework/system/System'; const AuthenticatedRouting: FC = () => { const location = useLocation(); diff --git a/interface/src/CustomTheme.tsx b/interface/src/CustomTheme.tsx index 91e1b5c5d..a482e0b28 100644 --- a/interface/src/CustomTheme.tsx +++ b/interface/src/CustomTheme.tsx @@ -1,10 +1,9 @@ -import { FC } from 'react'; - import { CssBaseline } from '@mui/material'; -import { createTheme, responsiveFontSizes, ThemeProvider } from '@mui/material/styles'; import { blueGrey, blue } from '@mui/material/colors'; +import { createTheme, responsiveFontSizes, ThemeProvider } from '@mui/material/styles'; +import type { FC } from 'react'; -import { RequiredChildrenProps } from 'utils'; +import type { RequiredChildrenProps } from 'utils'; const theme = responsiveFontSizes( createTheme({ diff --git a/interface/src/SignIn.tsx b/interface/src/SignIn.tsx index 85881c2f8..132f19b3b 100644 --- a/interface/src/SignIn.tsx +++ b/interface/src/SignIn.tsx @@ -1,31 +1,30 @@ -import { FC, useContext, useState } from 'react'; -import { ValidateFieldsError } from 'async-validator'; -import { toast } from 'react-toastify'; - -import { Box, Fab, Paper, Typography, Button } from '@mui/material'; import ForwardIcon from '@mui/icons-material/Forward'; +import { Box, Fab, Paper, Typography, Button } from '@mui/material'; +import { useContext, useState } from 'react'; +import { toast } from 'react-toastify'; +import type { ValidateFieldsError } from 'async-validator'; +import type { Locales } from 'i18n/i18n-types'; +import type { FC } from 'react'; +import type { SignInRequest } from 'types'; import * as AuthenticationApi from 'api/authentication'; import { PROJECT_NAME } from 'api/env'; + +import { ValidatedTextField } from 'components'; import { AuthenticationContext } from 'contexts/authentication'; -import { extractErrorMessage, onEnterCallback, updateValue } from 'utils'; -import { SignInRequest } from 'types'; -import { ValidatedTextField } from 'components'; -import { SIGN_IN_REQUEST_VALIDATOR, validate } from 'validators'; - -import { I18nContext } from 'i18n/i18n-react'; -import type { Locales } from 'i18n/i18n-types'; -import { loadLocaleAsync } from 'i18n/i18n-util.async'; - -import { ReactComponent as NLflag } from 'i18n/NL.svg'; import { ReactComponent as DEflag } from 'i18n/DE.svg'; import { ReactComponent as GBflag } from 'i18n/GB.svg'; -import { ReactComponent as SVflag } from 'i18n/SV.svg'; -import { ReactComponent as PLflag } from 'i18n/PL.svg'; +import { ReactComponent as NLflag } from 'i18n/NL.svg'; import { ReactComponent as NOflag } from 'i18n/NO.svg'; +import { ReactComponent as PLflag } from 'i18n/PL.svg'; +import { ReactComponent as SVflag } from 'i18n/SV.svg'; import { ReactComponent as FRflag } from 'i18n/FR.svg'; import { ReactComponent as TRflag } from 'i18n/TR.svg'; +import { I18nContext } from 'i18n/i18n-react'; +import { loadLocaleAsync } from 'i18n/i18n-util.async'; +import { extractErrorMessage, onEnterCallback, updateValue } from 'utils'; +import { SIGN_IN_REQUEST_VALIDATOR, validate } from 'validators'; const SignIn: FC = () => { const authenticationContext = useContext(AuthenticationContext); diff --git a/interface/src/api/ap.ts b/interface/src/api/ap.ts index 81d1f81f5..734a40f64 100644 --- a/interface/src/api/ap.ts +++ b/interface/src/api/ap.ts @@ -1,7 +1,7 @@ -import { AxiosPromise } from 'axios'; - -import { APSettings, APStatus } from 'types'; import { AXIOS } from './endpoints'; +import type { AxiosPromise } from 'axios'; + +import type { APSettings, APStatus } from 'types'; export function readAPStatus(): AxiosPromise { return AXIOS.get('/apStatus'); diff --git a/interface/src/api/authentication.ts b/interface/src/api/authentication.ts index 32d0c4f90..9b8b01030 100644 --- a/interface/src/api/authentication.ts +++ b/interface/src/api/authentication.ts @@ -1,11 +1,10 @@ -import { AxiosPromise } from 'axios'; -import * as H from 'history'; import jwtDecode from 'jwt-decode'; -import { Path } from 'react-router-dom'; - -import { Me, SignInRequest, SignInResponse } from 'types'; - import { ACCESS_TOKEN, AXIOS } from './endpoints'; +import type { AxiosPromise } from 'axios'; +import type * as H from 'history'; +import type { Path } from 'react-router-dom'; + +import type { Me, SignInRequest, SignInResponse } from 'types'; export const SIGN_IN_PATHNAME = 'loginPathname'; export const SIGN_IN_SEARCH = 'loginSearch'; @@ -45,7 +44,7 @@ export function fetchLoginRedirect(): Partial { } export const clearAccessToken = () => localStorage.removeItem(ACCESS_TOKEN); -export const decodeMeJWT = (accessToken: string): Me => jwtDecode(accessToken) as Me; +export const decodeMeJWT = (accessToken: string): Me => jwtDecode(accessToken); export function addAccessTokenParameter(url: string) { const accessToken = getStorage().getItem(ACCESS_TOKEN); diff --git a/interface/src/api/endpoints.ts b/interface/src/api/endpoints.ts index 18ad2a612..2e4f96f8a 100644 --- a/interface/src/api/endpoints.ts +++ b/interface/src/api/endpoints.ts @@ -1,6 +1,6 @@ -import axios, { AxiosPromise, CancelToken, AxiosProgressEvent } from 'axios'; - import { decode } from '@msgpack/msgpack'; +import axios from 'axios'; +import type { AxiosPromise, CancelToken, AxiosProgressEvent } from 'axios'; export const WS_BASE_URL = '/ws/'; export const API_BASE_URL = '/rest/'; @@ -72,11 +72,7 @@ export const AXIOS_BIN = axios.create({ return JSON.stringify(data); } ], - transformResponse: [ - (data) => { - return decode(data); - } - ] + transformResponse: [(data) => decode(data)] }); export interface FileUploadConfig { diff --git a/interface/src/api/features.ts b/interface/src/api/features.ts index c4e1605f9..6ada2405c 100644 --- a/interface/src/api/features.ts +++ b/interface/src/api/features.ts @@ -1,8 +1,7 @@ -import { AxiosPromise } from 'axios'; - -import { Features } from 'types'; - import { AXIOS } from './endpoints'; +import type { AxiosPromise } from 'axios'; + +import type { Features } from 'types'; export function readFeatures(): AxiosPromise { return AXIOS.get('/features'); diff --git a/interface/src/api/mqtt.ts b/interface/src/api/mqtt.ts index e3603050e..d599a3121 100644 --- a/interface/src/api/mqtt.ts +++ b/interface/src/api/mqtt.ts @@ -1,7 +1,6 @@ -import { AxiosPromise } from 'axios'; -import { MqttSettings, MqttStatus } from 'types'; - import { AXIOS } from './endpoints'; +import type { AxiosPromise } from 'axios'; +import type { MqttSettings, MqttStatus } from 'types'; export function readMqttStatus(): AxiosPromise { return AXIOS.get('/mqttStatus'); diff --git a/interface/src/api/network.ts b/interface/src/api/network.ts index 4993964ab..a9535336c 100644 --- a/interface/src/api/network.ts +++ b/interface/src/api/network.ts @@ -1,8 +1,7 @@ -import { AxiosPromise } from 'axios'; - -import { WiFiNetworkList, NetworkSettings, NetworkStatus } from 'types'; - import { AXIOS } from './endpoints'; +import type { AxiosPromise } from 'axios'; + +import type { WiFiNetworkList, NetworkSettings, NetworkStatus } from 'types'; export function readNetworkStatus(): AxiosPromise { return AXIOS.get('/networkStatus'); diff --git a/interface/src/api/ntp.ts b/interface/src/api/ntp.ts index cdd81862d..dcd3c7ca9 100644 --- a/interface/src/api/ntp.ts +++ b/interface/src/api/ntp.ts @@ -1,7 +1,6 @@ -import { AxiosPromise } from 'axios'; -import { NTPSettings, NTPStatus, Time } from 'types'; - import { AXIOS } from './endpoints'; +import type { AxiosPromise } from 'axios'; +import type { NTPSettings, NTPStatus, Time } from 'types'; export function readNTPStatus(): AxiosPromise { return AXIOS.get('/ntpStatus'); diff --git a/interface/src/api/security.ts b/interface/src/api/security.ts index dab188aaf..f46194432 100644 --- a/interface/src/api/security.ts +++ b/interface/src/api/security.ts @@ -1,8 +1,7 @@ -import { AxiosPromise } from 'axios'; - -import { SecuritySettings, Token } from 'types'; - import { AXIOS } from './endpoints'; +import type { AxiosPromise } from 'axios'; + +import type { SecuritySettings, Token } from 'types'; export function readSecuritySettings(): AxiosPromise { return AXIOS.get('/securitySettings'); diff --git a/interface/src/api/system.ts b/interface/src/api/system.ts index 5c5972c7b..dc9b34db6 100644 --- a/interface/src/api/system.ts +++ b/interface/src/api/system.ts @@ -1,8 +1,8 @@ -import { AxiosPromise } from 'axios'; +import { AXIOS, AXIOS_BIN, startUploadFile } from './endpoints'; +import type { FileUploadConfig } from './endpoints'; +import type { AxiosPromise } from 'axios'; -import { OTASettings, SystemStatus, LogSettings, LogEntries } from 'types'; - -import { AXIOS, AXIOS_BIN, FileUploadConfig, startUploadFile } from './endpoints'; +import type { OTASettings, SystemStatus, LogSettings, LogEntries } from 'types'; export function readSystemStatus(timeout?: number): AxiosPromise { return AXIOS.get('/systemStatus', { timeout }); diff --git a/interface/src/components/ButtonRow.tsx b/interface/src/components/ButtonRow.tsx index 40eb0182e..adf01472c 100644 --- a/interface/src/components/ButtonRow.tsx +++ b/interface/src/components/ButtonRow.tsx @@ -1,26 +1,25 @@ -import { FC } from 'react'; -import { Box, BoxProps } from '@mui/material'; +import { Box } from '@mui/material'; +import type { BoxProps } from '@mui/material'; +import type { FC } from 'react'; -const ButtonRow: FC = ({ children, ...rest }) => { - return ( - = ({ children, ...rest }) => ( + - {children} - - ); -}; + } + }} + {...rest} + > + {children} + +); export default ButtonRow; diff --git a/interface/src/components/MessageBox.tsx b/interface/src/components/MessageBox.tsx index a530d8f26..e7358e73c 100644 --- a/interface/src/components/MessageBox.tsx +++ b/interface/src/components/MessageBox.tsx @@ -1,11 +1,10 @@ -import { FC } from 'react'; - -import { Box, BoxProps, SvgIconProps, Theme, Typography, useTheme } from '@mui/material'; - import CheckCircleOutlineOutlinedIcon from '@mui/icons-material/CheckCircleOutlineOutlined'; +import ErrorIcon from '@mui/icons-material/Error'; import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'; import ReportProblemOutlinedIcon from '@mui/icons-material/ReportProblemOutlined'; -import ErrorIcon from '@mui/icons-material/Error'; +import { Box, Typography, useTheme } from '@mui/material'; +import type { BoxProps, SvgIconProps, Theme } from '@mui/material'; +import type { FC } from 'react'; type MessageBoxLevel = 'warning' | 'success' | 'info' | 'error'; diff --git a/interface/src/components/SectionContent.tsx b/interface/src/components/SectionContent.tsx index dfcb37e9b..95428d982 100644 --- a/interface/src/components/SectionContent.tsx +++ b/interface/src/components/SectionContent.tsx @@ -1,8 +1,7 @@ -import { FC } from 'react'; - import { Paper, Divider } from '@mui/material'; +import type { FC } from 'react'; -import { RequiredChildrenProps } from 'utils'; +import type { RequiredChildrenProps } from 'utils'; interface SectionContentProps extends RequiredChildrenProps { title: string; diff --git a/interface/src/components/inputs/BlockFormControlLabel.tsx b/interface/src/components/inputs/BlockFormControlLabel.tsx index e3e8b7cd3..8da7932a5 100644 --- a/interface/src/components/inputs/BlockFormControlLabel.tsx +++ b/interface/src/components/inputs/BlockFormControlLabel.tsx @@ -1,5 +1,6 @@ -import { FC } from 'react'; -import { FormControlLabel, FormControlLabelProps } from '@mui/material'; +import { FormControlLabel } from '@mui/material'; +import type { FormControlLabelProps } from '@mui/material'; +import type { FC } from 'react'; const BlockFormControlLabel: FC = (props) => (
diff --git a/interface/src/components/inputs/ValidatedPasswordField.tsx b/interface/src/components/inputs/ValidatedPasswordField.tsx index d4a215199..43cc0f426 100644 --- a/interface/src/components/inputs/ValidatedPasswordField.tsx +++ b/interface/src/components/inputs/ValidatedPasswordField.tsx @@ -1,10 +1,11 @@ -import { FC, useState } from 'react'; - -import { IconButton, InputAdornment } from '@mui/material'; import VisibilityIcon from '@mui/icons-material/Visibility'; import VisibilityOffIcon from '@mui/icons-material/VisibilityOff'; +import { IconButton, InputAdornment } from '@mui/material'; +import { useState } from 'react'; -import ValidatedTextField, { ValidatedTextFieldProps } from './ValidatedTextField'; +import ValidatedTextField from './ValidatedTextField'; +import type { ValidatedTextFieldProps } from './ValidatedTextField'; +import type { FC } from 'react'; type ValidatedPasswordFieldProps = Omit; diff --git a/interface/src/components/inputs/ValidatedTextField.tsx b/interface/src/components/inputs/ValidatedTextField.tsx index 8d07f8127..11f8d9268 100644 --- a/interface/src/components/inputs/ValidatedTextField.tsx +++ b/interface/src/components/inputs/ValidatedTextField.tsx @@ -1,7 +1,7 @@ -import { FC } from 'react'; -import { ValidateFieldsError } from 'async-validator'; - -import { FormHelperText, TextField, TextFieldProps } from '@mui/material'; +import { FormHelperText, TextField } from '@mui/material'; +import type { TextFieldProps } from '@mui/material'; +import type { ValidateFieldsError } from 'async-validator'; +import type { FC } from 'react'; interface ValidatedFieldProps { fieldErrors?: ValidateFieldsError; diff --git a/interface/src/components/layout/Layout.tsx b/interface/src/components/layout/Layout.tsx index e937b12d3..f998deb23 100644 --- a/interface/src/components/layout/Layout.tsx +++ b/interface/src/components/layout/Layout.tsx @@ -1,14 +1,13 @@ -import { FC, useState, useEffect } from 'react'; -import { useLocation } from 'react-router-dom'; - import { Box, Toolbar } from '@mui/material'; - -import { PROJECT_NAME } from 'api/env'; -import { RequiredChildrenProps } from 'utils'; - -import LayoutDrawer from './LayoutDrawer'; +import { useState, useEffect } from 'react'; +import { useLocation } from 'react-router-dom'; import LayoutAppBar from './LayoutAppBar'; +import LayoutDrawer from './LayoutDrawer'; import { LayoutContext } from './context'; +import type { FC } from 'react'; + +import type { RequiredChildrenProps } from 'utils'; +import { PROJECT_NAME } from 'api/env'; export const DRAWER_WIDTH = 240; diff --git a/interface/src/components/layout/LayoutAppBar.tsx b/interface/src/components/layout/LayoutAppBar.tsx index 225283806..c7d9499f6 100644 --- a/interface/src/components/layout/LayoutAppBar.tsx +++ b/interface/src/components/layout/LayoutAppBar.tsx @@ -1,9 +1,7 @@ -import { FC } from 'react'; - -import { AppBar, Box, IconButton, Toolbar, Typography } from '@mui/material'; import MenuIcon from '@mui/icons-material/Menu'; - +import { AppBar, Box, IconButton, Toolbar, Typography } from '@mui/material'; import LayoutAuthMenu from './LayoutAuthMenu'; +import type { FC } from 'react'; export const DRAWER_WIDTH = 240; @@ -12,35 +10,33 @@ interface LayoutAppBarProps { onToggleDrawer: () => void; } -const LayoutAppBar: FC = ({ title, onToggleDrawer }) => { - return ( - - - - - - - {title} - - - - - - ); -}; +const LayoutAppBar: FC = ({ title, onToggleDrawer }) => ( + + + + + + + {title} + + + + + +); export default LayoutAppBar; diff --git a/interface/src/components/layout/LayoutAuthMenu.tsx b/interface/src/components/layout/LayoutAuthMenu.tsx index 65204307d..c8d96344d 100644 --- a/interface/src/components/layout/LayoutAuthMenu.tsx +++ b/interface/src/components/layout/LayoutAuthMenu.tsx @@ -1,5 +1,5 @@ -import { FC, useState, useContext, ChangeEventHandler } from 'react'; - +import AccountCircleIcon from '@mui/icons-material/AccountCircle'; +import PersonIcon from '@mui/icons-material/Person'; import { Box, Button, @@ -9,28 +9,26 @@ import { Typography, Avatar, styled, - TypographyProps, MenuItem, TextField } from '@mui/material'; +import { useState, useContext } from 'react'; +import type { TypographyProps } from '@mui/material'; -import PersonIcon from '@mui/icons-material/Person'; -import AccountCircleIcon from '@mui/icons-material/AccountCircle'; - +import type { Locales } from 'i18n/i18n-types'; +import type { FC, ChangeEventHandler } from 'react'; import { AuthenticatedContext } from 'contexts/authentication'; -import { I18nContext } from 'i18n/i18n-react'; -import type { Locales } from 'i18n/i18n-types'; -import { loadLocaleAsync } from 'i18n/i18n-util.async'; - -import { ReactComponent as NLflag } from 'i18n/NL.svg'; import { ReactComponent as DEflag } from 'i18n/DE.svg'; -import { ReactComponent as GBflag } from 'i18n/GB.svg'; -import { ReactComponent as SVflag } from 'i18n/SV.svg'; -import { ReactComponent as PLflag } from 'i18n/PL.svg'; -import { ReactComponent as NOflag } from 'i18n/NO.svg'; import { ReactComponent as FRflag } from 'i18n/FR.svg'; +import { ReactComponent as GBflag } from 'i18n/GB.svg'; +import { ReactComponent as NLflag } from 'i18n/NL.svg'; +import { ReactComponent as NOflag } from 'i18n/NO.svg'; +import { ReactComponent as PLflag } from 'i18n/PL.svg'; +import { ReactComponent as SVflag } from 'i18n/SV.svg'; import { ReactComponent as TRflag } from 'i18n/TR.svg'; +import { I18nContext } from 'i18n/i18n-react'; +import { loadLocaleAsync } from 'i18n/i18n-util.async'; const ItemTypography = styled(Typography)({ maxWidth: '250px', diff --git a/interface/src/components/layout/LayoutDrawer.tsx b/interface/src/components/layout/LayoutDrawer.tsx index c4d4868ee..1dbde9305 100644 --- a/interface/src/components/layout/LayoutDrawer.tsx +++ b/interface/src/components/layout/LayoutDrawer.tsx @@ -1,12 +1,10 @@ -import { FC } from 'react'; - import { Box, Divider, Drawer, Toolbar, Typography, styled } from '@mui/material'; +import { DRAWER_WIDTH } from './Layout'; +import LayoutMenu from './LayoutMenu'; +import type { FC } from 'react'; import { PROJECT_NAME } from 'api/env'; -import LayoutMenu from './LayoutMenu'; -import { DRAWER_WIDTH } from './Layout'; - const LayoutDrawerLogo = styled('img')(({ theme }) => ({ [theme.breakpoints.down('sm')]: { height: 24, diff --git a/interface/src/components/layout/LayoutMenu.tsx b/interface/src/components/layout/LayoutMenu.tsx index 0f0004591..f7d32788f 100644 --- a/interface/src/components/layout/LayoutMenu.tsx +++ b/interface/src/components/layout/LayoutMenu.tsx @@ -1,17 +1,16 @@ -import { FC, useContext } from 'react'; - -import { Divider, List } from '@mui/material'; - -import SettingsInputAntennaIcon from '@mui/icons-material/SettingsInputAntenna'; import AccessTimeIcon from '@mui/icons-material/AccessTime'; -import DeviceHubIcon from '@mui/icons-material/DeviceHub'; -import SettingsIcon from '@mui/icons-material/Settings'; -import LockIcon from '@mui/icons-material/Lock'; -import SettingsEthernetIcon from '@mui/icons-material/SettingsEthernet'; -import TuneIcon from '@mui/icons-material/Tune'; import DashboardIcon from '@mui/icons-material/Dashboard'; +import DeviceHubIcon from '@mui/icons-material/DeviceHub'; import InfoIcon from '@mui/icons-material/Info'; +import LockIcon from '@mui/icons-material/Lock'; +import SettingsIcon from '@mui/icons-material/Settings'; +import SettingsEthernetIcon from '@mui/icons-material/SettingsEthernet'; +import SettingsInputAntennaIcon from '@mui/icons-material/SettingsInputAntenna'; +import TuneIcon from '@mui/icons-material/Tune'; +import { Divider, List } from '@mui/material'; +import { useContext } from 'react'; +import type { FC } from 'react'; import LayoutMenuItem from 'components/layout/LayoutMenuItem'; diff --git a/interface/src/components/layout/LayoutMenuItem.tsx b/interface/src/components/layout/LayoutMenuItem.tsx index 04da15106..91914169d 100644 --- a/interface/src/components/layout/LayoutMenuItem.tsx +++ b/interface/src/components/layout/LayoutMenuItem.tsx @@ -1,12 +1,11 @@ -import { FC } from 'react'; +import { ListItem, ListItemButton, ListItemIcon, ListItemText } from '@mui/material'; +import { grey } from '@mui/material/colors'; import { Link, useLocation } from 'react-router-dom'; - -import { ListItem, ListItemButton, ListItemIcon, ListItemText, SvgIconProps } from '@mui/material'; +import type { SvgIconProps } from '@mui/material'; +import type { FC } from 'react'; import { routeMatches } from 'utils'; -import { grey } from '@mui/material/colors'; - interface LayoutMenuItemProps { icon: React.ComponentType; label: string; diff --git a/interface/src/components/loading/ApplicationError.tsx b/interface/src/components/loading/ApplicationError.tsx index 9ab428d58..4a1be5c31 100644 --- a/interface/src/components/loading/ApplicationError.tsx +++ b/interface/src/components/loading/ApplicationError.tsx @@ -1,7 +1,6 @@ -import { FC } from 'react'; - -import { Box, Paper, Typography } from '@mui/material'; import WarningIcon from '@mui/icons-material/Warning'; +import { Box, Paper, Typography } from '@mui/material'; +import type { FC } from 'react'; interface ApplicationErrorProps { message?: string; diff --git a/interface/src/components/loading/FormLoader.tsx b/interface/src/components/loading/FormLoader.tsx index b2d23a7a1..5a555f4d0 100644 --- a/interface/src/components/loading/FormLoader.tsx +++ b/interface/src/components/loading/FormLoader.tsx @@ -1,7 +1,6 @@ -import { FC } from 'react'; - -import { Box, Button, CircularProgress, Typography } from '@mui/material'; import RefreshIcon from '@mui/icons-material/Refresh'; +import { Box, Button, CircularProgress, Typography } from '@mui/material'; +import type { FC } from 'react'; import { MessageBox } from 'components'; diff --git a/interface/src/components/loading/LoadingSpinner.tsx b/interface/src/components/loading/LoadingSpinner.tsx index 243e6a8cb..06d6664ba 100644 --- a/interface/src/components/loading/LoadingSpinner.tsx +++ b/interface/src/components/loading/LoadingSpinner.tsx @@ -1,6 +1,6 @@ -import { FC } from 'react'; - -import { CircularProgress, Box, Typography, Theme } from '@mui/material'; +import { CircularProgress, Box, Typography } from '@mui/material'; +import type { Theme } from '@mui/material'; +import type { FC } from 'react'; import { useI18nContext } from 'i18n/i18n-react'; diff --git a/interface/src/components/routing/BlockNavigation.tsx b/interface/src/components/routing/BlockNavigation.tsx index 0f6bb4ef0..445cc7463 100644 --- a/interface/src/components/routing/BlockNavigation.tsx +++ b/interface/src/components/routing/BlockNavigation.tsx @@ -1,6 +1,6 @@ -import { FC } from 'react'; -import type { Blocker } from '@remix-run/router'; import { Button, Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material'; +import type { Blocker } from '@remix-run/router'; +import type { FC } from 'react'; import { useI18nContext } from 'i18n/i18n-react'; diff --git a/interface/src/components/routing/RequireAdmin.tsx b/interface/src/components/routing/RequireAdmin.tsx index 1f6be2bf4..a78aeaf01 100644 --- a/interface/src/components/routing/RequireAdmin.tsx +++ b/interface/src/components/routing/RequireAdmin.tsx @@ -1,8 +1,9 @@ -import { FC, useContext } from 'react'; +import { useContext } from 'react'; import { Navigate } from 'react-router-dom'; +import type { FC } from 'react'; +import type { RequiredChildrenProps } from 'utils'; import { AuthenticatedContext } from 'contexts/authentication'; -import { RequiredChildrenProps } from 'utils'; const RequireAdmin: FC = ({ children }) => { const authenticatedContext = useContext(AuthenticatedContext); diff --git a/interface/src/components/routing/RequireAuthenticated.tsx b/interface/src/components/routing/RequireAuthenticated.tsx index 6eea9ed7c..d9f157f56 100644 --- a/interface/src/components/routing/RequireAuthenticated.tsx +++ b/interface/src/components/routing/RequireAuthenticated.tsx @@ -1,14 +1,12 @@ -import { FC, useContext, useEffect } from 'react'; +import { useContext, useEffect } from 'react'; import { Navigate, useLocation } from 'react-router-dom'; -import { - AuthenticatedContext, - AuthenticatedContextValue, - AuthenticationContext -} from 'contexts/authentication/context'; -import { storeLoginRedirect } from 'api/authentication'; +import type { AuthenticatedContextValue } from 'contexts/authentication/context'; +import type { FC } from 'react'; -import { RequiredChildrenProps } from 'utils'; +import type { RequiredChildrenProps } from 'utils'; +import { storeLoginRedirect } from 'api/authentication'; +import { AuthenticatedContext, AuthenticationContext } from 'contexts/authentication/context'; const RequireAuthenticated: FC = ({ children }) => { const authenticationContext = useContext(AuthenticationContext); diff --git a/interface/src/components/routing/RequireUnauthenticated.tsx b/interface/src/components/routing/RequireUnauthenticated.tsx index 33ba900c8..65a334926 100644 --- a/interface/src/components/routing/RequireUnauthenticated.tsx +++ b/interface/src/components/routing/RequireUnauthenticated.tsx @@ -1,9 +1,10 @@ -import { FC, useContext } from 'react'; +import { useContext } from 'react'; import { Navigate } from 'react-router-dom'; +import type { FC } from 'react'; +import type { RequiredChildrenProps } from 'utils'; import * as AuthenticationApi from 'api/authentication'; import { AuthenticationContext } from 'contexts/authentication'; -import { RequiredChildrenProps } from 'utils'; const RequireUnauthenticated: FC = ({ children }) => { const authenticationContext = useContext(AuthenticationContext); diff --git a/interface/src/components/routing/RouterTabs.tsx b/interface/src/components/routing/RouterTabs.tsx index c16b77ba6..485a0d995 100644 --- a/interface/src/components/routing/RouterTabs.tsx +++ b/interface/src/components/routing/RouterTabs.tsx @@ -1,9 +1,8 @@ -import { FC } from 'react'; -import { useNavigate } from 'react-router-dom'; - import { Tabs, useMediaQuery, useTheme } from '@mui/material'; +import { useNavigate } from 'react-router-dom'; +import type { FC } from 'react'; -import { RequiredChildrenProps } from 'utils'; +import type { RequiredChildrenProps } from 'utils'; interface RouterTabsProps extends RequiredChildrenProps { value: string | false; diff --git a/interface/src/components/upload/SingleUpload.tsx b/interface/src/components/upload/SingleUpload.tsx index c7c4ce185..57c17bb8a 100644 --- a/interface/src/components/upload/SingleUpload.tsx +++ b/interface/src/components/upload/SingleUpload.tsx @@ -1,12 +1,12 @@ -import { FC, Fragment } from 'react'; -import { useDropzone, DropzoneState } from 'react-dropzone'; - -import { AxiosProgressEvent } from 'axios'; - -import { Box, Button, LinearProgress, Theme, Typography, useTheme } from '@mui/material'; - -import CloudUploadIcon from '@mui/icons-material/CloudUpload'; import CancelIcon from '@mui/icons-material/Cancel'; +import CloudUploadIcon from '@mui/icons-material/CloudUpload'; +import { Box, Button, LinearProgress, Typography, useTheme } from '@mui/material'; +import { Fragment } from 'react'; +import { useDropzone } from 'react-dropzone'; +import type { Theme } from '@mui/material'; +import type { AxiosProgressEvent } from 'axios'; +import type { FC } from 'react'; +import type { DropzoneState } from 'react-dropzone'; import { useI18nContext } from 'i18n/i18n-react'; diff --git a/interface/src/components/upload/useFileUpload.ts b/interface/src/components/upload/useFileUpload.ts index afa41aaa7..47d286a77 100644 --- a/interface/src/components/upload/useFileUpload.ts +++ b/interface/src/components/upload/useFileUpload.ts @@ -1,11 +1,12 @@ +import axios from 'axios'; import { useCallback, useEffect, useState } from 'react'; -import axios, { AxiosPromise, CancelTokenSource, AxiosProgressEvent } from 'axios'; import { toast } from 'react-toastify'; -import { extractErrorMessage } from 'utils'; -import { FileUploadConfig } from 'api/endpoints'; +import type { FileUploadConfig } from 'api/endpoints'; +import type { AxiosPromise, CancelTokenSource, AxiosProgressEvent } from 'axios'; import { useI18nContext } from 'i18n/i18n-react'; +import { extractErrorMessage } from 'utils'; interface MediaUploadOptions { upload: (file: File, config?: FileUploadConfig) => AxiosPromise; @@ -31,11 +32,12 @@ const useFileUpload = ({ upload }: MediaUploadOptions) => { resetUploadingStates(); }, [uploadCancelToken]); - useEffect(() => { - return () => { + useEffect( + () => () => { uploadCancelToken?.cancel(); - }; - }, [uploadCancelToken]); + }, + [uploadCancelToken] + ); const uploadFile = async (images: File[]) => { try { diff --git a/interface/src/contexts/authentication/Authentication.tsx b/interface/src/contexts/authentication/Authentication.tsx index d997356e4..a818f3458 100644 --- a/interface/src/contexts/authentication/Authentication.tsx +++ b/interface/src/contexts/authentication/Authentication.tsx @@ -1,15 +1,15 @@ -import { FC, useCallback, useEffect, useState } from 'react'; -import { toast } from 'react-toastify'; +import { useCallback, useEffect, useState } from 'react'; import { useNavigate } from 'react-router-dom'; +import { toast } from 'react-toastify'; +import { AuthenticationContext } from './context'; +import type { FC } from 'react'; -import { useI18nContext } from 'i18n/i18n-react'; - +import type { Me } from 'types'; +import type { RequiredChildrenProps } from 'utils'; import * as AuthenticationApi from 'api/authentication'; import { ACCESS_TOKEN } from 'api/endpoints'; -import { RequiredChildrenProps } from 'utils'; import { LoadingSpinner } from 'components'; -import { Me } from 'types'; -import { AuthenticationContext } from './context'; +import { useI18nContext } from 'i18n/i18n-react'; const Authentication: FC = ({ children }) => { const { LL } = useI18nContext(); diff --git a/interface/src/contexts/authentication/context.ts b/interface/src/contexts/authentication/context.ts index 858fba24d..d81ef1a99 100644 --- a/interface/src/contexts/authentication/context.ts +++ b/interface/src/contexts/authentication/context.ts @@ -1,5 +1,5 @@ import { createContext } from 'react'; -import { Me } from 'types'; +import type { Me } from 'types'; export interface AuthenticationContextValue { refresh: () => Promise; diff --git a/interface/src/contexts/features/FeaturesLoader.tsx b/interface/src/contexts/features/FeaturesLoader.tsx index 0235de844..c56751237 100644 --- a/interface/src/contexts/features/FeaturesLoader.tsx +++ b/interface/src/contexts/features/FeaturesLoader.tsx @@ -1,12 +1,13 @@ -import { FC, useCallback, useEffect, useState } from 'react'; - -import * as FeaturesApi from 'api/features'; - -import { extractErrorMessage, RequiredChildrenProps } from 'utils'; -import { Features } from 'types'; -import { ApplicationError, LoadingSpinner } from 'components'; +import { useCallback, useEffect, useState } from 'react'; import { FeaturesContext } from '.'; +import type { FC } from 'react'; + +import type { Features } from 'types'; +import type { RequiredChildrenProps } from 'utils'; +import * as FeaturesApi from 'api/features'; +import { ApplicationError, LoadingSpinner } from 'components'; +import { extractErrorMessage } from 'utils'; const FeaturesLoader: FC = (props) => { const [errorMessage, setErrorMessage] = useState(); diff --git a/interface/src/contexts/features/context.ts b/interface/src/contexts/features/context.ts index 5c64ec113..78a8f1ec2 100644 --- a/interface/src/contexts/features/context.ts +++ b/interface/src/contexts/features/context.ts @@ -1,6 +1,6 @@ import { createContext } from 'react'; -import { Features } from 'types'; +import type { Features } from 'types'; export interface FeaturesContextValue { features: Features; diff --git a/interface/src/framework/ap/APSettingsForm.tsx b/interface/src/framework/ap/APSettingsForm.tsx index 349240d1d..b0408820b 100644 --- a/interface/src/framework/ap/APSettingsForm.tsx +++ b/interface/src/framework/ap/APSettingsForm.tsx @@ -1,12 +1,13 @@ -import { FC, useState } from 'react'; -import { ValidateFieldsError } from 'async-validator'; -import { range } from 'lodash-es'; - -import { Button, Checkbox, MenuItem } from '@mui/material'; -import WarningIcon from '@mui/icons-material/Warning'; import CancelIcon from '@mui/icons-material/Cancel'; +import WarningIcon from '@mui/icons-material/Warning'; +import { Button, Checkbox, MenuItem } from '@mui/material'; +import { range } from 'lodash-es'; +import { useState } from 'react'; +import type { ValidateFieldsError } from 'async-validator'; +import type { FC } from 'react'; -import { createAPSettingsValidator, validate } from 'validators'; +import type { APSettings } from 'types'; +import * as APApi from 'api/ap'; import { BlockFormControlLabel, ButtonRow, @@ -17,15 +18,14 @@ import { BlockNavigation } from 'components'; -import { APProvisionMode, APSettings } from 'types'; -import { numberValue, updateValueDirty, useRest } from 'utils'; -import * as APApi from 'api/ap'; - import { useI18nContext } from 'i18n/i18n-react'; +import { APProvisionMode } from 'types'; +import { numberValue, updateValueDirty, useRest } from 'utils'; -export const isAPEnabled = ({ provision_mode }: APSettings) => { - return provision_mode === APProvisionMode.AP_MODE_ALWAYS || provision_mode === APProvisionMode.AP_MODE_DISCONNECTED; -}; +import { createAPSettingsValidator, validate } from 'validators'; + +export const isAPEnabled = ({ provision_mode }: APSettings) => + provision_mode === APProvisionMode.AP_MODE_ALWAYS || provision_mode === APProvisionMode.AP_MODE_DISCONNECTED; const APSettingsForm: FC = () => { const { loadData, saving, data, setData, origData, dirtyFlags, setDirtyFlags, blocker, saveData, errorMessage } = diff --git a/interface/src/framework/ap/APStatusForm.tsx b/interface/src/framework/ap/APStatusForm.tsx index d8a056ebb..a4cfb6172 100644 --- a/interface/src/framework/ap/APStatusForm.tsx +++ b/interface/src/framework/ap/APStatusForm.tsx @@ -1,17 +1,18 @@ -import { FC } from 'react'; - -import { Avatar, Button, Divider, List, ListItem, ListItemAvatar, ListItemText, Theme, useTheme } from '@mui/material'; -import SettingsInputAntennaIcon from '@mui/icons-material/SettingsInputAntenna'; -import DeviceHubIcon from '@mui/icons-material/DeviceHub'; import ComputerIcon from '@mui/icons-material/Computer'; +import DeviceHubIcon from '@mui/icons-material/DeviceHub'; import RefreshIcon from '@mui/icons-material/Refresh'; +import SettingsInputAntennaIcon from '@mui/icons-material/SettingsInputAntenna'; +import { Avatar, Button, Divider, List, ListItem, ListItemAvatar, ListItemText, useTheme } from '@mui/material'; +import type { Theme } from '@mui/material'; +import type { FC } from 'react'; +import type { APStatus } from 'types'; 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 { APNetworkStatus } from 'types'; +import { useRest } from 'utils'; export const apStatusHighlight = ({ status }: APStatus, theme: Theme) => { switch (status) { diff --git a/interface/src/framework/ap/AccessPoint.tsx b/interface/src/framework/ap/AccessPoint.tsx index 26dc3812d..749aafea7 100644 --- a/interface/src/framework/ap/AccessPoint.tsx +++ b/interface/src/framework/ap/AccessPoint.tsx @@ -1,12 +1,12 @@ -import { FC, useContext } from 'react'; +import { Tab } from '@mui/material'; +import { useContext } from 'react'; import { Navigate, Routes, Route } from 'react-router-dom'; -import { Tab } from '@mui/material'; - -import { AuthenticatedContext } from 'contexts/authentication'; -import APStatusForm from './APStatusForm'; import APSettingsForm from './APSettingsForm'; +import APStatusForm from './APStatusForm'; +import type { FC } from 'react'; import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from 'components'; +import { AuthenticatedContext } from 'contexts/authentication'; import { useI18nContext } from 'i18n/i18n-react'; diff --git a/interface/src/framework/mqtt/Mqtt.tsx b/interface/src/framework/mqtt/Mqtt.tsx index 9af749753..7520b0eec 100644 --- a/interface/src/framework/mqtt/Mqtt.tsx +++ b/interface/src/framework/mqtt/Mqtt.tsx @@ -1,14 +1,13 @@ -import { FC, useContext } from 'react'; -import { Navigate, Route, Routes } from 'react-router-dom'; - import { Tab } from '@mui/material'; +import { useContext } from 'react'; +import { Navigate, Route, Routes } from 'react-router-dom'; +import MqttSettingsForm from './MqttSettingsForm'; +import MqttStatusForm from './MqttStatusForm'; +import type { FC } from 'react'; 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'; const Mqtt: FC = () => { diff --git a/interface/src/framework/mqtt/MqttSettingsForm.tsx b/interface/src/framework/mqtt/MqttSettingsForm.tsx index ad559c8a1..e531ffee5 100644 --- a/interface/src/framework/mqtt/MqttSettingsForm.tsx +++ b/interface/src/framework/mqtt/MqttSettingsForm.tsx @@ -1,12 +1,12 @@ -import { FC, useState } from 'react'; -import { ValidateFieldsError } from 'async-validator'; - -import { Button, Checkbox, MenuItem, Grid, Typography, InputAdornment } from '@mui/material'; - -import WarningIcon from '@mui/icons-material/Warning'; import CancelIcon from '@mui/icons-material/Cancel'; +import WarningIcon from '@mui/icons-material/Warning'; +import { Button, Checkbox, MenuItem, Grid, Typography, InputAdornment } from '@mui/material'; +import { useState } from 'react'; +import type { ValidateFieldsError } from 'async-validator'; +import type { FC } from 'react'; -import { createMqttSettingsValidator, validate } from 'validators'; +import type { MqttSettings } from 'types'; +import * as MqttApi from 'api/mqtt'; import { BlockFormControlLabel, ButtonRow, @@ -16,11 +16,10 @@ import { ValidatedTextField, BlockNavigation } 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 { numberValue, updateValueDirty, useRest } from 'utils'; + +import { createMqttSettingsValidator, validate } from 'validators'; const MqttSettingsForm: FC = () => { const { loadData, saving, data, setData, origData, dirtyFlags, setDirtyFlags, blocker, saveData, errorMessage } = diff --git a/interface/src/framework/mqtt/MqttStatusForm.tsx b/interface/src/framework/mqtt/MqttStatusForm.tsx index e258ae538..b8a20f915 100644 --- a/interface/src/framework/mqtt/MqttStatusForm.tsx +++ b/interface/src/framework/mqtt/MqttStatusForm.tsx @@ -1,18 +1,18 @@ -import { FC } from 'react'; -import { Avatar, Button, Divider, List, ListItem, ListItemAvatar, ListItemText, Theme, useTheme } from '@mui/material'; - +import AutoAwesomeMotionIcon from '@mui/icons-material/AutoAwesomeMotion'; import DeviceHubIcon from '@mui/icons-material/DeviceHub'; import RefreshIcon from '@mui/icons-material/Refresh'; import ReportIcon from '@mui/icons-material/Report'; import SpeakerNotesOffIcon from '@mui/icons-material/SpeakerNotesOff'; -import AutoAwesomeMotionIcon from '@mui/icons-material/AutoAwesomeMotion'; +import { Avatar, Button, Divider, List, ListItem, ListItemAvatar, ListItemText, useTheme } from '@mui/material'; +import type { Theme } from '@mui/material'; +import type { FC } from 'react'; -import { ButtonRow, FormLoader, SectionContent } from 'components'; -import { MqttStatus, MqttDisconnectReason } from 'types'; +import type { MqttStatus } from 'types'; import * as MqttApi from 'api/mqtt'; -import { useRest } from 'utils'; - +import { ButtonRow, FormLoader, SectionContent } from 'components'; import { useI18nContext } from 'i18n/i18n-react'; +import { MqttDisconnectReason } from 'types'; +import { useRest } from 'utils'; export const mqttStatusHighlight = ({ enabled, connected }: MqttStatus, theme: Theme) => { if (!enabled) { @@ -83,50 +83,48 @@ const MqttStatusForm: FC = () => { return ; } - const renderConnectionStatus = () => { - return ( - <> - {!data.connected && ( - <> - - - - - - - - - - - )} - - - # - - - - - - - - - - - - - - - - - - - - - - - - ); - }; + const renderConnectionStatus = () => ( + <> + {!data.connected && ( + <> + + + + + + + + + + + )} + + + # + + + + + + + + + + + + + + + + + + + + + + + + ); return ( <> diff --git a/interface/src/framework/network/NetworkConnection.tsx b/interface/src/framework/network/NetworkConnection.tsx index a7930ef03..18d1842ef 100644 --- a/interface/src/framework/network/NetworkConnection.tsx +++ b/interface/src/framework/network/NetworkConnection.tsx @@ -1,16 +1,15 @@ -import { FC, useCallback, useContext, useState } from 'react'; -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 { WiFiConnectionContext } from './WiFiConnectionContext'; -import NetworkStatusForm from './NetworkStatusForm'; -import WiFiNetworkScanner from './WiFiNetworkScanner'; +import { useCallback, useContext, useState } from 'react'; +import { Navigate, Routes, Route, useNavigate } from 'react-router-dom'; import NetworkSettingsForm from './NetworkSettingsForm'; +import NetworkStatusForm from './NetworkStatusForm'; +import { WiFiConnectionContext } from './WiFiConnectionContext'; +import WiFiNetworkScanner from './WiFiNetworkScanner'; +import type { FC } from 'react'; +import type { WiFiNetwork } from 'types'; +import { RequireAdmin, RouterTabs, useLayoutTitle, useRouterTab } from 'components'; +import { AuthenticatedContext } from 'contexts/authentication'; import { useI18nContext } from 'i18n/i18n-react'; const NetworkConnection: FC = () => { diff --git a/interface/src/framework/network/NetworkSettingsForm.tsx b/interface/src/framework/network/NetworkSettingsForm.tsx index ad980f34a..5bb8ddd9a 100644 --- a/interface/src/framework/network/NetworkSettingsForm.tsx +++ b/interface/src/framework/network/NetworkSettingsForm.tsx @@ -1,6 +1,9 @@ -import { FC, useContext, useEffect, useState } from 'react'; -import { toast } from 'react-toastify'; - +import CancelIcon from '@mui/icons-material/Cancel'; +import DeleteIcon from '@mui/icons-material/Delete'; +import LockIcon from '@mui/icons-material/Lock'; +import LockOpenIcon from '@mui/icons-material/LockOpen'; +import PowerSettingsNewIcon from '@mui/icons-material/PowerSettingsNew'; +import WarningIcon from '@mui/icons-material/Warning'; import { Avatar, Button, @@ -14,14 +17,14 @@ import { Typography, InputAdornment } from '@mui/material'; +import { useContext, useEffect, useState } from 'react'; +import { toast } from 'react-toastify'; +import type { FC} from 'react'; -import LockOpenIcon from '@mui/icons-material/LockOpen'; -import DeleteIcon from '@mui/icons-material/Delete'; -import WarningIcon from '@mui/icons-material/Warning'; -import LockIcon from '@mui/icons-material/Lock'; -import PowerSettingsNewIcon from '@mui/icons-material/PowerSettingsNew'; -import CancelIcon from '@mui/icons-material/Cancel'; + +import type { NetworkSettings } from 'types'; +import * as NetworkApi from 'api/network'; import { BlockFormControlLabel, ButtonRow, @@ -32,18 +35,16 @@ import { MessageBox, BlockNavigation } from 'components'; -import { NetworkSettings } from 'types'; -import * as NetworkApi from 'api/network'; -import { numberValue, updateValueDirty, useRest } from 'utils'; +import { useI18nContext } from 'i18n/i18n-react'; import * as EMSESP from 'project/api'; +import { numberValue, updateValueDirty, useRest } from 'utils'; import { WiFiConnectionContext } from './WiFiConnectionContext'; import { isNetworkOpen, networkSecurityMode } from './WiFiNetworkSelector'; -import { ValidateFieldsError } from 'async-validator'; +import type { ValidateFieldsError } from 'async-validator'; import { validate } from 'validators'; import { createNetworkSettingsValidator } from 'validators/network'; -import { useI18nContext } from 'i18n/i18n-react'; import RestartMonitor from '../system/RestartMonitor'; const WiFiSettingsForm: FC = () => { diff --git a/interface/src/framework/network/NetworkStatusForm.tsx b/interface/src/framework/network/NetworkStatusForm.tsx index 8bc70ed72..325a0c5b0 100644 --- a/interface/src/framework/network/NetworkStatusForm.tsx +++ b/interface/src/framework/network/NetworkStatusForm.tsx @@ -1,20 +1,21 @@ -import { FC } from 'react'; -import { Avatar, Button, Divider, List, ListItem, ListItemAvatar, ListItemText, Theme, useTheme } from '@mui/material'; - -import SettingsInputComponentIcon from '@mui/icons-material/SettingsInputComponent'; -import SettingsInputAntennaIcon from '@mui/icons-material/SettingsInputAntenna'; import DeviceHubIcon from '@mui/icons-material/DeviceHub'; -import WifiIcon from '@mui/icons-material/Wifi'; import DnsIcon from '@mui/icons-material/Dns'; import RefreshIcon from '@mui/icons-material/Refresh'; import RouterIcon from '@mui/icons-material/Router'; +import SettingsInputAntennaIcon from '@mui/icons-material/SettingsInputAntenna'; +import SettingsInputComponentIcon from '@mui/icons-material/SettingsInputComponent'; +import WifiIcon from '@mui/icons-material/Wifi'; +import { Avatar, Button, Divider, List, ListItem, ListItemAvatar, ListItemText, useTheme } from '@mui/material'; +import type { Theme } from '@mui/material'; +import type { FC } from 'react'; -import { ButtonRow, FormLoader, SectionContent } from 'components'; -import { NetworkConnectionStatus, NetworkStatus } from 'types'; +import type { NetworkStatus } from 'types'; import * as NetworkApi from 'api/network'; -import { useRest } from 'utils'; +import { ButtonRow, FormLoader, SectionContent } from 'components'; import { useI18nContext } from 'i18n/i18n-react'; +import { NetworkConnectionStatus } from 'types'; +import { useRest } from 'utils'; const isConnected = ({ status }: NetworkStatus) => status === NetworkConnectionStatus.WIFI_STATUS_CONNECTED || diff --git a/interface/src/framework/network/WiFiConnectionContext.tsx b/interface/src/framework/network/WiFiConnectionContext.tsx index f22002455..4965416c8 100644 --- a/interface/src/framework/network/WiFiConnectionContext.tsx +++ b/interface/src/framework/network/WiFiConnectionContext.tsx @@ -1,5 +1,5 @@ import { createContext } from 'react'; -import { WiFiNetwork } from 'types'; +import type { WiFiNetwork } from 'types'; export interface WiFiConnectionContextValue { selectedNetwork?: WiFiNetwork; diff --git a/interface/src/framework/network/WiFiNetworkScanner.tsx b/interface/src/framework/network/WiFiNetworkScanner.tsx index 61bb39aed..2f302c0fa 100644 --- a/interface/src/framework/network/WiFiNetworkScanner.tsx +++ b/interface/src/framework/network/WiFiNetworkScanner.tsx @@ -1,14 +1,13 @@ -import { useEffect, FC, useState, useCallback, useRef } from 'react'; +import PermScanWifiIcon from '@mui/icons-material/PermScanWifi'; +import { Button } from '@mui/material'; +import { useEffect, useState, useCallback, useRef } from 'react'; import { toast } from 'react-toastify'; -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 WiFiNetworkSelector from './WiFiNetworkSelector'; +import type { FC } from 'react'; +import type { WiFiNetwork, WiFiNetworkList } from 'types'; +import * as NetworkApi from 'api/network'; +import { ButtonRow, FormLoader, SectionContent } from 'components'; import { useI18nContext } from 'i18n/i18n-react'; diff --git a/interface/src/framework/network/WiFiNetworkSelector.tsx b/interface/src/framework/network/WiFiNetworkSelector.tsx index 9be0d46e1..b344ca8e1 100644 --- a/interface/src/framework/network/WiFiNetworkSelector.tsx +++ b/interface/src/framework/network/WiFiNetworkSelector.tsx @@ -1,18 +1,16 @@ -import { FC, useContext } from 'react'; - -import { Avatar, Badge, List, ListItem, ListItemAvatar, ListItemIcon, ListItemText } from '@mui/material'; - -import LockOpenIcon from '@mui/icons-material/LockOpen'; import LockIcon from '@mui/icons-material/Lock'; +import LockOpenIcon from '@mui/icons-material/LockOpen'; import WifiIcon from '@mui/icons-material/Wifi'; - -import { MessageBox } from 'components'; - -import { WiFiEncryptionType, WiFiNetwork, WiFiNetworkList } from 'types'; +import { Avatar, Badge, List, ListItem, ListItemAvatar, ListItemIcon, ListItemText } from '@mui/material'; +import { useContext } from 'react'; import { WiFiConnectionContext } from './WiFiConnectionContext'; +import type { FC } from 'react'; +import type { WiFiNetwork, WiFiNetworkList } from 'types'; +import { MessageBox } from 'components'; import { useI18nContext } from 'i18n/i18n-react'; +import { WiFiEncryptionType } from 'types'; interface WiFiNetworkSelectorProps { networkList: WiFiNetworkList; @@ -45,24 +43,22 @@ const WiFiNetworkSelector: FC = ({ networkList }) => { const wifiConnectionContext = useContext(WiFiConnectionContext); - const renderNetwork = (network: WiFiNetwork) => { - return ( - wifiConnectionContext.selectNetwork(network)}> - - {isNetworkOpen(network) ? : } - - - - - - - - - ); - }; + const renderNetwork = (network: WiFiNetwork) => ( + wifiConnectionContext.selectNetwork(network)}> + + {isNetworkOpen(network) ? : } + + + + + + + + + ); if (networkList.networks.length === 0) { return ; diff --git a/interface/src/framework/ntp/NTPSettingsForm.tsx b/interface/src/framework/ntp/NTPSettingsForm.tsx index 12df18103..b12ce75a9 100644 --- a/interface/src/framework/ntp/NTPSettingsForm.tsx +++ b/interface/src/framework/ntp/NTPSettingsForm.tsx @@ -1,11 +1,13 @@ -import { FC, useState } from 'react'; -import { ValidateFieldsError } from 'async-validator'; - -import { Button, Checkbox, MenuItem } from '@mui/material'; -import WarningIcon from '@mui/icons-material/Warning'; import CancelIcon from '@mui/icons-material/Cancel'; +import WarningIcon from '@mui/icons-material/Warning'; +import { Button, Checkbox, MenuItem } from '@mui/material'; +import { useState } from 'react'; +import { selectedTimeZone, timeZoneSelectItems, TIME_ZONES } from './TZ'; +import type { ValidateFieldsError } from 'async-validator'; +import type { FC } from 'react'; -import { validate } from 'validators'; +import type { NTPSettings } from 'types'; +import * as NTPApi from 'api/ntp'; import { BlockFormControlLabel, ButtonRow, @@ -14,13 +16,10 @@ import { ValidatedTextField, BlockNavigation } 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 { useI18nContext } from 'i18n/i18n-react'; +import { updateValueDirty, useRest } from 'utils'; +import { validate } from 'validators'; +import { NTP_SETTINGS_VALIDATOR } from 'validators/ntp'; const NTPSettingsForm: FC = () => { const { loadData, saving, data, setData, origData, dirtyFlags, setDirtyFlags, blocker, saveData, errorMessage } = diff --git a/interface/src/framework/ntp/NTPStatusForm.tsx b/interface/src/framework/ntp/NTPStatusForm.tsx index 9f2c42b0a..ade31d3cf 100644 --- a/interface/src/framework/ntp/NTPStatusForm.tsx +++ b/interface/src/framework/ntp/NTPStatusForm.tsx @@ -1,6 +1,9 @@ -import { FC, useContext, useState } from 'react'; -import { toast } from 'react-toastify'; - +import AccessTimeIcon from '@mui/icons-material/AccessTime'; +import CancelIcon from '@mui/icons-material/Cancel'; +import DnsIcon from '@mui/icons-material/Dns'; +import RefreshIcon from '@mui/icons-material/Refresh'; +import SwapVerticalCircleIcon from '@mui/icons-material/SwapVerticalCircle'; +import UpdateIcon from '@mui/icons-material/Update'; import { Avatar, Box, @@ -15,24 +18,22 @@ import { ListItemAvatar, ListItemText, TextField, - Theme, useTheme, Typography } from '@mui/material'; -import RefreshIcon from '@mui/icons-material/Refresh'; -import AccessTimeIcon from '@mui/icons-material/AccessTime'; -import SwapVerticalCircleIcon from '@mui/icons-material/SwapVerticalCircle'; -import UpdateIcon from '@mui/icons-material/Update'; -import DnsIcon from '@mui/icons-material/Dns'; -import CancelIcon from '@mui/icons-material/Cancel'; +import { useContext, useState } from 'react'; +import { toast } from 'react-toastify'; +import type { Theme } from '@mui/material'; +import type { FC } from 'react'; +import type { NTPStatus } from 'types'; 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 { NTPSyncStatus } from 'types'; +import { extractErrorMessage, formatDateTime, formatLocalDateTime, useRest } from 'utils'; export const isNtpActive = ({ status }: NTPStatus) => status === NTPSyncStatus.NTP_ACTIVE; export const isNtpEnabled = ({ status }: NTPStatus) => status !== NTPSyncStatus.NTP_DISABLED; diff --git a/interface/src/framework/ntp/NetworkTime.tsx b/interface/src/framework/ntp/NetworkTime.tsx index 22248a1d8..d41d1fb8c 100644 --- a/interface/src/framework/ntp/NetworkTime.tsx +++ b/interface/src/framework/ntp/NetworkTime.tsx @@ -1,14 +1,13 @@ -import { FC, useContext } from 'react'; -import { Navigate, Route, Routes } from 'react-router-dom'; - import { Tab } from '@mui/material'; +import { useContext } from 'react'; +import { Navigate, Route, Routes } from 'react-router-dom'; +import NTPSettingsForm from './NTPSettingsForm'; +import NTPStatusForm from './NTPStatusForm'; +import type { FC } from 'react'; 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'; const NetworkTime: FC = () => { diff --git a/interface/src/framework/security/GenerateToken.tsx b/interface/src/framework/security/GenerateToken.tsx index 2b0c0e9fd..52da8139c 100644 --- a/interface/src/framework/security/GenerateToken.tsx +++ b/interface/src/framework/security/GenerateToken.tsx @@ -1,4 +1,4 @@ -import { FC, useCallback, useState, useEffect } from 'react'; +import CloseIcon from '@mui/icons-material/Close'; import { Dialog, DialogTitle, @@ -10,16 +10,16 @@ import { TextField, Button } from '@mui/material'; +import { useCallback, useState, useEffect } from 'react'; -import CloseIcon from '@mui/icons-material/Close'; - -import { extractErrorMessage } from 'utils'; import { toast } from 'react-toastify'; -import { MessageBox } from 'components'; +import type { FC } from 'react'; +import type { Token } from 'types'; import * as SecurityApi from 'api/security'; -import { Token } from 'types'; +import { MessageBox } from 'components'; import { useI18nContext } from 'i18n/i18n-react'; +import { extractErrorMessage } from 'utils'; interface GenerateTokenProps { username?: string; diff --git a/interface/src/framework/security/ManageUsersForm.tsx b/interface/src/framework/security/ManageUsersForm.tsx index 57b6ea895..022df9ef2 100644 --- a/interface/src/framework/security/ManageUsersForm.tsx +++ b/interface/src/framework/security/ManageUsersForm.tsx @@ -1,28 +1,26 @@ -import { FC, useContext, useState } from 'react'; - -import { Button, IconButton, Box } from '@mui/material'; -import SaveIcon from '@mui/icons-material/Save'; -import DeleteIcon from '@mui/icons-material/Delete'; -import PersonAddIcon from '@mui/icons-material/PersonAdd'; -import EditIcon from '@mui/icons-material/Edit'; import CheckIcon from '@mui/icons-material/Check'; import CloseIcon from '@mui/icons-material/Close'; +import DeleteIcon from '@mui/icons-material/Delete'; +import EditIcon from '@mui/icons-material/Edit'; +import PersonAddIcon from '@mui/icons-material/PersonAdd'; +import SaveIcon from '@mui/icons-material/Save'; import VpnKeyIcon from '@mui/icons-material/VpnKey'; +import { Button, IconButton, Box } from '@mui/material'; -import { useTheme } from '@table-library/react-table-library/theme'; 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 { useI18nContext } from 'i18n/i18n-react'; +import { useTheme } from '@table-library/react-table-library/theme'; +import { useContext, useState } from 'react'; import GenerateToken from './GenerateToken'; import UserForm from './UserForm'; +import type { FC } from 'react'; +import type { SecuritySettings, User } from 'types'; +import * as SecurityApi from 'api/security'; +import { ButtonRow, FormLoader, MessageBox, SectionContent } from 'components'; +import { AuthenticatedContext } from 'contexts/authentication'; +import { useI18nContext } from 'i18n/i18n-react'; +import { useRest } from 'utils'; +import { createUserValidator } from 'validators'; const ManageUsersForm: FC = () => { const { loadData, saving, data, setData, saveData, errorMessage } = useRest({ diff --git a/interface/src/framework/security/Security.tsx b/interface/src/framework/security/Security.tsx index 4bb68580f..d55a171e1 100644 --- a/interface/src/framework/security/Security.tsx +++ b/interface/src/framework/security/Security.tsx @@ -1,13 +1,11 @@ -import { FC } from 'react'; -import { Navigate, Routes, Route } from 'react-router-dom'; - import { Tab } from '@mui/material'; +import { Navigate, Routes, Route } from 'react-router-dom'; +import ManageUsersForm from './ManageUsersForm'; +import SecuritySettingsForm from './SecuritySettingsForm'; +import type { FC } from 'react'; import { RouterTabs, useRouterTab, useLayoutTitle } from 'components'; -import SecuritySettingsForm from './SecuritySettingsForm'; -import ManageUsersForm from './ManageUsersForm'; - import { useI18nContext } from 'i18n/i18n-react'; const Security: FC = () => { diff --git a/interface/src/framework/security/SecuritySettingsForm.tsx b/interface/src/framework/security/SecuritySettingsForm.tsx index f02a5b6f4..3a8cab96b 100644 --- a/interface/src/framework/security/SecuritySettingsForm.tsx +++ b/interface/src/framework/security/SecuritySettingsForm.tsx @@ -1,18 +1,18 @@ -import { FC, useContext, useState } from 'react'; -import { ValidateFieldsError } from 'async-validator'; - -import { Button } from '@mui/material'; -import WarningIcon from '@mui/icons-material/Warning'; import CancelIcon from '@mui/icons-material/Cancel'; +import WarningIcon from '@mui/icons-material/Warning'; +import { Button } from '@mui/material'; +import { useContext, useState } from 'react'; +import type { ValidateFieldsError } from 'async-validator'; +import type { FC } from 'react'; +import type { SecuritySettings } from 'types'; 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 { updateValueDirty, useRest } from 'utils'; +import { SECURITY_SETTINGS_VALIDATOR, validate } from 'validators'; const SecuritySettingsForm: FC = () => { const { LL } = useI18nContext(); diff --git a/interface/src/framework/security/UserForm.tsx b/interface/src/framework/security/UserForm.tsx index f17c9dfbd..f11343096 100644 --- a/interface/src/framework/security/UserForm.tsx +++ b/interface/src/framework/security/UserForm.tsx @@ -1,19 +1,19 @@ -import { FC, useState, useEffect } from 'react'; -import Schema, { ValidateFieldsError } from 'async-validator'; - import CancelIcon from '@mui/icons-material/Cancel'; import PersonAddIcon from '@mui/icons-material/PersonAdd'; import SaveIcon from '@mui/icons-material/Save'; import { Button, Checkbox, Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material'; +import { useState, useEffect } from 'react'; +import type Schema from 'async-validator'; +import type { ValidateFieldsError } from 'async-validator'; +import type { FC } from 'react'; +import type { User } from 'types'; import { BlockFormControlLabel, ValidatedPasswordField, ValidatedTextField } from 'components'; -import { User } from 'types'; +import { useI18nContext } from 'i18n/i18n-react'; import { updateValue } from 'utils'; import { validate } from 'validators'; -import { useI18nContext } from 'i18n/i18n-react'; - interface UserFormProps { creating: boolean; validator: Schema; diff --git a/interface/src/framework/system/OTASettingsForm.tsx b/interface/src/framework/system/OTASettingsForm.tsx index 3bf5c6817..9db23ee98 100644 --- a/interface/src/framework/system/OTASettingsForm.tsx +++ b/interface/src/framework/system/OTASettingsForm.tsx @@ -1,9 +1,11 @@ -import { FC, useState } from 'react'; - -import { Button, Checkbox } from '@mui/material'; -import WarningIcon from '@mui/icons-material/Warning'; import CancelIcon from '@mui/icons-material/Cancel'; +import WarningIcon from '@mui/icons-material/Warning'; +import { Button, Checkbox } from '@mui/material'; +import { useState } from 'react'; +import type { ValidateFieldsError } from 'async-validator'; +import type { FC } from 'react'; +import type { OTASettings } from 'types'; import * as SystemApi from 'api/system'; import { BlockFormControlLabel, @@ -15,15 +17,12 @@ import { BlockNavigation } from 'components'; -import { OTASettings } from 'types'; +import { useI18nContext } from 'i18n/i18n-react'; import { numberValue, updateValueDirty, useRest } from 'utils'; -import { ValidateFieldsError } from 'async-validator'; import { validate } from 'validators'; import { OTA_SETTINGS_VALIDATOR } from 'validators/system'; -import { useI18nContext } from 'i18n/i18n-react'; - const OTASettingsForm: FC = () => { const { loadData, saving, data, setData, origData, dirtyFlags, setDirtyFlags, blocker, saveData, errorMessage } = useRest({ diff --git a/interface/src/framework/system/RestartMonitor.tsx b/interface/src/framework/system/RestartMonitor.tsx index 028028174..1b7e91026 100644 --- a/interface/src/framework/system/RestartMonitor.tsx +++ b/interface/src/framework/system/RestartMonitor.tsx @@ -1,4 +1,5 @@ -import { FC, useRef, useState, useEffect } from 'react'; +import { useRef, useState, useEffect } from 'react'; +import type { FC } from 'react'; import * as SystemApi from 'api/system'; import { FormLoader } from 'components'; diff --git a/interface/src/framework/system/System.tsx b/interface/src/framework/system/System.tsx index 8cc5cc80d..2caf4b7c6 100644 --- a/interface/src/framework/system/System.tsx +++ b/interface/src/framework/system/System.tsx @@ -1,15 +1,14 @@ -import { FC, useContext } from 'react'; -import { Navigate, Routes, Route } from 'react-router-dom'; - import { Tab } from '@mui/material'; +import { useContext } from 'react'; +import { Navigate, Routes, Route } from 'react-router-dom'; +import OTASettingsForm from './OTASettingsForm'; +import SystemLog from './SystemLog'; +import SystemStatusForm from './SystemStatusForm'; +import UploadFileForm from './UploadFileForm'; +import type { FC } from 'react'; 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'; diff --git a/interface/src/framework/system/SystemLog.tsx b/interface/src/framework/system/SystemLog.tsx index b79b02248..393212cbb 100644 --- a/interface/src/framework/system/SystemLog.tsx +++ b/interface/src/framework/system/SystemLog.tsx @@ -1,22 +1,19 @@ -import { FC, useState, useEffect, useCallback, useLayoutEffect } from 'react'; - +import DownloadIcon from '@mui/icons-material/GetApp'; import { Box, styled, Button, Checkbox, MenuItem, Grid, Slider, FormLabel } from '@mui/material'; +import { useState, useEffect, useCallback, useLayoutEffect } from 'react'; +import { toast } from 'react-toastify'; +import type { FC } from 'react'; -import * as SystemApi from 'api/system'; +import type { LogSettings, LogEntry, LogEntries } from 'types'; import { addAccessTokenParameter } from 'api/authentication'; +import { EVENT_SOURCE_ROOT } from 'api/endpoints'; +import * as SystemApi from 'api/system'; import { SectionContent, FormLoader, BlockFormControlLabel, ValidatedTextField } from 'components'; -import { LogSettings, LogEntry, LogEntries, LogLevel } from 'types'; -import { updateValue, useRest, extractErrorMessage } from 'utils'; - -import DownloadIcon from '@mui/icons-material/GetApp'; - -import { toast } from 'react-toastify'; - -import { EVENT_SOURCE_ROOT } from 'api/endpoints'; - import { useI18nContext } from 'i18n/i18n-react'; +import { LogLevel } from 'types'; +import { updateValue, useRest, extractErrorMessage } from 'utils'; export const LOG_EVENTSOURCE_URL = EVENT_SOURCE_ROOT + 'log'; diff --git a/interface/src/framework/system/SystemStatusForm.tsx b/interface/src/framework/system/SystemStatusForm.tsx index f0d078da9..b7ef1db17 100644 --- a/interface/src/framework/system/SystemStatusForm.tsx +++ b/interface/src/framework/system/SystemStatusForm.tsx @@ -1,5 +1,16 @@ -import { FC, useContext, useState, useEffect } from 'react'; -import { toast } from 'react-toastify'; +import AppsIcon from '@mui/icons-material/Apps'; +import RefreshIcon from '@mui/icons-material/Refresh'; +import PowerSettingsNewIcon from '@mui/icons-material/PowerSettingsNew'; +import SettingsBackupRestoreIcon from '@mui/icons-material/SettingsBackupRestore'; +import BuildIcon from '@mui/icons-material/Build'; +import TimerIcon from '@mui/icons-material/Timer'; +import CancelIcon from '@mui/icons-material/Cancel'; +import DevicesIcon from '@mui/icons-material/Devices'; +import FolderIcon from '@mui/icons-material/Folder'; +import MemoryIcon from '@mui/icons-material/Memory'; +import SdCardAlertIcon from '@mui/icons-material/SdCardAlert'; +import SdStorageIcon from '@mui/icons-material/SdStorage'; +import ShowChartIcon from '@mui/icons-material/ShowChart'; import { Avatar, Box, @@ -17,31 +28,18 @@ import { Typography } from '@mui/material'; -import DevicesIcon from '@mui/icons-material/Devices'; -import ShowChartIcon from '@mui/icons-material/ShowChart'; -import MemoryIcon from '@mui/icons-material/Memory'; -import AppsIcon from '@mui/icons-material/Apps'; -import SdStorageIcon from '@mui/icons-material/SdStorage'; -import SdCardAlertIcon from '@mui/icons-material/SdCardAlert'; -import FolderIcon from '@mui/icons-material/Folder'; -import RefreshIcon from '@mui/icons-material/Refresh'; -import PowerSettingsNewIcon from '@mui/icons-material/PowerSettingsNew'; -import SettingsBackupRestoreIcon from '@mui/icons-material/SettingsBackupRestore'; -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 { AuthenticatedContext } from 'contexts/authentication'; - import axios from 'axios'; +import { useContext, useState, useEffect } from 'react'; +import { toast } from 'react-toastify'; import RestartMonitor from './RestartMonitor'; +import type { FC } from 'react'; import { useI18nContext } from 'i18n/i18n-react'; +import type { SystemStatus, Version } from 'types'; +import * as SystemApi from 'api/system'; +import { ButtonRow, FormLoader, SectionContent, MessageBox } from 'components'; +import { AuthenticatedContext } from 'contexts/authentication'; +import { extractErrorMessage, useRest } from 'utils'; 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'; @@ -148,61 +146,59 @@ const SystemStatusForm: FC = () => { ); - const renderVersionDialog = () => { - return ( - setShowingVersion(false)}> - {LL.VERSION_CHECK(1)} - - - {latestVersion && ( - - {LL.THE_LATEST()} {LL.OFFICIAL()} {LL.VERSION_IS()} {latestVersion.version} -  ( - - {LL.RELEASE_NOTES()} - - ) ( - - {LL.DOWNLOAD(1)} - - ) - - )} - - {latestDevVersion && ( - - {LL.THE_LATEST()} {LL.DEVELOPMENT()} {LL.VERSION_IS()}  - {latestDevVersion.version} -  ( - - {LL.RELEASE_NOTES()} - - ) ( - - {LL.DOWNLOAD(1)} - - ) - - )} - - - - {LL.USE()}  - - {LL.UPLOAD()} - -  {LL.SYSTEM_APPLY_FIRMWARE()} - + const renderVersionDialog = () => ( + setShowingVersion(false)}> + {LL.VERSION_CHECK(1)} + + + {latestVersion && ( + + {LL.THE_LATEST()} {LL.OFFICIAL()} {LL.VERSION_IS()} {latestVersion.version} +  ( + + {LL.RELEASE_NOTES()} + + ) ( + + {LL.DOWNLOAD(1)} + + ) - - - - - - ); - }; + )} + + {latestDevVersion && ( + + {LL.THE_LATEST()} {LL.DEVELOPMENT()} {LL.VERSION_IS()}  + {latestDevVersion.version} +  ( + + {LL.RELEASE_NOTES()} + + ) ( + + {LL.DOWNLOAD(1)} + + ) + + )} + + + + {LL.USE()}  + + {LL.UPLOAD()} + +  {LL.SYSTEM_APPLY_FIRMWARE()} + + + + + + + + ); const factoryReset = async () => { setProcessing(true); diff --git a/interface/src/framework/system/UploadFileForm.tsx b/interface/src/framework/system/UploadFileForm.tsx index 5a71f6121..568738124 100644 --- a/interface/src/framework/system/UploadFileForm.tsx +++ b/interface/src/framework/system/UploadFileForm.tsx @@ -1,11 +1,11 @@ -import { FC, useRef, useState } from 'react'; +import { useRef, useState } from 'react'; +import GeneralFileUpload from './GeneralFileUpload'; +import RestartMonitor from './RestartMonitor'; +import type { FileUploadConfig } from 'api/endpoints'; +import type { FC } from 'react'; 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'; diff --git a/interface/src/project/Dashboard.tsx b/interface/src/project/Dashboard.tsx index c2c1abaa5..5f9de1ca1 100644 --- a/interface/src/project/Dashboard.tsx +++ b/interface/src/project/Dashboard.tsx @@ -1,15 +1,13 @@ -import { FC } from 'react'; -import { Navigate, Route, Routes } from 'react-router-dom'; - import { Tab } from '@mui/material'; +import { Navigate, Route, Routes } from 'react-router-dom'; +import DashboardData from './DashboardData'; +import DashboardStatus from './DashboardStatus'; +import type { FC } from 'react'; import { RouterTabs, useRouterTab, useLayoutTitle } from 'components'; import { useI18nContext } from 'i18n/i18n-react'; -import DashboardStatus from './DashboardStatus'; -import DashboardData from './DashboardData'; - const Dashboard: FC = () => { const { routerTab } = useRouterTab(); diff --git a/interface/src/project/DashboardStatus.tsx b/interface/src/project/DashboardStatus.tsx index 842bd0371..13055245a 100644 --- a/interface/src/project/DashboardStatus.tsx +++ b/interface/src/project/DashboardStatus.tsx @@ -1,42 +1,38 @@ -import { FC, useState, useContext, useEffect } from 'react'; -import { toast } from 'react-toastify'; +import CancelIcon from '@mui/icons-material/Cancel'; +import DeviceHubIcon from '@mui/icons-material/DeviceHub'; +import DirectionsBusIcon from '@mui/icons-material/DirectionsBus'; +import PermScanWifiIcon from '@mui/icons-material/PermScanWifi'; +import RefreshIcon from '@mui/icons-material/Refresh'; import { Avatar, - Button, - List, - ListItem, - ListItemAvatar, - ListItemText, Box, + Button, Dialog, DialogActions, DialogContent, DialogTitle, - Theme, + List, + ListItem, + ListItemAvatar, + ListItemText, useTheme } from '@mui/material'; - +import { Body, Cell, Header, HeaderCell, HeaderRow, Row, Table } from '@table-library/react-table-library/table'; import { useTheme as tableTheme } from '@table-library/react-table-library/theme'; -import { Table, Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table'; - -import DeviceHubIcon from '@mui/icons-material/DeviceHub'; -import RefreshIcon from '@mui/icons-material/Refresh'; -import PermScanWifiIcon from '@mui/icons-material/PermScanWifi'; -import CancelIcon from '@mui/icons-material/Cancel'; -import DirectionsBusIcon from '@mui/icons-material/DirectionsBus'; - -import { AuthenticatedContext } from 'contexts/authentication'; - -import { ButtonRow, FormLoader, SectionContent } from 'components'; - -import { Status, busConnectionStatus, Stat } from './types'; - -import { extractErrorMessage, useRest } from 'utils'; +import { useContext, useEffect, useState } from 'react'; +import { toast } from 'react-toastify'; import * as EMSESP from './api'; +import { busConnectionStatus } from './types'; +import type { Stat, Status } from './types'; +import type { Theme } from '@mui/material'; import type { Translation } from 'i18n/i18n-types'; +import type { FC } from 'react'; +import { ButtonRow, FormLoader, SectionContent } from 'components'; +import { AuthenticatedContext } from 'contexts/authentication'; import { useI18nContext } from 'i18n/i18n-react'; +import { extractErrorMessage, useRest } from 'utils'; export const isConnected = ({ status }: Status) => status !== busConnectionStatus.BUS_STATUS_OFFLINE; diff --git a/interface/src/project/DeviceIcon.tsx b/interface/src/project/DeviceIcon.tsx index d199db075..190a659a8 100644 --- a/interface/src/project/DeviceIcon.tsx +++ b/interface/src/project/DeviceIcon.tsx @@ -1,12 +1,12 @@ -import { FC } from 'react'; - +import { AiOutlineControl, AiOutlineGateway, AiOutlineAlert, AiOutlineChrome } from 'react-icons/ai'; import { CgSmartHomeBoiler } from 'react-icons/cg'; + import { FaSolarPanel } from 'react-icons/fa'; -import { MdThermostatAuto, MdOutlineSensors, MdOutlineExtension } from 'react-icons/md'; import { GiHeatHaze } from 'react-icons/gi'; +import { MdThermostatAuto, MdOutlineSensors, MdOutlineExtension } from 'react-icons/md'; import { TiFlowSwitch } from 'react-icons/ti'; import { VscVmConnect } from 'react-icons/vsc'; -import { AiOutlineControl, AiOutlineGateway, AiOutlineAlert, AiOutlineChrome } from 'react-icons/ai'; +import type { FC } from 'react'; interface DeviceIconProps { type_id: number; diff --git a/interface/src/project/Help.tsx b/interface/src/project/Help.tsx index 3d7238239..d5b355823 100644 --- a/interface/src/project/Help.tsx +++ b/interface/src/project/Help.tsx @@ -1,14 +1,12 @@ -import { FC } from 'react'; -import { Navigate, Route, Routes } from 'react-router-dom'; - import { Tab } from '@mui/material'; +import { Navigate, Route, Routes } from 'react-router-dom'; +import HelpInformation from './HelpInformation'; +import type { FC } from 'react'; import { RouterTabs, useRouterTab, useLayoutTitle } from 'components'; import { useI18nContext } from 'i18n/i18n-react'; -import HelpInformation from './HelpInformation'; - const Help: FC = () => { const { LL } = useI18nContext(); const { routerTab } = useRouterTab(); diff --git a/interface/src/project/HelpInformation.tsx b/interface/src/project/HelpInformation.tsx index 4b0c6288b..e849ac19e 100644 --- a/interface/src/project/HelpInformation.tsx +++ b/interface/src/project/HelpInformation.tsx @@ -1,22 +1,17 @@ -import { FC } from 'react'; - +import CommentIcon from '@mui/icons-material/CommentTwoTone'; +import EastIcon from '@mui/icons-material/East'; +import DownloadIcon from '@mui/icons-material/GetApp'; +import GitHubIcon from '@mui/icons-material/GitHub'; +import MenuBookIcon from '@mui/icons-material/MenuBookTwoTone'; import { Typography, Button, Box, List, ListItem, ListItemText, Link, ListItemAvatar } from '@mui/material'; +import { toast } from 'react-toastify'; +import * as EMSESP from './api'; +import type { FC } from 'react'; import { SectionContent } from 'components'; -import { toast } from 'react-toastify'; - -import CommentIcon from '@mui/icons-material/CommentTwoTone'; -import MenuBookIcon from '@mui/icons-material/MenuBookTwoTone'; -import GitHubIcon from '@mui/icons-material/GitHub'; -import DownloadIcon from '@mui/icons-material/GetApp'; -import EastIcon from '@mui/icons-material/East'; - -import { extractErrorMessage } from 'utils'; - import { useI18nContext } from 'i18n/i18n-react'; - -import * as EMSESP from './api'; +import { extractErrorMessage } from 'utils'; const HelpInformation: FC = () => { const { LL } = useI18nContext(); diff --git a/interface/src/project/OptionIcon.tsx b/interface/src/project/OptionIcon.tsx index 220f331c4..d1cbdd2b7 100644 --- a/interface/src/project/OptionIcon.tsx +++ b/interface/src/project/OptionIcon.tsx @@ -1,20 +1,18 @@ -import { FC } from 'react'; -import { SvgIconProps } from '@mui/material'; - -import EditOutlinedIcon from '@mui/icons-material/EditOutlined'; +import CommentsDisabledOutlinedIcon from '@mui/icons-material/CommentsDisabledOutlined'; +import DeleteForeverIcon from '@mui/icons-material/DeleteForever'; +import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline'; import EditOffOutlinedIcon from '@mui/icons-material/EditOffOutlined'; +import EditOutlinedIcon from '@mui/icons-material/EditOutlined'; +import InsertCommentOutlinedIcon from '@mui/icons-material/InsertCommentOutlined'; import StarIcon from '@mui/icons-material/Star'; import StarOutlineIcon from '@mui/icons-material/StarOutline'; import VisibilityOffOutlinedIcon from '@mui/icons-material/VisibilityOffOutlined'; import VisibilityOutlinedIcon from '@mui/icons-material/VisibilityOutlined'; -import CommentsDisabledOutlinedIcon from '@mui/icons-material/CommentsDisabledOutlined'; -import InsertCommentOutlinedIcon from '@mui/icons-material/InsertCommentOutlined'; - -import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline'; -import DeleteForeverIcon from '@mui/icons-material/DeleteForever'; +import type { SvgIconProps } from '@mui/material'; +import type { FC } from 'react'; type OptionType = 'deleted' | 'readonly' | 'web_exclude' | 'api_mqtt_exclude' | 'favorite'; diff --git a/interface/src/project/SettingsApplication.tsx b/interface/src/project/SettingsApplication.tsx index 78481bebd..41ec58dc0 100644 --- a/interface/src/project/SettingsApplication.tsx +++ b/interface/src/project/SettingsApplication.tsx @@ -1,17 +1,16 @@ -import { FC, useState } from 'react'; -import { ValidateFieldsError } from 'async-validator'; - -import { toast } from 'react-toastify'; - -import { Box, Button, Checkbox, MenuItem, Grid, Typography, Divider, InputAdornment } from '@mui/material'; - -import WarningIcon from '@mui/icons-material/Warning'; 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 { useState } from 'react'; +import { toast } from 'react-toastify'; -import { validate } from 'validators'; +import * as EMSESP from './api'; +import { BOARD_PROFILES } from './types'; import { createSettingsValidator } from './validators'; - +import type { Settings } from './types'; +import type { ValidateFieldsError } from 'async-validator'; +import type { FC } from 'react'; import { SectionContent, FormLoader, @@ -21,13 +20,11 @@ import { MessageBox, BlockNavigation } from 'components'; -import { numberValue, extractErrorMessage, updateValueDirty, useRest } from 'utils'; -import * as EMSESP from './api'; -import { Settings, BOARD_PROFILES } from './types'; - -import { useI18nContext } from 'i18n/i18n-react'; import RestartMonitor from 'framework/system/RestartMonitor'; +import { useI18nContext } from 'i18n/i18n-react'; +import { numberValue, extractErrorMessage, updateValueDirty, useRest } from 'utils'; +import { validate } from 'validators'; export function boardProfileSelectItems() { return Object.keys(BOARD_PROFILES).map((code) => ( diff --git a/interface/src/project/SettingsCustomization.tsx b/interface/src/project/SettingsCustomization.tsx index 18e9f1cd0..89211a2c8 100644 --- a/interface/src/project/SettingsCustomization.tsx +++ b/interface/src/project/SettingsCustomization.tsx @@ -1,7 +1,11 @@ -import { FC, useState, useEffect, useCallback } from 'react'; - -import { unstable_useBlocker as useBlocker } from 'react-router-dom'; +import CancelIcon from '@mui/icons-material/Cancel'; +import DoneIcon from '@mui/icons-material/Done'; +import FilterListIcon from '@mui/icons-material/FilterList'; +import PowerSettingsNewIcon from '@mui/icons-material/PowerSettingsNew'; +import SearchIcon from '@mui/icons-material/Search'; +import SettingsBackupRestoreIcon from '@mui/icons-material/SettingsBackupRestore'; +import WarningIcon from '@mui/icons-material/Warning'; import { Button, Typography, @@ -18,34 +22,24 @@ import { TextField, Link } from '@mui/material'; - -import { useTheme } from '@table-library/react-table-library/theme'; import { Table, Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table'; - +import { useTheme } from '@table-library/react-table-library/theme'; +import { useState, useEffect, useCallback } from 'react'; +import { unstable_useBlocker as useBlocker } from 'react-router-dom'; import { toast } from 'react-toastify'; -import WarningIcon from '@mui/icons-material/Warning'; -import CancelIcon from '@mui/icons-material/Cancel'; -import DoneIcon from '@mui/icons-material/Done'; - -import SettingsBackupRestoreIcon from '@mui/icons-material/SettingsBackupRestore'; -import SearchIcon from '@mui/icons-material/Search'; -import FilterListIcon from '@mui/icons-material/FilterList'; -import PowerSettingsNewIcon from '@mui/icons-material/PowerSettingsNew'; - import OptionIcon from './OptionIcon'; -import { ButtonRow, FormLoader, ValidatedTextField, SectionContent, MessageBox, BlockNavigation } from 'components'; - import * as EMSESP from './api'; -import { extractErrorMessage, updateValue } from 'utils'; - -import { DeviceShort, Devices, DeviceEntity, DeviceEntityMask } from './types'; - -import { useI18nContext } from 'i18n/i18n-react'; +import { DeviceEntityMask } from './types'; +import type { DeviceShort, Devices, DeviceEntity } from './types'; +import type { FC } from 'react'; +import { ButtonRow, FormLoader, ValidatedTextField, SectionContent, MessageBox, BlockNavigation } from 'components'; import RestartMonitor from 'framework/system/RestartMonitor'; +import { useI18nContext } from 'i18n/i18n-react'; +import { extractErrorMessage, updateValue } from 'utils'; export const APIURL = window.location.origin + '/api/'; @@ -584,61 +578,59 @@ const SettingsCustomization: FC = () => { ); - const renderContent = () => { - return ( - <> - - {LL.DEVICE_ENTITIES()} - - {renderDeviceList()} - {renderDeviceData()} - {restartNeeded && ( - - - - )} - {!restartNeeded && ( - - - {numChanges !== 0 && ( - - - - - )} - - - - + const renderContent = () => ( + <> + + {LL.DEVICE_ENTITIES()} + + {renderDeviceList()} + {renderDeviceData()} + {restartNeeded && ( + + + + )} + {!restartNeeded && ( + + + {numChanges !== 0 && ( + + + + + )} - )} - {renderResetDialog()} - - ); - }; + + + + + )} + {renderResetDialog()} + + ); const renderEditDialog = () => { if (deviceEntity) { diff --git a/interface/src/project/api.ts b/interface/src/project/api.ts index 155908975..3b99724ea 100644 --- a/interface/src/project/api.ts +++ b/interface/src/project/api.ts @@ -1,7 +1,4 @@ -import { AxiosPromise } from 'axios'; -import { AXIOS, AXIOS_API, AXIOS_BIN } from 'api/endpoints'; - -import { +import type { BoardProfile, BoardProfileName, APIcall, @@ -20,6 +17,8 @@ import { Schedule, Entities } from './types'; +import type { AxiosPromise } from 'axios'; +import { AXIOS, AXIOS_API, AXIOS_BIN } from 'api/endpoints'; export function restart(): AxiosPromise { return AXIOS.post('/restart'); diff --git a/interface/src/utils/time.ts b/interface/src/utils/time.ts index 5efc58719..3fefb063c 100644 --- a/interface/src/utils/time.ts +++ b/interface/src/utils/time.ts @@ -8,10 +8,7 @@ const LOCALE_FORMAT = new Intl.DateTimeFormat([...window.navigator.languages], { hour12: false }); -export const formatDateTime = (dateTime: string) => { - return LOCALE_FORMAT.format(new Date(dateTime.substring(0, 19))); -}; +export const formatDateTime = (dateTime: string) => LOCALE_FORMAT.format(new Date(dateTime.substring(0, 19))); -export const formatLocalDateTime = (date: Date) => { - return new Date(date.getTime() - date.getTimezoneOffset() * 60000).toISOString().slice(0, -1).substring(0, 19); -}; +export const formatLocalDateTime = (date: Date) => + new Date(date.getTime() - date.getTimezoneOffset() * 60000).toISOString().slice(0, -1).substring(0, 19); diff --git a/interface/src/utils/useRest.ts b/interface/src/utils/useRest.ts index f57d20ec0..0dadda46b 100644 --- a/interface/src/utils/useRest.ts +++ b/interface/src/utils/useRest.ts @@ -1,14 +1,12 @@ import { useCallback, useEffect, useState } from 'react'; +import { unstable_useBlocker as useBlocker } from 'react-router-dom'; import { toast } from 'react-toastify'; -import { AxiosPromise } from 'axios'; - import { extractErrorMessage } from '.'; +import type { AxiosPromise } from 'axios'; import { useI18nContext } from 'i18n/i18n-react'; -import { unstable_useBlocker as useBlocker } from 'react-router-dom'; - export interface RestRequestOptions { read: () => AxiosPromise; update?: (value: D) => AxiosPromise; diff --git a/interface/src/utils/useWs.ts b/interface/src/utils/useWs.ts index 7839b53de..8e30da18b 100644 --- a/interface/src/utils/useWs.ts +++ b/interface/src/utils/useWs.ts @@ -1,6 +1,6 @@ +import { debounce } from 'lodash-es'; import { useCallback, useEffect, useRef, useState } from 'react'; import Sockette from 'sockette'; -import { debounce } from 'lodash-es'; import { addAccessTokenParameter } from 'api/authentication'; diff --git a/interface/src/validators/ap.ts b/interface/src/validators/ap.ts index e9e72ecd0..cd5812e8b 100644 --- a/interface/src/validators/ap.ts +++ b/interface/src/validators/ap.ts @@ -1,7 +1,7 @@ import Schema from 'async-validator'; -import { isAPEnabled } from 'framework/ap/APSettingsForm'; -import { APSettings } from 'types'; import { IP_ADDRESS_VALIDATOR } from './shared'; +import type { APSettings } from 'types'; +import { isAPEnabled } from 'framework/ap/APSettingsForm'; export const createAPSettingsValidator = (apSettings: APSettings) => new Schema({ diff --git a/interface/src/validators/mqtt.ts b/interface/src/validators/mqtt.ts index ec95a1b65..d8f841baa 100644 --- a/interface/src/validators/mqtt.ts +++ b/interface/src/validators/mqtt.ts @@ -1,6 +1,6 @@ import Schema from 'async-validator'; -import { MqttSettings } from 'types'; import { IP_OR_HOSTNAME_VALIDATOR } from './shared'; +import type { MqttSettings } from 'types'; export const createMqttSettingsValidator = (mqttSettings: MqttSettings) => new Schema({ diff --git a/interface/src/validators/network.ts b/interface/src/validators/network.ts index ba40ac051..761ce0de7 100644 --- a/interface/src/validators/network.ts +++ b/interface/src/validators/network.ts @@ -1,6 +1,6 @@ import Schema from 'async-validator'; -import { NetworkSettings } from 'types'; import { HOSTNAME_VALIDATOR, IP_ADDRESS_VALIDATOR } from './shared'; +import type { NetworkSettings } from 'types'; export const createNetworkSettingsValidator = (networkSettings: NetworkSettings) => new Schema({ diff --git a/interface/src/validators/security.ts b/interface/src/validators/security.ts index feb9498e2..d1843ac90 100644 --- a/interface/src/validators/security.ts +++ b/interface/src/validators/security.ts @@ -1,5 +1,6 @@ -import Schema, { InternalRuleItem } from 'async-validator'; -import { User } from 'types'; +import Schema from 'async-validator'; +import type { InternalRuleItem } from 'async-validator'; +import type { User } from 'types'; export const SECURITY_SETTINGS_VALIDATOR = new Schema({ jwt_secret: [