diff --git a/ui/src/Components/SilenceModal/AlertManagerInput/index.js b/ui/src/Components/SilenceModal/AlertManagerInput/index.js index 08adab106..a567b7359 100644 --- a/ui/src/Components/SilenceModal/AlertManagerInput/index.js +++ b/ui/src/Components/SilenceModal/AlertManagerInput/index.js @@ -7,16 +7,13 @@ import { observer } from "mobx-react"; import ReactSelect from "react-select"; import { AlertStore } from "Stores/AlertStore"; -import { SilenceFormStore } from "Stores/SilenceFormStore"; +import { + SilenceFormStore, + AlertmanagerClustersToOption +} from "Stores/SilenceFormStore"; import { MultiSelect, ReactSelectStyles } from "Components/MultiSelect"; import { ValidationError } from "Components/MultiSelect/ValidationError"; -const AlertmanagerClustersToOption = clusterDict => - Object.entries(clusterDict).map(([clusterID, clusterMembers]) => ({ - label: clusterMembers.join(" | "), - value: clusterMembers - })); - const AlertManagerInput = observer( class AlertManagerInput extends MultiSelect { static propTypes = { diff --git a/ui/src/Stores/SilenceFormStore.js b/ui/src/Stores/SilenceFormStore.js index 76ca3a5ed..5bb676945 100644 --- a/ui/src/Stores/SilenceFormStore.js +++ b/ui/src/Stores/SilenceFormStore.js @@ -19,6 +19,12 @@ const NewEmptyMatcher = () => { const MatcherValueToObject = value => ({ label: value, value: value }); +const AlertmanagerClustersToOption = clusterDict => + Object.entries(clusterDict).map(([clusterID, clusterMembers]) => ({ + label: clusterMembers.join(" | "), + value: clusterMembers + })); + const SilenceFormStage = Object.freeze({ UserInput: "form", Preview: "preview", @@ -155,12 +161,10 @@ class SilenceFormStore { fillFormFromSilence(alertmanager, silence) { this.silenceID = silence.id; - this.alertmanagers = [ - { - label: alertmanager.name, - value: alertmanager.publicURI - } - ]; + + this.alertmanagers = AlertmanagerClustersToOption({ + [alertmanager.cluster]: alertmanager.clusterMembers + }); const matchers = []; for (const m of silence.matchers) { @@ -214,8 +218,8 @@ class SilenceFormStore { m.values.length > 1 ? `(${m.values.map(v => v.value).join("|")})` : m.values.length === 1 - ? m.values[0].value - : "", + ? m.values[0].value + : "", isRegex: m.isRegex })), startsAt: this.startsAt @@ -270,5 +274,6 @@ export { SilenceFormStore, SilenceFormStage, NewEmptyMatcher, - MatcherValueToObject + MatcherValueToObject, + AlertmanagerClustersToOption };