Limit fields to max 4 and valid statuses

This commit is contained in:
Felix Cornelius 2024-11-19 21:03:32 +01:00
parent 55dd26ce44
commit 5e938b69a0
2 changed files with 21 additions and 13 deletions

View File

@ -5,7 +5,7 @@ description: ArgoCD Widget Configuration
Learn more about [ArgoCD](https://argo-cd.readthedocs.io/en/stable/). Learn more about [ArgoCD](https://argo-cd.readthedocs.io/en/stable/).
Allowed fields: `["apps", "synced", "outOfSync", "healthy", "progressing", "degraded", "suspended", "missing"]` Allowed fields (limited to a max of 4): `["apps", "synced", "outOfSync", "healthy", "progressing", "degraded", "suspended", "missing"]`
```yaml ```yaml
widget: widget:

View File

@ -5,20 +5,28 @@ import useWidgetAPI from "utils/proxy/use-widget-api";
export default function Component({ service }) { export default function Component({ service }) {
const { widget } = service; const { widget } = service;
// Limits fields to available statuses
const validFields = ["apps", "synced", "outOfSync", "healthy", "progressing", "degraded", "suspended", "missing"];
widget.fields = widget.fields.filter((field) => validFields.includes(field));
// Limits max number of displayed fields
const MAX_ALLOWED_FIELDS = 4;
if (widget.fields != null && widget.fields.length > MAX_ALLOWED_FIELDS) {
widget.fields = widget.fields.slice(0, MAX_ALLOWED_FIELDS);
}
const { data: appsData, error: appsError } = useWidgetAPI(widget, "applications"); const { data: appsData, error: appsError } = useWidgetAPI(widget, "applications");
const appCounts = ["apps", "synced", "outOfSync", "healthy", "progressing", "degraded", "suspended", "missing"].map( const appCounts = widget.fields.map((status) => {
(status) => { if (status === "apps") {
if (status === "apps") { return { status, count: appsData?.items?.length };
return { status, count: appsData?.items?.length }; }
} const apiStatus = status.charAt(0).toUpperCase() + status.slice(1);
const apiStatus = status.charAt(0).toUpperCase() + status.slice(1); const count = appsData?.items?.filter(
const count = appsData?.items?.filter( (item) => item.status?.sync?.status === apiStatus || item.status?.health?.status === apiStatus,
(item) => item.status?.sync?.status === apiStatus || item.status?.health?.status === apiStatus, ).length;
).length; return { status, count };
return { status, count }; });
},
);
if (appsError) { if (appsError) {
return <Container service={service} error={appsError} />; return <Container service={service} error={appsError} />;