diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Silence/index.js b/ui/src/Components/Grid/AlertGrid/AlertGroup/Silence/index.js
index af6273daf..8cb510938 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Silence/index.js
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Silence/index.js
@@ -190,8 +190,8 @@ const Silence = inject("alertStore")(
getAlertmanager = () => {
const { alertStore, alertmanagerState } = this.props;
- const alertmanager = alertStore.data.upstreams.instances.find(
- am => am.name === alertmanagerState.name
+ const alertmanager = alertStore.data.getAlertmanagerByName(
+ alertmanagerState.name
);
if (alertmanager) return alertmanager;
diff --git a/ui/src/Components/SilenceModal/SilenceModalContent.js b/ui/src/Components/SilenceModal/SilenceModalContent.js
index a975870ff..ff83d4493 100644
--- a/ui/src/Components/SilenceModal/SilenceModalContent.js
+++ b/ui/src/Components/SilenceModal/SilenceModalContent.js
@@ -47,6 +47,7 @@ const SilenceModalContent = observer(
{silenceFormStore.data.inProgress ? (
) : (
diff --git a/ui/src/Components/SilenceModal/SilenceSubmitController.js b/ui/src/Components/SilenceModal/SilenceSubmitController.js
index 93149add9..7a2de3f5c 100644
--- a/ui/src/Components/SilenceModal/SilenceSubmitController.js
+++ b/ui/src/Components/SilenceModal/SilenceSubmitController.js
@@ -8,11 +8,12 @@ import { SilenceSubmitProgress } from "./SilenceSubmitProgress";
class SilenceSubmitController extends Component {
static propTypes = {
+ alertStore: PropTypes.object.isRequired,
silenceFormStore: PropTypes.object.isRequired
};
render() {
- const { silenceFormStore } = this.props;
+ const { silenceFormStore, alertStore } = this.props;
return (
@@ -23,6 +24,7 @@ class SilenceSubmitController extends Component {
name={am.label}
uri={am.value}
payload={silenceFormStore.data.toAlertmanagerPayload}
+ alertStore={alertStore}
/>
))}
diff --git a/ui/src/Components/SilenceModal/SilenceSubmitController.test.js b/ui/src/Components/SilenceModal/SilenceSubmitController.test.js
index c8be7db3f..facc04ffc 100644
--- a/ui/src/Components/SilenceModal/SilenceSubmitController.test.js
+++ b/ui/src/Components/SilenceModal/SilenceSubmitController.test.js
@@ -2,21 +2,27 @@ import React from "react";
import { shallow } from "enzyme";
+import { AlertStore } from "Stores/AlertStore";
import {
SilenceFormStore,
MatcherValueToObject
} from "Stores/SilenceFormStore";
import { SilenceSubmitController } from "./SilenceSubmitController";
+let alertStore;
let silenceFormStore;
beforeEach(() => {
+ alertStore = new AlertStore([]);
silenceFormStore = new SilenceFormStore();
});
const ShallowSilenceSubmitController = () => {
return shallow(
-
+
);
};
diff --git a/ui/src/Components/SilenceModal/SilenceSubmitProgress.js b/ui/src/Components/SilenceModal/SilenceSubmitProgress.js
index a19fd2fa3..103f3a32e 100644
--- a/ui/src/Components/SilenceModal/SilenceSubmitProgress.js
+++ b/ui/src/Components/SilenceModal/SilenceSubmitProgress.js
@@ -46,7 +46,8 @@ const SilenceSubmitProgress = observer(
static propTypes = {
name: PropTypes.string.isRequired,
uri: PropTypes.string.isRequired,
- payload: PropTypes.object.isRequired
+ payload: PropTypes.object.isRequired,
+ alertStore: PropTypes.object.isRequired
};
submitState = observable(
@@ -83,13 +84,22 @@ const SilenceSubmitProgress = observer(
};
parseAlertmanagerResponse = response => {
- const { uri } = this.props;
+ const { name, alertStore } = this.props;
+
+ const alertmanager = alertStore.data.getAlertmanagerByName(name);
if (response.status === "success") {
- const link = (
-
- );
- this.submitState.markDone(link);
+ if (alertmanager) {
+ const link = (
+
+ );
+ this.submitState.markDone(link);
+ } else {
+ this.submitState.markDone(response.data.silenceId);
+ }
} else if (response.status === "error") {
this.submitState.markFailed(response.error);
} else {
diff --git a/ui/src/Components/SilenceModal/SilenceSubmitProgress.test.js b/ui/src/Components/SilenceModal/SilenceSubmitProgress.test.js
index eb64be239..355e1e159 100644
--- a/ui/src/Components/SilenceModal/SilenceSubmitProgress.test.js
+++ b/ui/src/Components/SilenceModal/SilenceSubmitProgress.test.js
@@ -2,14 +2,34 @@ import React from "react";
import { mount } from "enzyme";
+import toDiffableHtml from "diffable-html";
+
+import { AlertStore } from "Stores/AlertStore";
import { SilenceSubmitProgress } from "./SilenceSubmitProgress";
+let alertStore;
+
+beforeEach(() => {
+ alertStore = new AlertStore([]);
+ alertStore.data.upstreams = {
+ instances: [
+ {
+ name: "mockAlertmanager",
+ uri: "file:///mock",
+ publicURI: "http://example.com",
+ error: ""
+ }
+ ]
+ };
+});
+
const MountedSilenceSubmitProgress = () => {
return mount(
);
};
@@ -49,6 +69,21 @@ describe("", () => {
expect(silenceLink.text()).toBe("123456789");
});
+ it("renders returned silence ID as text if alertmanager is not found in AlertStore", async () => {
+ fetch.mockResponseOnce(
+ JSON.stringify({ status: "success", data: { silenceId: "123456789" } })
+ );
+ alertStore.data.upstreams.instances = [];
+ const tree = MountedSilenceSubmitProgress();
+ await expect(tree.instance().submitState.fetch).resolves.toBe("success");
+ // force re-render
+ tree.update();
+ const silenceLink = tree.find("a");
+ expect(silenceLink).toHaveLength(0);
+ const idDiv = tree.find("div.flex-fill").at(2);
+ expect(toDiffableHtml(idDiv.html())).toMatchSnapshot();
+ });
+
it("renders returned error message on failed fetch", async () => {
fetch.mockRejectOnce(new Error("mock error message"));
const tree = MountedSilenceSubmitProgress();
diff --git a/ui/src/Components/SilenceModal/__snapshots__/SilenceSubmitProgress.test.js.snap b/ui/src/Components/SilenceModal/__snapshots__/SilenceSubmitProgress.test.js.snap
new file mode 100644
index 000000000..23a21fae0
--- /dev/null
+++ b/ui/src/Components/SilenceModal/__snapshots__/SilenceSubmitProgress.test.js.snap
@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[` renders returned silence ID as text if alertmanager is not found in AlertStore 1`] = `
+"
+
+ 123456789
+
+"
+`;
diff --git a/ui/src/Stores/AlertStore.js b/ui/src/Stores/AlertStore.js
index 1380ff992..3bb9362e8 100644
--- a/ui/src/Stores/AlertStore.js
+++ b/ui/src/Stores/AlertStore.js
@@ -134,9 +134,12 @@ class AlertStore {
counters: {},
groups: {},
silences: {},
- upstreams: { instances: [] }
+ upstreams: { instances: [] },
+ getAlertmanagerByName(name) {
+ return this.upstreams.instances.find(am => am.name === name);
+ }
},
- {},
+ { getAlertmanagerByName: action },
{ name: "API Response data" }
);