From d1e396078e55bbcafb9c5aedd9f046892a56fd9e Mon Sep 17 00:00:00 2001 From: Arturo Reuschenbach Date: Wed, 11 Dec 2024 14:05:52 +0100 Subject: [PATCH] chore(supernova): add `embedded` property to README and fix typos (#677) * chore(supernova): adds embedded prop to the readme and some typos * chore(heureka): removes prop from the template since it points to a default value --- apps/heureka/appProps.template.json | 3 +- apps/supernova/README.md | 86 ++++++++++++------- .../src/components/silences/SilenceNew.jsx | 2 +- 3 files changed, 59 insertions(+), 32 deletions(-) diff --git a/apps/heureka/appProps.template.json b/apps/heureka/appProps.template.json index 32ff2faf3..e3607fb53 100644 --- a/apps/heureka/appProps.template.json +++ b/apps/heureka/appProps.template.json @@ -1,5 +1,4 @@ { "theme": "theme-dark", - "apiEndpoint": "https://api.example.com/v1", - "embedded": false + "apiEndpoint": "https://api.example.com/v1" } diff --git a/apps/supernova/README.md b/apps/supernova/README.md index 5966d5646..29ac905e0 100644 --- a/apps/supernova/README.md +++ b/apps/supernova/README.md @@ -172,7 +172,7 @@ To set the endpoint: - Configured via app prop `endpoint`, which is used during the setup of the script tag. -Example: +Example value: ```json "https://myalertmanager.com/api/v2" @@ -196,21 +196,25 @@ Example value: InitialFilters are the filters that are applied when the app is loaded. The filters must be an object where the key is the label and the value are the values to filter on. -Example: +To set the inital Filters: + +- Configured via app prop `initialFilters` + +Example value: ```json { "cluster": ["prod-1", "prod-2"], "status": ["critical"] } ``` -To set the inital Filters: - -- Configured via app prop `initialFilters` - ### Predefined Filters (**optional**) PredefinedFilters are groups of filters comprised of a list of filter labels and a regex that is used to filter on the values of that label. They can be thought of as filter categories where the filter logic can be more complex than simple label+values pairs. Predefined filters are defined as an array of objects, where each object is a predefined filter which contains the display name for the UI as well as a list of filter label + value regex pairs which are AND concatenated when they are being evaluated. -Example: +To set the predefined Filter: + +- Configured via app prop `predefinedFilters` + +Example value: ```json [ @@ -224,10 +228,6 @@ Example: ] ``` -To set the predefined Filter: - -- Configured via app prop `predefinedFilters` - ### Silence excluded alert labels (**optional**) Excluded labels are a collection of labels that are automatically excluded by default when configuring silence matchers. These labels, such as `pod`, `pod_name` or `instance`, often undergo frequent value changes, causing new alerts to be triggered that are not covered by the existing silence. @@ -262,7 +262,7 @@ To set the excluded alert labels: - Configured via app prop `silenceExcludedLabels` -Example: +Example value: ```json ["pod", "pod_name", "instance"] @@ -272,26 +272,24 @@ Example: Defines pre-configured silences available in the schedule silence modal for scheduling future silences. For example when setting up maintenance windows where it is known that certain alerts will fire. The format consists of a list of objects including description, editable_labels (array of strings specifying the labels that users can modify), fixed_labels (map containing fixed labels and their corresponding values), status, and title. -Example: - -```json -"silenceTemplates": [ - { - "description": "Description of the silence template", - "editable_labels": ["region"], - "fixed_labels": { - "name": "Marvin", - }, - "status": "active", - "title": "Silence" - } - ] -``` - To set the silence templates: - Configured via app prop `silenceTemplates`, which is used during the setup of the script tag. +Example value: + +```json +{ + "description": "Description of the silence template", + "editable_labels": ["region"], + "fixed_labels": { + "name": "Marvin" + }, + "status": "active", + "title": "Silence" +} +``` + ### Theme (**optional**) Set this attribute to specify a custom theme for your application. Possible values are `"theme-light"` or `"theme-dark"` (default) @@ -300,6 +298,36 @@ To set the theme: - Configured via app prop `theme` +Example value: + +```json +"theme-dark" +``` + ### Username (**optional**) -Username used for forms and API requests +Default username for setting silences. If not provided, the field will remain empty, requiring the user to enter the username manually. + +To set the username: + +- Configured via app prop `username` + +Example value: + +```json +"John Doe" +``` + +### Embedded (**optional**) + +Set to `true` if the app will be embedded within another app or page. When `true`, the app will not display the header or footer, rendering only the content. Default is `false`. + +To set the embedded mode: + +- Configured via app prop `embedded` + +Example value: + +```json +false +``` diff --git a/apps/supernova/src/components/silences/SilenceNew.jsx b/apps/supernova/src/components/silences/SilenceNew.jsx index 1764e54ae..673ad729a 100644 --- a/apps/supernova/src/components/silences/SilenceNew.jsx +++ b/apps/supernova/src/components/silences/SilenceNew.jsx @@ -83,7 +83,7 @@ const SilenceNew = ({ alert, size, variant }) => { setFormState({ ...formState, ...DEFAULT_FORM_VALUES, - createdBy: user || "", // empty sting to prevent undefined for TextInput + createdBy: user || "", // empty string to prevent undefined for TextInput matchers: setupMatchers(alert?.labels, excludedLabels, enrichedLabels), })