feat: Add silence annotation to web UI#5017
Conversation
TheMeier
force-pushed
the
silence_annotation_ui
branch
from
d1dc089 to
8dc1b82
Compare
There was a problem hiding this comment.
Pull request overview
This PR adds support for displaying and managing silence annotations in the Alertmanager web UI. Annotations are optional key-value pairs that can be attached to silences for additional context. The implementation adds annotation input fields to the silence creation/edit form and displays annotations in both the silence detail view and silence list view.
Changes:
- Added annotation input field with validation in the silence form
- Added annotation display in silence detail and list views
- Implemented parsing and validation logic for annotation key-value pairs
Reviewed changes
Copilot reviewed 5 out of 6 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| ui/app/src/Views/SilenceView/Views.elm | Displays annotations in the silence detail view with inline matchers styling |
| ui/app/src/Views/SilenceList/SilenceView.elm | Displays annotations in the silence list view and adds "Matchers:" label for consistency |
| ui/app/src/Views/SilenceForm/Views.elm | Adds annotation input UI with add/delete buttons and validation feedback |
| ui/app/src/Views/SilenceForm/Updates.elm | Implements annotation add/delete/update logic and form validation |
| ui/app/src/Views/SilenceForm/Types.elm | Adds annotation data structures, parsing, and validation functions |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
TheMeier
force-pushed
the
silence_annotation_ui
branch
2 times, most recently
from
23de096 to
b44107a
Compare
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 7 out of 8 changed files in this pull request and generated 2 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Spaceman1701
left a comment
Spaceman1701
left a comment
There was a problem hiding this comment.
Not really a code review of the Elm, but I ran this patch locally and the UI seemed good to me.
It might be nice if the annotations box didn't let you add duplicate annotations, but otherwise it seems fine.
TheMeier
force-pushed
the
silence_annotation_ui
branch
from
b44107a to
f2d4326
Compare
Signed-off-by: Christoph Maser <christoph.maser+github@gmail.com>
TheMeier
force-pushed
the
silence_annotation_ui
branch
from
f2d4326 to
7419c99
Compare
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 7 out of 8 changed files in this pull request and generated 3 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| , formGroup "Matchers" <| | ||
| div [] <| | ||
| List.map (Utils.List.mstring >> Utils.Views.labelButton Nothing) silence.matchers | ||
| List.map | ||
| (\matcher -> | ||
| span | ||
| [ class "btn btn-sm btn-light border mr-2 mb-2" | ||
| , style "user-select" "text" | ||
| , style "-moz-user-select" "text" | ||
| , style "-webkit-user-select" "text" | ||
| ] | ||
| [ span [ class "text-muted" ] [ text (Utils.List.mstring matcher) ] ] | ||
| ) | ||
| silence.matchers |
There was a problem hiding this comment.
The matcher rendering here duplicates the styling/markup already provided by Utils.Views.labelButton Nothing (including the user-select styles and text-muted wrapper). Reusing the shared helper would reduce duplication and keep matcher pill styling consistent across the UI.
| formGroup "Annotations" <| | ||
| div [] <| | ||
| List.map | ||
| (\( k, v ) -> | ||
| span | ||
| [ class "btn btn-sm btn-light border mr-2 mb-2" | ||
| , style "user-select" "text" | ||
| , style "-moz-user-select" "text" | ||
| , style "-webkit-user-select" "text" | ||
| ] | ||
| [ span [ class "text-muted" ] [ text (k ++ "=" ++ v) ] ] | ||
| ) | ||
| (Dict.toList annotations) |
There was a problem hiding this comment.
Annotations are rendered with inline pill markup that duplicates Utils.Views.annotationButton (added in this PR and already used in the silence list). Consider using the shared helper here as well (e.g., mapping Utils.Views.annotationButton over Dict.toList annotations) to avoid drift between views.
| span | ||
| [ class "btn btn-sm btn-light border mr-2 mb-2" | ||
| , style "user-select" "text" | ||
| , style "-moz-user-select" "text" | ||
| , style "-webkit-user-select" "text" | ||
| ] | ||
| [ span [ class "text-muted" ] [ text (key ++ "=" ++ value) ] ] |
There was a problem hiding this comment.
annotationButton duplicates the exact attributes/markup of labelButton Nothing with only the label text differing. To reduce maintenance overhead, consider implementing annotationButton in terms of labelButton Nothing (or extracting the common pill attributes into a single helper) so styling changes don't need to be updated in multiple places.
| span | |
| [ class "btn btn-sm btn-light border mr-2 mb-2" | |
| , style "user-select" "text" | |
| , style "-moz-user-select" "text" | |
| , style "-webkit-user-select" "text" | |
| ] | |
| [ span [ class "text-muted" ] [ text (key ++ "=" ++ value) ] ] | |
| labelButton Nothing (key ++ "=" ++ value) |
Pull Request Checklist
Please check all the applicable boxes.
benchstatto compare benchmarksWhich user-facing changes does this PR introduce?