fuomag9
6ecd195073
- Split ACME / Imported / CA-mTLS into tabs with count badges - Add clickable status summary bar (expired / expiring soon / healthy) - Per-tab search filter by name and domain - Replace accordion cards with DataTable for imported certs - Slide-in Drawers (480 px) for add/edit imported and CA certs - File upload + show/hide toggle for private key in ImportCertDrawer - CaCertDrawer: Generate / Import PEM tabs for add, simple form for edit - CA tab: expandable rows showing issued client certs inline - RelativeTime component: "in 45 days" / "EXPIRED 3 days ago" with date tooltip - Remove CreateCaCertDialog and EditCaCertDialog (replaced by CaCertDrawer) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
47 lines
1.1 KiB
TypeScript
47 lines
1.1 KiB
TypeScript
"use client";
|
|
|
|
import { Chip, Stack } from "@mui/material";
|
|
|
|
type Props = {
|
|
expired: number;
|
|
expiringSoon: number;
|
|
healthy: number;
|
|
filter: string | null;
|
|
onFilter: (f: string | null) => void;
|
|
};
|
|
|
|
export function StatusSummaryBar({ expired, expiringSoon, healthy, filter, onFilter }: Props) {
|
|
function toggle(key: string) {
|
|
onFilter(filter === key ? null : key);
|
|
}
|
|
|
|
return (
|
|
<Stack direction="row" spacing={1} flexWrap="wrap">
|
|
<Chip
|
|
label={`${expired} expired`}
|
|
color="error"
|
|
variant={filter === "expired" ? "filled" : "outlined"}
|
|
onClick={() => toggle("expired")}
|
|
clickable
|
|
size="small"
|
|
/>
|
|
<Chip
|
|
label={`${expiringSoon} expiring soon`}
|
|
color="warning"
|
|
variant={filter === "expiring_soon" ? "filled" : "outlined"}
|
|
onClick={() => toggle("expiring_soon")}
|
|
clickable
|
|
size="small"
|
|
/>
|
|
<Chip
|
|
label={`${healthy} healthy`}
|
|
color="success"
|
|
variant={filter === "ok" ? "filled" : "outlined"}
|
|
onClick={() => toggle("ok")}
|
|
clickable
|
|
size="small"
|
|
/>
|
|
</Stack>
|
|
);
|
|
}
|