diff --git a/src/pages/rules.tsx b/src/pages/rules.tsx index 6d6046728fb9134da448484cc38e218f85508929..60f6853446ca832815d3c6fb951a62cd9bd8478b 100644 --- a/src/pages/rules.tsx +++ b/src/pages/rules.tsx @@ -1,14 +1,28 @@ import { useState } from "react"; -import { invoke } from "@tauri-apps/api"; -import { Box, Button, Grid, TextField, Typography } from "@mui/material"; +import { + Box, + Button, + Grid, + Slide, + Snackbar, + TextField, + Typography, +} from "@mui/material"; +import { importProfile } from "../services/command"; const RulesPage = () => { const [url, setUrl] = useState(""); + const [message, setMessage] = useState(""); + const [disabled, setDisabled] = useState(false); - const onClick = async () => { + const onClick = () => { if (!url) return; - const data = await invoke("cmd_import_profile", { url }); - console.log(data); + setUrl(""); + setDisabled(true); + importProfile(url) + .then(() => setMessage("Successfully import profile.")) + .catch(() => setMessage("Failed to import profile.")) + .finally(() => setDisabled(false)); }; return ( @@ -26,17 +40,32 @@ const RulesPage = () => { <Grid item xs={9}> <TextField label="Profile Url" + size="medium" fullWidth value={url} onChange={(e) => setUrl(e.target.value)} /> </Grid> <Grid item> - <Button size="large" variant="contained" onClick={onClick}> - View + <Button + disabled={disabled} + size="large" + variant="contained" + onClick={onClick} + > + Import </Button> </Grid> </Grid> + + <Snackbar + open={!!message} + anchorOrigin={{ vertical: "top", horizontal: "right" }} + autoHideDuration={3000} + onClose={() => setMessage("")} + message={message} + TransitionComponent={(p) => <Slide {...p} direction="left" />} + /> </Box> ); };