mirror of
https://github.com/clash-verge-rev/clash-verge-rev.git
synced 2024-11-16 11:42:21 +08:00
feat: profiles: import btn with loading state
This commit is contained in:
parent
2c2c174874
commit
ee79bcfc44
|
@ -3,6 +3,7 @@ import { useMemo, useRef, useState } from "react";
|
||||||
import { useLockFn } from "ahooks";
|
import { useLockFn } from "ahooks";
|
||||||
import { useSetRecoilState } from "recoil";
|
import { useSetRecoilState } from "recoil";
|
||||||
import { Box, Button, Grid, IconButton, Stack, TextField } from "@mui/material";
|
import { Box, Button, Grid, IconButton, Stack, TextField } from "@mui/material";
|
||||||
|
import { LoadingButton } from "@mui/lab";
|
||||||
import {
|
import {
|
||||||
ClearRounded,
|
ClearRounded,
|
||||||
ContentCopyRounded,
|
ContentCopyRounded,
|
||||||
|
@ -38,6 +39,7 @@ const ProfilePage = () => {
|
||||||
const [url, setUrl] = useState("");
|
const [url, setUrl] = useState("");
|
||||||
const [disabled, setDisabled] = useState(false);
|
const [disabled, setDisabled] = useState(false);
|
||||||
const [activating, setActivating] = useState("");
|
const [activating, setActivating] = useState("");
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
const {
|
const {
|
||||||
profiles = {},
|
profiles = {},
|
||||||
|
@ -76,12 +78,13 @@ const ProfilePage = () => {
|
||||||
|
|
||||||
const onImport = async () => {
|
const onImport = async () => {
|
||||||
if (!url) return;
|
if (!url) return;
|
||||||
setUrl("");
|
setLoading(true);
|
||||||
setDisabled(true);
|
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await importProfile(url);
|
await importProfile(url);
|
||||||
Notice.success("Successfully import profile.");
|
Notice.success("Successfully import profile.");
|
||||||
|
setUrl("");
|
||||||
|
setLoading(false);
|
||||||
|
|
||||||
getProfiles().then((newProfiles) => {
|
getProfiles().then((newProfiles) => {
|
||||||
mutate("getProfiles", newProfiles);
|
mutate("getProfiles", newProfiles);
|
||||||
|
@ -96,8 +99,10 @@ const ProfilePage = () => {
|
||||||
});
|
});
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
Notice.error(err.message || err.toString());
|
Notice.error(err.message || err.toString());
|
||||||
|
setLoading(false);
|
||||||
} finally {
|
} finally {
|
||||||
setDisabled(false);
|
setDisabled(false);
|
||||||
|
setLoading(false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -271,14 +276,15 @@ const ProfilePage = () => {
|
||||||
),
|
),
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Button
|
<LoadingButton
|
||||||
disabled={!url || disabled}
|
disabled={!url || disabled}
|
||||||
|
loading={loading}
|
||||||
variant="contained"
|
variant="contained"
|
||||||
size="small"
|
size="small"
|
||||||
onClick={onImport}
|
onClick={onImport}
|
||||||
>
|
>
|
||||||
{t("Import")}
|
{t("Import")}
|
||||||
</Button>
|
</LoadingButton>
|
||||||
<Button
|
<Button
|
||||||
variant="contained"
|
variant="contained"
|
||||||
size="small"
|
size="small"
|
||||||
|
|
Loading…
Reference in New Issue
Block a user