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

fix: edit profile info

Browse Source
This commit is contained in:
GyDi 2022-05-06 12:46:27 +08:00 committed by GitHub
parent 0e68c5e8bc
commit 798999d490
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 34 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/components/profile/profile-edit.tsx
View File

@ -1,6 +1,7 @@
import { mutate } from "swr"; import { mutate } from "swr";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useLockFn, useSetState } from "ahooks"; import { useLockFn, useSetState } from "ahooks";
import { useTranslation } from "react-i18next";
import { import {
Button, Button,
Dialog, Dialog,
@ -25,6 +26,8 @@ interface Props {
// remote / local file / merge / script // remote / local file / merge / script
const ProfileEdit = (props: Props) => { const ProfileEdit = (props: Props) => {
const { open, itemData, onClose } = props; const { open, itemData, onClose } = props;
const { t } = useTranslation();
const [form, setForm] = useSetState({ ...itemData }); const [form, setForm] = useSetState({ ...itemData });
const [option, setOption] = useSetState(itemData.option ?? {}); const [option, setOption] = useSetState(itemData.option ?? {});
const [showOpt, setShowOpt] = useState(!!itemData.option); const [showOpt, setShowOpt] = useState(!!itemData.option);
@ -33,7 +36,10 @@ const ProfileEdit = (props: Props) => {
if (itemData) { if (itemData) {
setForm({ ...itemData }); setForm({ ...itemData });
setOption(itemData.option ?? {}); setOption(itemData.option ?? {});
setShowOpt(!!itemData.option?.user_agent); setShowOpt(
itemData.type === "remote" &&
(!!itemData.option?.user_agent || !!itemData.option?.update_interval)
);
} }
}, [itemData]); }, [itemData]);
@ -41,7 +47,10 @@ const ProfileEdit = (props: Props) => {
try { try {
const { uid } = itemData; const { uid } = itemData;
const { name, desc, url } = form; const { name, desc, url } = form;
const option_ = itemData.type === "remote" ? option : undefined; const option_ =
itemData.type === "remote" || itemData.type === "local"
? option
: undefined;
if (itemData.type === "remote" && !url) { if (itemData.type === "remote" && !url) {
throw new Error("Remote URL should not be null"); throw new Error("Remote URL should not be null");
@ -65,11 +74,11 @@ const ProfileEdit = (props: Props) => {
const type = const type =
form.type || form.type ||
(form.url ? "remote" : form.file?.endsWith("js") ? "script" : "local"); (form.url ? "remote" : form.file?.endsWith(".js") ? "script" : "local");
return ( return (
<Dialog open={open} onClose={onClose}> <Dialog open={open} onClose={onClose}>
<DialogTitle sx={{ pb: 0.5 }}>Edit Profile</DialogTitle> <DialogTitle sx={{ pb: 0.5 }}>{t("Edit Info")}</DialogTitle>
<DialogContent sx={{ width: 336, pb: 1 }}> <DialogContent sx={{ width: 336, pb: 1 }}>
<TextField <TextField
@ -100,7 +109,7 @@ const ProfileEdit = (props: Props) => {
{type === "remote" && ( {type === "remote" && (
<TextField <TextField
{...textFieldProps} {...textFieldProps}
label="Subscription Url" label="Subscription URL"
value={form.url} value={form.url}
onChange={(e) => setForm({ url: e.target.value })} onChange={(e) => setForm({ url: e.target.value })}
onKeyDown={(e) => e.key === "Enter" && onUpdate()} onKeyDown={(e) => e.key === "Enter" && onUpdate()}
@ -108,26 +117,27 @@ const ProfileEdit = (props: Props) => {
)} )}
{showOpt && ( {showOpt && (
<> <TextField
<TextField {...textFieldProps}
{...textFieldProps} label="User Agent"
label="User Agent" value={option.user_agent}
value={option.user_agent} placeholder="clash-verge/v1.0.0"
onChange={(e) => setOption({ user_agent: e.target.value })} onChange={(e) => setOption({ user_agent: e.target.value })}
onKeyDown={(e) => e.key === "Enter" && onUpdate()} onKeyDown={(e) => e.key === "Enter" && onUpdate()}
/> />
)}
<TextField {((type === "remote" && showOpt) || type === "local") && (
{...textFieldProps} <TextField
label="Update Interval (mins)" {...textFieldProps}
value={option.update_interval} label="Update Interval (mins)"
onChange={(e) => { value={option.update_interval}
const str = e.target.value?.replace(/\D/, ""); onChange={(e) => {
setOption({ update_interval: str != null ? +str : str }); const str = e.target.value?.replace(/\D/, "");
}} setOption({ update_interval: str != null ? +str : str });
onKeyDown={(e) => e.key === "Enter" && onUpdate()} }}
/> onKeyDown={(e) => e.key === "Enter" && onUpdate()}
</> />
)} )}
</DialogContent> </DialogContent>