feat: refine CA setup UX by moving setup button to Admin and adding redirection link

This commit is contained in:
dyzulk
2026-01-07 10:30:36 +07:00
parent 8ae637d9c6
commit 90ea7bb4a2
4 changed files with 54 additions and 39 deletions

View File

@@ -25,6 +25,7 @@ export default function RootCaManagementClient() {
const { addToast } = useToast();
const { data, error, mutate, isLoading } = useSWR("/api/admin/ca-certificates", fetcher);
const [isRenewing, setIsRenewing] = useState(false);
const [isSettingUp, setIsSettingUp] = useState(false);
const [isBulkRenewing, setIsBulkRenewing] = useState(false);
const [activeSync, setActiveSync] = useState<string | null>(null);
const [isPromoting, setIsPromoting] = useState(false);
@@ -116,6 +117,20 @@ export default function RootCaManagementClient() {
}
};
const handleSetupCa = async () => {
setIsSettingUp(true);
try {
await axios.post("/api/ca/setup");
mutate();
addToast(t("toast_ca_setup_success"), "success");
} catch (err: any) {
console.error(err);
addToast(err.response?.data?.message || t("toast_ca_setup_failed"), "error");
} finally {
setIsSettingUp(false);
}
};
if (error) return <div className="p-10 text-center text-error-500">{t("load_failed")}</div>;
const certificates = data?.data || [];
@@ -124,15 +139,28 @@ export default function RootCaManagementClient() {
<div className="space-y-6">
<div className="flex flex-col md:flex-row md:items-center justify-between mb-2 gap-4">
<PageBreadcrumb pageTitle={t("management_title")} />
<Button
variant="warning"
size="sm"
onClick={() => setShowBulkRenewConfirm(true)}
loading={isBulkRenewing}
disabled={isLoading || isRenewing || isPromoting}
>
{t("renew_all_button")}
</Button>
<div className="flex items-center gap-2">
{certificates.length === 0 && !isLoading && (
<Button
variant="primary"
size="sm"
onClick={handleSetupCa}
loading={isSettingUp}
disabled={isLoading || isRenewing || isPromoting}
>
{t("btn_initialize_ca")}
</Button>
)}
<Button
variant="warning"
size="sm"
onClick={() => setShowBulkRenewConfirm(true)}
loading={isBulkRenewing}
disabled={isLoading || isRenewing || isPromoting || certificates.length === 0}
>
{t("renew_all_button")}
</Button>
</div>
</div>
<div className="space-y-6">