chore: update deps & replace deprecated elements

This commit is contained in:
wonfen
2025-05-05 00:26:04 +08:00
parent eda8fc125f
commit dc798fe2dd
19 changed files with 370 additions and 494 deletions

View File

@@ -118,44 +118,46 @@ export const BaseSearchBox = (props: SearchProps) => {
placeholder={props.placeholder ?? t("Filter conditions")}
sx={{ input: { py: 0.65, px: 1.25 } }}
onChange={onChange}
InputProps={{
sx: { pr: 1 },
endAdornment: (
<Box display="flex">
<Tooltip title={t("Match Case")}>
<div>
<SvgIcon
component={matchCaseIcon}
{...iconStyle}
aria-label={matchCase ? "active" : "inactive"}
onClick={() => setMatchCase(!matchCase)}
/>
</div>
</Tooltip>
<Tooltip title={t("Match Whole Word")}>
<div>
<SvgIcon
component={matchWholeWordIcon}
{...iconStyle}
aria-label={matchWholeWord ? "active" : "inactive"}
onClick={() => setMatchWholeWord(!matchWholeWord)}
/>
</div>
</Tooltip>
<Tooltip title={t("Use Regular Expression")}>
<div>
<SvgIcon
component={useRegularExpressionIcon}
aria-label={useRegularExpression ? "active" : "inactive"}
{...iconStyle}
onClick={() =>
setUseRegularExpression(!useRegularExpression)
}
/>{" "}
</div>
</Tooltip>
</Box>
),
slotProps={{
input: {
sx: { pr: 1 },
endAdornment: (
<Box display="flex">
<Tooltip title={t("Match Case")}>
<div>
<SvgIcon
component={matchCaseIcon}
{...iconStyle}
aria-label={matchCase ? "active" : "inactive"}
onClick={() => setMatchCase(!matchCase)}
/>
</div>
</Tooltip>
<Tooltip title={t("Match Whole Word")}>
<div>
<SvgIcon
component={matchWholeWordIcon}
{...iconStyle}
aria-label={matchWholeWord ? "active" : "inactive"}
onClick={() => setMatchWholeWord(!matchWholeWord)}
/>
</div>
</Tooltip>
<Tooltip title={t("Use Regular Expression")}>
<div>
<SvgIcon
component={useRegularExpressionIcon}
aria-label={useRegularExpression ? "active" : "inactive"}
{...iconStyle}
onClick={() =>
setUseRegularExpression(!useRegularExpression)
}
/>{" "}
</div>
</Tooltip>
</Box>
),
}
}}
/>
</Tooltip>

View File

@@ -6,8 +6,8 @@ import {
alpha,
useTheme,
PaletteColor,
Grid,
} from "@mui/material";
import Grid from "@mui/material/Grid2";
import {
ArrowUpwardRounded,
ArrowDownwardRounded,

View File

@@ -1,7 +1,6 @@
import { useEffect, useRef, useMemo, useCallback } from "react";
import { useVerge } from "@/hooks/use-verge";
import { Box, IconButton, Tooltip, alpha, styled } from "@mui/material";
import Grid from "@mui/material/Grid2";
import { Box, IconButton, Tooltip, alpha, styled, Grid } from "@mui/material";
import {
DndContext,
closestCenter,

View File

@@ -484,12 +484,14 @@ export const GroupsEditorViewer = (props: Props) => {
onChange={(e) => {
field.onChange(parseInt(e.target.value));
}}
InputProps={{
slotProps={{
input: {
endAdornment: (
<InputAdornment position="end">
{t("seconds")}
</InputAdornment>
),
}
}}
/>
</Item>
@@ -510,12 +512,14 @@ export const GroupsEditorViewer = (props: Props) => {
onChange={(e) => {
field.onChange(parseInt(e.target.value));
}}
InputProps={{
endAdornment: (
<InputAdornment position="end">
{t("millis")}
</InputAdornment>
),
slotProps={{
input: {
endAdornment: (
<InputAdornment position="end">
{t("millis")}
</InputAdornment>
),
}
}}
/>
</Item>

View File

@@ -282,10 +282,12 @@ export const ProfileViewer = forwardRef<ProfileViewerRef, Props>(
type="number"
placeholder="60"
label={t("HTTP Request Timeout")}
InputProps={{
slotProps={{
input: {
endAdornment: (
<InputAdornment position="end">{t("seconds")}</InputAdornment>
),
}
}}
/>
)}
@@ -303,10 +305,12 @@ export const ProfileViewer = forwardRef<ProfileViewerRef, Props>(
{...field}
type="number"
label={t("Update Interval")}
InputProps={{
endAdornment: (
<InputAdornment position="end">{t("mins")}</InputAdornment>
),
slotProps={{
input: {
endAdornment: (
<InputAdornment position="end">{t("mins")}</InputAdornment>
),
}
}}
/>
)}

View File

@@ -7,8 +7,7 @@ import { useLockFn } from "ahooks";
import {
TextField,
Button,
Grid2,
Box,
Grid,
Stack,
IconButton,
InputAdornment,
@@ -138,10 +137,10 @@ export const BackupConfigViewer = memo(
return (
<form onSubmit={(e) => e.preventDefault()}>
<Grid2 container spacing={2}>
<Grid2 size={{ xs: 12, sm: 9 }}>
<Grid2 container spacing={2}>
<Grid2 size={{ xs: 12 }}>
<Grid container spacing={2}>
<Grid size={{ xs: 12, sm: 9 }}>
<Grid container spacing={2}>
<Grid size={{ xs: 12 }}>
<TextField
fullWidth
label={t("WebDAV Server URL")}
@@ -153,8 +152,8 @@ export const BackupConfigViewer = memo(
spellCheck="false"
inputRef={urlRef}
/>
</Grid2>
<Grid2 size={{ xs: 6 }}>
</Grid>
<Grid size={{ xs: 6 }}>
<TextField
label={t("Username")}
variant="outlined"
@@ -165,8 +164,8 @@ export const BackupConfigViewer = memo(
spellCheck="false"
inputRef={usernameRef}
/>
</Grid2>
<Grid2 size={{ xs: 6 }}>
</Grid>
<Grid size={{ xs: 6 }}>
<TextField
label={t("Password")}
type={showPassword ? "text" : "password"}
@@ -192,10 +191,10 @@ export const BackupConfigViewer = memo(
},
}}
/>
</Grid2>
</Grid2>
</Grid2>
<Grid2 size={{ xs: 12, sm: 3 }}>
</Grid>
</Grid>
</Grid>
<Grid size={{ xs: 12, sm: 3 }}>
<Stack
direction="column"
justifyContent="space-between"
@@ -237,8 +236,8 @@ export const BackupConfigViewer = memo(
</>
)}
</Stack>
</Grid2>
</Grid2>
</Grid>
</Grid>
</form>
);
},

View File

@@ -186,16 +186,18 @@ export const ClashPortViewer = forwardRef<DialogRef>((props, ref) => {
onChange={(e) =>
setSocksPort(+e.target.value?.replace(/\D+/, "").slice(0, 5))
}
InputProps={{
sx: { pr: 1 },
endAdornment: (
<Switch
checked={socksEnabled}
onChange={(_, c) => {
setSocksEnabled(c);
}}
/>
),
slotProps={{
input: {
sx: { pr: 1 },
endAdornment: (
<Switch
checked={socksEnabled}
onChange={(_, c) => {
setSocksEnabled(c);
}}
/>
),
}
}}
/>
</ListItem>
@@ -209,16 +211,18 @@ export const ClashPortViewer = forwardRef<DialogRef>((props, ref) => {
onChange={(e) =>
setPort(+e.target.value?.replace(/\D+/, "").slice(0, 5))
}
InputProps={{
sx: { pr: 1 },
endAdornment: (
<Switch
checked={httpEnabled}
onChange={(_, c) => {
setHttpEnabled(c);
}}
/>
),
slotProps={{
input: {
sx: { pr: 1 },
endAdornment: (
<Switch
checked={httpEnabled}
onChange={(_, c) => {
setHttpEnabled(c);
}}
/>
),
}
}}
/>
</ListItem>
@@ -233,16 +237,18 @@ export const ClashPortViewer = forwardRef<DialogRef>((props, ref) => {
onChange={(e) =>
setRedirPort(+e.target.value?.replace(/\D+/, "").slice(0, 5))
}
InputProps={{
sx: { pr: 1 },
endAdornment: (
<Switch
checked={redirEnabled}
onChange={(_, c) => {
setRedirEnabled(c);
}}
/>
),
slotProps={{
input: {
sx: { pr: 1 },
endAdornment: (
<Switch
checked={redirEnabled}
onChange={(_, c) => {
setRedirEnabled(c);
}}
/>
),
}
}}
/>
</ListItem>
@@ -258,16 +264,18 @@ export const ClashPortViewer = forwardRef<DialogRef>((props, ref) => {
onChange={(e) =>
setTproxyPort(+e.target.value?.replace(/\D+/, "").slice(0, 5))
}
InputProps={{
sx: { pr: 1 },
endAdornment: (
<Switch
checked={tproxyEnabled}
onChange={(_, c) => {
setTproxyEnabled(c);
}}
/>
),
slotProps={{
input: {
sx: { pr: 1 },
endAdornment: (
<Switch
checked={tproxyEnabled}
onChange={(_, c) => {
setTproxyEnabled(c);
}}
/>
),
}
}}
/>
</ListItem>

View File

@@ -240,10 +240,12 @@ export const MiscViewer = forwardRef<DialogRef>((props, ref) => {
defaultLatencyTimeout: parseInt(e.target.value),
}))
}
InputProps={{
endAdornment: (
<InputAdornment position="end">{t("millis")}</InputAdornment>
),
slotProps={{
input: {
endAdornment: (
<InputAdornment position="end">{t("millis")}</InputAdornment>
),
}
}}
/>
</ListItem>

View File

@@ -412,8 +412,10 @@ export const SysproxyViewer = forwardRef<DialogRef>((props, ref) => {
size="small"
value={value.duration}
sx={{ width: 100 }}
InputProps={{
endAdornment: <InputAdornment position="end">s</InputAdornment>,
slotProps={{
input: {
endAdornment: <InputAdornment position="end">s</InputAdornment>,
}
}}
onChange={(e) => {
setValue((v) => ({