calvin.erfmann/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-05-28 03:32:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve cert restart button style

Browse Source
This commit is contained in:
miloschwartz
2026-04-26 16:50:40 -07:00
parent 5695137280
commit 6befdfe01e
2 changed files with 42 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
messages/en-US.json
View File

@@ -1596,7 +1596,7 @@
"initialSetupDescription": "Create the intial server admin account. Only one server admin can exist. You can always change these credentials later.", "initialSetupDescription": "Create the intial server admin account. Only one server admin can exist. You can always change these credentials later.",
"createAdminAccount": "Create Admin Account", "createAdminAccount": "Create Admin Account",
"setupErrorCreateAdmin": "An error occurred while creating the server admin account.", "setupErrorCreateAdmin": "An error occurred while creating the server admin account.",
"certificateStatus": "Certificate Status", "certificateStatus": "Certificate",
"loading": "Loading", "loading": "Loading",
"loadingAnalytics": "Loading Analytics", "loadingAnalytics": "Loading Analytics",
"restart": "Restart", "restart": "Restart",

61
src/components/CertificateStatus.tsx
View File

@@ -117,6 +117,8 @@ export default function CertificateStatus({
); );
} }
const isPending = cert.status === "pending";
return ( return (
<div className={`flex items-center gap-2 ${className}`}> <div className={`flex items-center gap-2 ${className}`}>
{showLabel && ( {showLabel && (
@@ -124,27 +126,46 @@ export default function CertificateStatus({
{t("certificateStatus")}: {t("certificateStatus")}:
</span> </span>
)} )}
<span className={`text-sm ${getStatusColor(cert.status)}`}> {isPending ? (
<span className="inline-flex items-center"> <Button
{cert.status.charAt(0).toUpperCase() + cert.status.slice(1)} variant="ghost"
{shouldShowRefreshButton(cert.status, cert.updatedAt) && ( className={`h-auto p-0 text-sm ${getStatusColor(cert.status)}`}
<Button onClick={handleRefresh}
size="icon" disabled={refreshing}
variant="ghost" title={t("restartCertificate", {
className="ml-2 p-0 h-auto align-middle" defaultValue: "Restart Certificate"
onClick={handleRefresh} })}
disabled={refreshing} >
title={t("restartCertificate", { <span className="inline-flex items-center gap-1">
defaultValue: "Restart Certificate" {cert.status.charAt(0).toUpperCase() + cert.status.slice(1)}
})} <RotateCw
> className={`h-3 w-3 ${refreshing ? "animate-spin" : ""}`}
<RotateCw />
className={`w-4 h-4 ${refreshing ? "animate-spin" : ""}`} </span>
/> </Button>
</Button> ) : (
)} <span className={`text-sm ${getStatusColor(cert.status)}`}>
<span className="inline-flex items-center gap-1">
{cert.status.charAt(0).toUpperCase() + cert.status.slice(1)}
{shouldShowRefreshButton(cert.status, cert.updatedAt) && (
<Button
size="icon"
variant="ghost"
className="p-0 w-3 h-auto align-middle"
onClick={handleRefresh}
disabled={refreshing}
title={t("restartCertificate", {
defaultValue: "Restart Certificate"
})}
>
<RotateCw
className={`w-3 h-3 ${refreshing ? "animate-spin" : ""}`}
/>
</Button>
)}
</span>
</span> </span>
</span> )}
</div> </div>
); );
} }