diff --git a/CHANGELOG.md b/CHANGELOG.md index a425a1740..30df994ae 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ ### Changed - Don't render `@cluster` labels if there's only one cluster configured #3994. +- Show `!` on favicon badge if there's any alertmanager upstream with errors #3987. ## v0.98 diff --git a/ui/src/Components/FaviconBadge/index.test.tsx b/ui/src/Components/FaviconBadge/index.test.tsx index e417ad8bd..59f9b229d 100644 --- a/ui/src/Components/FaviconBadge/index.test.tsx +++ b/ui/src/Components/FaviconBadge/index.test.tsx @@ -41,4 +41,27 @@ describe("", () => { expect(Favico.badge).toHaveBeenCalledTimes(1); expect(Favico.badge).toHaveBeenCalledWith("?"); }); + + it("badge is ! when there are alertmanager upstreams with errors", () => { + alertStore.data.setUpstreams({ + counters: { total: 1, healthy: 1, failed: 0 }, + clusters: { default: ["default"] }, + instances: [ + { + name: "default", + uri: "http://localhost", + publicURI: "http://example.com", + readonly: false, + headers: { foo: "bar" }, + corsCredentials: "include", + error: 'Healthcheck filter "DeadMansSwitch" didn\'t match any alerts', + version: "0.21.0", + cluster: "default", + clusterMembers: ["default"], + }, + ], + }); + MountedFaviconBadge(); + expect(Favico.badge).toHaveBeenCalledWith("!"); + }); }); diff --git a/ui/src/Components/FaviconBadge/index.tsx b/ui/src/Components/FaviconBadge/index.tsx index fe80d9633..ca27eae4e 100644 --- a/ui/src/Components/FaviconBadge/index.tsx +++ b/ui/src/Components/FaviconBadge/index.tsx @@ -22,7 +22,11 @@ const FaviconBadge: FC<{ () => autorun(() => { favico.badge( - alertStore.status.error === null ? alertStore.info.totalAlerts : "?" + alertStore.data.upstreamsWithErrors.length > 0 + ? "!" + : alertStore.status.error === null + ? alertStore.info.totalAlerts + : "?" ); }), [] // eslint-disable-line react-hooks/exhaustive-deps