diff --git a/ui/src/Components/NavBar/index.js b/ui/src/Components/NavBar/index.js index 92e617587..69de2783c 100644 --- a/ui/src/Components/NavBar/index.js +++ b/ui/src/Components/NavBar/index.js @@ -50,6 +50,7 @@ const NavBar = observer( { @@ -98,10 +104,12 @@ const SilenceForm = observer( }); handleSubmit = action(event => { - const { silenceFormStore } = this.props; + const { silenceFormStore, settingsStore } = this.props; event.preventDefault(); + settingsStore.silenceFormConfig.saveAuthor(silenceFormStore.data.author); + if (silenceFormStore.data.isValid) silenceFormStore.data.inProgress = true; diff --git a/ui/src/Components/SilenceModal/SilenceForm.test.js b/ui/src/Components/SilenceModal/SilenceForm.test.js index 538c30756..20d52490f 100644 --- a/ui/src/Components/SilenceModal/SilenceForm.test.js +++ b/ui/src/Components/SilenceModal/SilenceForm.test.js @@ -3,26 +3,37 @@ import React from "react"; import { mount, shallow } from "enzyme"; import { AlertStore } from "Stores/AlertStore"; +import { Settings } from "Stores/Settings"; import { SilenceFormStore, NewEmptyMatcher } from "Stores/SilenceFormStore"; import { SilenceForm } from "./SilenceForm"; let alertStore; +let settingsStore; let silenceFormStore; beforeEach(() => { alertStore = new AlertStore([]); + settingsStore = new Settings(); silenceFormStore = new SilenceFormStore(); }); const ShallowSilenceForm = () => { return shallow( - + ); }; const MountedSilenceForm = () => { return mount( - + ); }; @@ -105,6 +116,22 @@ describe(" preview", () => { }); describe(" inputs", () => { + it("default author value comes from Settings store", () => { + settingsStore.silenceFormConfig.config.author = "foo@example.com"; + const tree = MountedSilenceForm(); + const input = tree.find("input[placeholder='Author email']"); + expect(input.props().value).toBe("foo@example.com"); + expect(silenceFormStore.data.author).toBe("foo@example.com"); + }); + + it("default author value is empty if nothing is stored in Settings", () => { + settingsStore.silenceFormConfig.config.author = ""; + const tree = MountedSilenceForm(); + const input = tree.find("input[placeholder='Author email']"); + expect(input.text()).toBe(""); + expect(silenceFormStore.data.author).toBe(""); + }); + it("changing author input updates SilenceFormStore", () => { const tree = MountedSilenceForm(); const input = tree.find("input[placeholder='Author email']"); @@ -141,4 +168,13 @@ describe("", () => { tree.simulate("submit", { preventDefault: jest.fn() }); expect(silenceFormStore.data.inProgress).toBe(true); }); + + it("calling submit saves author value to the Settings store", () => { + silenceFormStore.data.author = "user@example.com"; + const tree = ShallowSilenceForm(); + tree.simulate("submit", { preventDefault: jest.fn() }); + expect(settingsStore.silenceFormConfig.config.author).toBe( + "user@example.com" + ); + }); }); diff --git a/ui/src/Components/SilenceModal/SilenceModalContent.js b/ui/src/Components/SilenceModal/SilenceModalContent.js index 7ed94b95b..038307d90 100644 --- a/ui/src/Components/SilenceModal/SilenceModalContent.js +++ b/ui/src/Components/SilenceModal/SilenceModalContent.js @@ -13,7 +13,8 @@ const SilenceModalContent = observer( class SilenceModalContent extends Component { static propTypes = { alertStore: PropTypes.object.isRequired, - silenceFormStore: PropTypes.object.isRequired + silenceFormStore: PropTypes.object.isRequired, + settingsStore: PropTypes.object.isRequired }; componentDidMount() { @@ -25,7 +26,7 @@ const SilenceModalContent = observer( } render() { - const { alertStore, silenceFormStore } = this.props; + const { alertStore, silenceFormStore, settingsStore } = this.props; return ReactDOM.createPortal(
@@ -50,6 +51,7 @@ const SilenceModalContent = observer( )}
diff --git a/ui/src/Components/SilenceModal/SilenceModalContent.test.js b/ui/src/Components/SilenceModal/SilenceModalContent.test.js index 5d570f8fe..ea8314f3a 100644 --- a/ui/src/Components/SilenceModal/SilenceModalContent.test.js +++ b/ui/src/Components/SilenceModal/SilenceModalContent.test.js @@ -3,14 +3,17 @@ import React from "react"; import { shallow } from "enzyme"; import { AlertStore } from "Stores/AlertStore"; +import { Settings } from "Stores/Settings"; import { SilenceFormStore } from "Stores/SilenceFormStore"; import { SilenceModalContent } from "./SilenceModalContent"; let alertStore; +let settingsStore; let silenceFormStore; beforeEach(() => { alertStore = new AlertStore([]); + settingsStore = new Settings(); silenceFormStore = new SilenceFormStore(); }); @@ -18,6 +21,7 @@ const ShallowSilenceModalContent = () => { return shallow( ); diff --git a/ui/src/Components/SilenceModal/index.js b/ui/src/Components/SilenceModal/index.js index 134840dce..77c24c20b 100644 --- a/ui/src/Components/SilenceModal/index.js +++ b/ui/src/Components/SilenceModal/index.js @@ -14,7 +14,8 @@ const SilenceModal = observer( class SilenceModal extends Component { static propTypes = { alertStore: PropTypes.object.isRequired, - silenceFormStore: PropTypes.object.isRequired + silenceFormStore: PropTypes.object.isRequired, + settingsStore: PropTypes.object.isRequired }; componentDidUpdate() { @@ -31,7 +32,7 @@ const SilenceModal = observer( } render() { - const { alertStore, silenceFormStore } = this.props; + const { alertStore, silenceFormStore, settingsStore } = this.props; return ( @@ -47,6 +48,7 @@ const SilenceModal = observer( ) : null} diff --git a/ui/src/Components/SilenceModal/index.test.js b/ui/src/Components/SilenceModal/index.test.js index 272925fa9..6ccaebbb9 100644 --- a/ui/src/Components/SilenceModal/index.test.js +++ b/ui/src/Components/SilenceModal/index.test.js @@ -3,26 +3,37 @@ import React from "react"; import { shallow, mount } from "enzyme"; import { AlertStore } from "Stores/AlertStore"; +import { Settings } from "Stores/Settings"; import { SilenceFormStore } from "Stores/SilenceFormStore"; import { SilenceModal } from "."; let alertStore; +let settingsStore; let silenceFormStore; beforeEach(() => { alertStore = new AlertStore([]); + settingsStore = new Settings(); silenceFormStore = new SilenceFormStore(); }); const ShallowSilenceModal = () => { return shallow( - + ); }; const MountedSilenceModal = () => { return mount( - + ); }; diff --git a/ui/src/Stores/Settings.js b/ui/src/Stores/Settings.js index c838533f3..66456ce48 100644 --- a/ui/src/Stores/Settings.js +++ b/ui/src/Stores/Settings.js @@ -46,11 +46,20 @@ class AlertGroupConfig { }); } +class SilenceFormConfig { + config = localStored("silenceFormConfig", { author: "" }, { delay: 100 }); + + saveAuthor = action(newAuthor => { + this.config.author = newAuthor; + }); +} + class Settings { constructor() { this.savedFilters = new SavedFilters(); this.fetchConfig = new FetchConfig(); this.alertGroupConfig = new AlertGroupConfig(); + this.silenceFormConfig = new SilenceFormConfig(); } }