purgatory/clash-verge
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: remove smoother

Browse Source
This commit is contained in:
GyDi 2022-10-29 20:05:55 +08:00
parent a45dc6efda
commit 4649454282
No known key found for this signature in database
GPG Key ID: 58B15242BA8277A6
2 changed files with 79 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

158
src/components/profile/profile-new.tsx
View File

@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
import { useLockFn, useSetState } from "ahooks";
import {
Button,
Collapse,
Dialog,
DialogActions,
DialogContent,
@ -21,7 +22,6 @@ import { Settings } from "@mui/icons-material";
import { createProfile } from "@/services/cmds";
import Notice from "../base/base-notice";
import FileInput from "./file-input";
import { Smoother } from "./smoother";
interface Props {
open: boolean;
@ -94,98 +94,98 @@ const ProfileNew = (props: Props) => {
<DialogTitle sx={{ pb: 0.5 }}>{t("Create Profile")}</DialogTitle>
<DialogContent sx={{ width: 336, pb: 1 }}>
<Smoother>
<FormControl size="small" fullWidth sx={{ mt: 2, mb: 1 }}>
<InputLabel>Type</InputLabel>
<Select
autoFocus
label={t("Type")}
value={form.type}
onChange={(e) => setForm({ type: e.target.value })}
>
<MenuItem value="remote">Remote</MenuItem>
<MenuItem value="local">Local</MenuItem>
<MenuItem value="script">Script</MenuItem>
<MenuItem value="merge">Merge</MenuItem>
</Select>
</FormControl>
<FormControl size="small" fullWidth sx={{ mt: 2, mb: 1 }}>
<InputLabel>Type</InputLabel>
<Select
autoFocus
label={t("Type")}
value={form.type}
onChange={(e) => setForm({ type: e.target.value })}
>
<MenuItem value="remote">Remote</MenuItem>
<MenuItem value="local">Local</MenuItem>
<MenuItem value="script">Script</MenuItem>
<MenuItem value="merge">Merge</MenuItem>
</Select>
</FormControl>
<TextField
{...textFieldProps}
label={t("Name")}
autoComplete="off"
value={form.name}
onChange={(e) => setForm({ name: e.target.value })}
/>
<TextField
{...textFieldProps}
label={t("Descriptions")}
autoComplete="off"
value={form.desc}
onChange={(e) => setForm({ desc: e.target.value })}
/>
{form.type === "remote" && (
<TextField
{...textFieldProps}
label={t("Name")}
label={t("Subscription URL")}
autoComplete="off"
value={form.name}
onChange={(e) => setForm({ name: e.target.value })}
value={form.url}
onChange={(e) => setForm({ url: e.target.value })}
/>
)}
{form.type === "local" && (
<FileInput onChange={(val) => (fileDataRef.current = val)} />
)}
<Collapse
in={form.type === "remote" && showOpt}
timeout="auto"
unmountOnExit
>
<TextField
{...textFieldProps}
label={t("Descriptions")}
label="User Agent"
autoComplete="off"
value={form.desc}
onChange={(e) => setForm({ desc: e.target.value })}
value={option.user_agent}
onChange={(e) => setOption({ user_agent: e.target.value })}
/>
{form.type === "remote" && (
<TextField
{...textFieldProps}
label={t("Subscription URL")}
autoComplete="off"
value={form.url}
onChange={(e) => setForm({ url: e.target.value })}
/>
)}
{form.type === "local" && (
<FileInput onChange={(val) => (fileDataRef.current = val)} />
)}
{form.type === "remote" && showOpt && (
<>
<TextField
{...textFieldProps}
label="User Agent"
autoComplete="off"
value={option.user_agent}
onChange={(e) => setOption({ user_agent: e.target.value })}
/>
<FormControlLabel
label={t("Use System Proxy")}
labelPlacement="start"
sx={{ ml: 0, my: 1 }}
control={
<Switch
color="primary"
checked={option.with_proxy}
onChange={(_e, c) =>
setOption((o) => ({
self_proxy: c ? false : o.self_proxy,
with_proxy: c,
}))
}
/>
<FormControlLabel
label={t("Use System Proxy")}
labelPlacement="start"
sx={{ ml: 0, my: 1 }}
control={
<Switch
color="primary"
checked={option.with_proxy}
onChange={(_e, c) =>
setOption((o) => ({
self_proxy: c ? false : o.self_proxy,
with_proxy: c,
}))
}
/>
<FormControlLabel
label={t("Use Clash Proxy")}
labelPlacement="start"
sx={{ ml: 0, my: 1 }}
control={
<Switch
color="primary"
checked={option.self_proxy}
onChange={(_e, c) =>
setOption((o) => ({
with_proxy: c ? false : o.with_proxy,
self_proxy: c,
}))
}
/>
}
/>
<FormControlLabel
label={t("Use Clash Proxy")}
labelPlacement="start"
sx={{ ml: 0, my: 1 }}
control={
<Switch
color="primary"
checked={option.self_proxy}
onChange={(_e, c) =>
setOption((o) => ({
with_proxy: c ? false : o.with_proxy,
self_proxy: c,
}))
}
/>
</>
)}
</Smoother>
}
/>
</Collapse>
</DialogContent>
<DialogActions sx={{ px: 2, pb: 2, position: "relative" }}>

30
src/components/profile/smoother.tsx
View File

@ -1,30 +0,0 @@
import { useEffect, useRef } from "react";
export const Smoother: React.FC = ({ children }) => {
const self = useRef<HTMLDivElement>(null);
useEffect(() => {
if (typeof window.getComputedStyle == "undefined") return;
const element = self.current;
if (!element) return;
var height = window.getComputedStyle(element).height;
element.style.transition = "none";
element.style.height = "auto";
var targetHeight = window.getComputedStyle(element).height;
element.style.height = height;
setTimeout(() => {
element.style.transition = "height .5s";
element.style.height = targetHeight;
}, 0);
});
return (
<div
ref={self}
style={{
overflowY: "hidden",
}}
>
{children}
</div>
);
};