wood/certimate
1
0
Fork 0
mirror of https://github.com/woodchen-ink/certimate.git synced 2025-07-19 09:51:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: show loading button when pushing test notifications

Browse Source
This commit is contained in:
Fu Diwei 2024-11-10 20:00:19 +08:00
parent 44497a0969
commit 8fecebc254
8 changed files with 87 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
ui/src/components/notify/Bark.tsx
View File

@ -123,8 +123,13 @@ const Bark = () => {
}
};
const [testing, setTesting] = useState<boolean>(false);
const handlePushTestClick = async () => {
if (testing) return;
try {
setTesting(true);
await notifyTest("bark");
toast({
@ -139,6 +144,8 @@ const Bark = () => {
description: `${t("settings.notification.push_test_message.failed.message")}: ${msg}`,
variant: "destructive",
});
} finally {
setTesting(false);
}
};
@ -238,6 +245,7 @@ const Bark = () => {
<Show when={!changed && bark.id != ""}>
<Button
variant="secondary"
loading={testing}
onClick={() => {
handlePushTestClick();
}}

8
ui/src/components/notify/DingTalk.tsx
View File

@ -120,11 +120,18 @@ const DingTalk = () => {
description: `${t("settings.notification.config.failed.message")}: ${msg}`,
variant: "destructive",
});
} finally {
setTesting(false);
}
};
const [testing, setTesting] = useState<boolean>(false);
const handlePushTestClick = async () => {
if (testing) return;
try {
setTesting(true);
await notifyTest("dingtalk");
toast({
@ -236,6 +243,7 @@ const DingTalk = () => {
<Show when={!changed && dingtalk.id != ""}>
<Button
variant="secondary"
loading={testing}
onClick={() => {
handlePushTestClick();
}}

8
ui/src/components/notify/Email.tsx
View File

@ -146,8 +146,13 @@ const Mail = () => {
}
};
const [testing, setTesting] = useState<boolean>(false);
const handlePushTestClick = async () => {
if (testing) return;
try {
setTesting(true);
await notifyTest("email");
toast({
@ -162,6 +167,8 @@ const Mail = () => {
description: `${t("settings.notification.push_test_message.failed.message")}: ${msg}`,
variant: "destructive",
});
} finally {
setTesting(false);
}
};
@ -360,6 +367,7 @@ const Mail = () => {
<Show when={!changed && mail.id != ""}>
<Button
variant="secondary"
loading={testing}
onClick={() => {
handlePushTestClick();
}}

8
ui/src/components/notify/Lark.tsx
View File

@ -116,11 +116,18 @@ const Lark = () => {
description: `${t("settings.notification.config.failed.message")}: ${msg}`,
variant: "destructive",
});
} finally {
setTesting(false);
}
};
const [testing, setTesting] = useState<boolean>(false);
const handlePushTestClick = async () => {
if (testing) return;
try {
setTesting(true);
await notifyTest("lark");
toast({
@ -214,6 +221,7 @@ const Lark = () => {
<Show when={!changed && lark.id != ""}>
<Button
variant="secondary"
loading={testing}
onClick={() => {
handlePushTestClick();
}}

8
ui/src/components/notify/ServerChan.tsx
View File

@ -130,8 +130,13 @@ const ServerChan = () => {
}
};
const [testing, setTesting] = useState<boolean>(false);
const handlePushTestClick = async () => {
if (testing) return;
try {
setTesting(true);
await notifyTest("serverchan");
toast({
@ -146,6 +151,8 @@ const ServerChan = () => {
description: `${t("settings.notification.push_test_message.failed.message")}: ${msg}`,
variant: "destructive",
});
} finally {
setTesting(false);
}
};
@ -225,6 +232,7 @@ const ServerChan = () => {
<Show when={!changed && serverchan.id != ""}>
<Button
variant="secondary"
loading={testing}
onClick={() => {
handlePushTestClick();
}}

8
ui/src/components/notify/Telegram.tsx
View File

@ -123,8 +123,13 @@ const Telegram = () => {
}
};
const [testing, setTesting] = useState<boolean>(false);
const handlePushTestClick = async () => {
if (testing) return;
try {
setTesting(true);
await notifyTest("telegram");
toast({
@ -139,6 +144,8 @@ const Telegram = () => {
description: `${t("settings.notification.push_test_message.failed.message")}: ${msg}`,
variant: "destructive",
});
} finally {
setTesting(false);
}
};
@ -238,6 +245,7 @@ const Telegram = () => {
<Show when={!changed && telegram.id != ""}>
<Button
variant="secondary"
loading={testing}
onClick={() => {
handlePushTestClick();
}}

8
ui/src/components/notify/Webhook.tsx
View File

@ -130,8 +130,13 @@ const Webhook = () => {
}
};
const [testing, setTesting] = useState<boolean>(false);
const handlePushTestClick = async () => {
if (testing) return;
try {
setTesting(true);
await notifyTest("webhook");
toast({
@ -146,6 +151,8 @@ const Webhook = () => {
description: `${t("settings.notification.push_test_message.failed.message")}: ${msg}`,
variant: "destructive",
});
} finally {
setTesting(false);
}
};
@ -225,6 +232,7 @@ const Webhook = () => {
<Show when={!changed && webhook.id != ""}>
<Button
variant="secondary"
loading={testing}
onClick={() => {
handlePushTestClick();
}}

34
ui/src/components/ui/button.tsx
View File

@ -1,6 +1,7 @@
import * as React from "react";
import { Slot } from "@radix-ui/react-slot";
import { cva, type VariantProps } from "class-variance-authority";
import { Loader2 } from "lucide-react";
import { cn } from "@/lib/utils";
@ -32,11 +33,38 @@ const buttonVariants = cva(
export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
asChild?: boolean;
loading?: boolean;
}
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(({ className, variant, size, asChild = false, ...props }, ref) => {
const Comp = asChild ? Slot : "button";
return <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />;
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(({ className, variant, size, loading, asChild = false, children, ...props }, ref) => {
if (asChild) {
return (
<Slot ref={ref} {...props}>
<>
{React.Children.map(children as React.ReactElement, (child: React.ReactElement) => {
return React.cloneElement(child, {
className: cn(buttonVariants({ variant, size }), className),
children: (
<>
{loading && <Loader2 className={cn("h-4 w-4 animate-spin", children && "mr-2")} />}
{child.props.children}
</>
),
});
})}
</>
</Slot>
);
}
return (
<button className={cn(buttonVariants({ variant, size, className }))} disabled={loading} ref={ref} {...props}>
<>
{loading && <Loader2 className={cn("h-4 w-4 animate-spin", children && "mr-2")} />}
{children}
</>
</button>
);
});
Button.displayName = "Button";