From 612d1c76d496ac82eac5b69a059990bb17774fc8 Mon Sep 17 00:00:00 2001
From: Jens L <jens.langhammer@beryju.org>
Date: Fri, 24 Feb 2023 22:54:11 +0100
Subject: [PATCH] web/admin: fix chart display with no sources (#4782)

---
 .../admin-overview/cards/SystemStatusCard.ts      | 15 +++++++++------
 .../admin-overview/charts/LDAPSyncStatusChart.ts  |  4 ++--
 .../admin-overview/charts/OutpostStatusChart.ts   |  6 +++---
 3 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/web/src/admin/admin-overview/cards/SystemStatusCard.ts b/web/src/admin/admin-overview/cards/SystemStatusCard.ts
index 8a02f5d99..5ff99b3a2 100644
--- a/web/src/admin/admin-overview/cards/SystemStatusCard.ts
+++ b/web/src/admin/admin-overview/cards/SystemStatusCard.ts
@@ -7,7 +7,7 @@ import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
 import { t } from "@lingui/macro";
 
 import { TemplateResult, html } from "lit";
-import { customElement } from "lit/decorators.js";
+import { customElement, state } from "lit/decorators.js";
 
 import { AdminApi, OutpostsApi, System } from "@goauthentik/api";
 
@@ -18,6 +18,9 @@ export class SystemStatusCard extends AdminStatusCard<System> {
     header = t`System status`;
     icon = "pf-icon pf-icon-server";
 
+    @state()
+    statusSummary?: string;
+
     async getPrimaryValue(): Promise<System> {
         this.now = new Date();
         let status = await new AdminApi(DEFAULT_CONFIG).adminSystemRetrieve();
@@ -50,7 +53,7 @@ export class SystemStatusCard extends AdminStatusCard<System> {
 
     getStatus(value: System): Promise<AdminStatus> {
         if (value.embeddedOutpostHost === "") {
-            this.header = t`Warning`;
+            this.statusSummary = t`Warning`;
             return Promise.resolve<AdminStatus>({
                 icon: "fa fa-exclamation-triangle pf-m-warning",
                 message: html`${t`Embedded outpost is not configured correctly.`}
@@ -58,7 +61,7 @@ export class SystemStatusCard extends AdminStatusCard<System> {
             });
         }
         if (!value.httpIsSecure && document.location.protocol === "https:") {
-            this.header = t`Warning`;
+            this.statusSummary = t`Warning`;
             return Promise.resolve<AdminStatus>({
                 icon: "fa fa-exclamation-triangle pf-m-warning",
                 message: html`${t`HTTPS is not detected correctly`}`,
@@ -66,13 +69,13 @@ export class SystemStatusCard extends AdminStatusCard<System> {
         }
         const timeDiff = value.serverTime.getTime() - (this.now || new Date()).getTime();
         if (timeDiff > 5000 || timeDiff < -5000) {
-            this.header = t`Warning`;
+            this.statusSummary = t`Warning`;
             return Promise.resolve<AdminStatus>({
                 icon: "fa fa-exclamation-triangle pf-m-warning",
                 message: html`${t`Server and client are further than 5 seconds apart.`}`,
             });
         }
-        this.header = t`OK`;
+        this.statusSummary = t`OK`;
         return Promise.resolve<AdminStatus>({
             icon: "fa fa-check-circle pf-m-success",
             message: html`${t`Everything is ok.`}`,
@@ -80,6 +83,6 @@ export class SystemStatusCard extends AdminStatusCard<System> {
     }
 
     renderValue(): TemplateResult {
-        return html`${this.header}`;
+        return html`${this.statusSummary}`;
     }
 }
diff --git a/web/src/admin/admin-overview/charts/LDAPSyncStatusChart.ts b/web/src/admin/admin-overview/charts/LDAPSyncStatusChart.ts
index ae5643181..c59d1aa01 100644
--- a/web/src/admin/admin-overview/charts/LDAPSyncStatusChart.ts
+++ b/web/src/admin/admin-overview/charts/LDAPSyncStatusChart.ts
@@ -67,9 +67,9 @@ export class LDAPSyncStatusChart extends AKChart<LDAPSyncStats> {
         );
         this.centerText = sources.pagination.count.toString();
         return {
-            healthy: sources.pagination.count === 0 ? 0 : metrics.healthy,
+            healthy: metrics.healthy,
             failed: metrics.failed,
-            unsynced: metrics.unsynced,
+            unsynced: sources.pagination.count === 0 ? 1 : metrics.unsynced,
         };
     }
 
diff --git a/web/src/admin/admin-overview/charts/OutpostStatusChart.ts b/web/src/admin/admin-overview/charts/OutpostStatusChart.ts
index 169565da1..77a2988d5 100644
--- a/web/src/admin/admin-overview/charts/OutpostStatusChart.ts
+++ b/web/src/admin/admin-overview/charts/OutpostStatusChart.ts
@@ -57,9 +57,9 @@ export class OutpostStatusChart extends AKChart<OutpostStats> {
         );
         this.centerText = outposts.pagination.count.toString();
         return {
-            healthy: outposts.pagination.count === 0 ? 0 : healthy,
-            outdated,
-            unhealthy,
+            healthy: healthy,
+            outdated: outdated,
+            unhealthy: outposts.pagination.count === 0 ? 1 : unhealthy,
         };
     }