Delete matchers on silence creation form

src/Main.elm

@@ -81,6 +81,16 @@ update msg model =
         RedirectAlerts ->
             ( { model | route = AlertGroupsRoute }, Navigation.newUrl "/#/alerts" )
 
+        DeleteMatcher matcher ->
+            let
+                s =
+                    model.silence
+
+                newSil =
+                    { s | matchers = (List.filter (\x -> x /= matcher) s.matchers) }
+            in
+                ( { model | silence = newSil }, Cmd.none )
+
 
 urlUpdate : Navigation.Location -> Msg
 urlUpdate location =

src/Silences/Views.elm

@@ -4,11 +4,12 @@ module Silences.Views exposing (..)
 
 import Html exposing (..)
 import Html.Attributes exposing (..)
+import Html.Events exposing (onClick)
 
 
 -- Internal Imports
 
-import Types exposing (Silence)
+import Types exposing (Silence, Matcher, Msg(DeleteMatcher))
 import Utils.Views exposing (..)
 
 
@@ -37,3 +38,64 @@ silenceView silence =
 objectData : String -> Html msg
 objectData data =
     dt [ class "m10 black w-100" ] [ text data ]
+
+
+
+-- Start
+-- End
+-- Matchers (Name, Value, Regexp) and add additional
+-- Creator
+-- Comment
+-- Create
+
+
+silenceFormView : String -> Silence -> Html Msg
+silenceFormView kind silence =
+    let
+        base =
+            "/#/silences/"
+
+        url =
+            case kind of
+                "New" ->
+                    base ++ "new"
+
+                "Edit" ->
+                    base ++ (toString silence.id) ++ "/edit"
+
+                _ ->
+                    "/#/silences"
+    in
+        div [ class "pa4 black-80" ]
+            [ fieldset [ class "ba b--transparent ph0 mh0" ]
+                [ legend [ class "ph0 mh0 fw6" ] [ text <| kind ++ " Silence" ]
+                , formField "Start" silence.startsAt
+                  -- , dateTimePicker "Start"
+                , formField "End" silence.endsAt
+                , div [ class "mt3" ]
+                    [ label [ class "f6 b db mb2" ]
+                        [ text "Matchers "
+                        , span [ class "normal black-60" ] [ text "Alerts affected by this silence." ]
+                        ]
+                    , label [ class "f6 dib mb2 mr2 w-40" ] [ text "Name" ]
+                    , label [ class "f6 dib mb2 mr2 w-40" ] [ text "Value" ]
+                    ]
+                , div [] <| List.map matcherForm silence.matchers
+                , formField "Creator" silence.createdBy
+                , textField "Comment" silence.comment
+                , div [ class "mt3" ]
+                    [ a [ class "f6 link br2 ba ph3 pv2 mr2 dib dark-blue", href "#" ] [ text "Create" ]
+                    , a [ class "f6 link br2 ba ph3 pv2 mb2 dib dark-red", href url ] [ text "Reset" ]
+                    ]
+                ]
+            ]
+
+
+matcherForm : Matcher -> Html Msg
+matcherForm matcher =
+    div []
+        [ input [ class "input-reset ba br1 b--black-20 pa2 mb2 mr2 dib w-40", value matcher.name ] []
+        , input [ class "input-reset ba br1 b--black-20 pa2 mb2 mr2 dib w-40", value matcher.value ] []
+        , checkbox "Regex" matcher.isRegex
+        , a [ class <| "f6 link br1 ba mr1 mb2 dib ph1 pv1", onClick (DeleteMatcher matcher) ] [ text "X" ]
+        ]

src/Types.elm

@@ -73,6 +73,7 @@ type Msg
     | AlertGroupsFetch (Result Http.Error (List AlertGroup))
     | FetchAlertGroups
     | RedirectAlerts
+    | DeleteMatcher Matcher
 
 
 type Route

src/Utils/Views.elm

@@ -18,3 +18,27 @@ listButton : String -> ( String, String ) -> Html msg
 listButton classString ( key, value ) =
     a [ class <| "f6 link br1 ba mr1 mb2 dib " ++ classString ]
         [ text <| String.join "=" [ key, value ] ]
+
+
+checkbox : String -> Bool -> Html msg
+checkbox name status =
+    label [ class "f6 dib mb2" ]
+        [ input [ type_ "checkbox", checked status ] []
+        , text <| " " ++ name
+        ]
+
+
+formField : String -> String -> Html msg
+formField labelText content =
+    div [ class "mt3" ]
+        [ label [ class "f6 b db mb2" ] [ text labelText ]
+        , input [ class "input-reset ba br1 b--black-20 pa2 mb2 db w-100", value content ] []
+        ]
+
+
+textField : String -> String -> Html msg
+textField labelText content =
+    div [ class "mt3" ]
+        [ label [ class "f6 b db mb2" ] [ text labelText ]
+        , textarea [ class "db border-box hover-black w-100 ba b--black-20 pa2 br1 mb2", value content ] []
+        ]

src/Views.elm

@@ -23,10 +23,10 @@ view model =
             genericListView alertGroupsView model.alertGroups
 
         NewSilenceRoute ->
-            silenceFormView "New" model.silence
+            Silences.Views.silenceFormView "New" model.silence
 
         EditSilenceRoute id ->
-            silenceFormView "Edit" model.silence
+            Silences.Views.silenceFormView "Edit" model.silence
 
         SilencesRoute ->
             genericListView silenceListView model.silences
@@ -45,70 +45,6 @@ todoView model =
         ]
 
 
-
--- Start
--- End
--- Matchers (Name, Value, Regexp) and add additional
--- Creator
--- Comment
--- Create
-
-
-silenceFormView : String -> Silence -> Html Msg
-silenceFormView kind silence =
-    div [ class "pa4 black-80" ]
-        [ fieldset [ class "ba b--transparent ph0 mh0" ]
-            [ legend [ class "ph0 mh0 fw6" ] [ text <| kind ++ " Silence" ]
-            , formField "Start" silence.startsAt
-            -- , dateTimePicker "Start"
-            , formField "End" silence.endsAt
-            , div [ class "mt3" ]
-                [ label [ class "f6 b db mb2" ] [ text "Matchers "
-                , span [class "normal black-60"] [ text "Alerts affected by this silence." ]
-                ]
-                , label [ class "f6 dib mb2 mr2 w-40" ] [ text "Name" ]
-                , label [ class "f6 dib mb2 mr2 w-40" ] [ text "Value" ]
-                , matcherForm <| Matcher "device" "/dev/xda1" True
-                ]
-            , formField "Creator" silence.createdBy
-            , textField "Comment" silence.comment
-            , div [ class "mt3" ]
-                [ a [ class "f6 link br2 ba ph3 pv2 mr2 dib dark-blue", href "#0"] [ text "Create" ]
-                , a [ class "f6 link br2 ba ph3 pv2 mb2 dib dark-red", href "#0"] [ text "Reset" ]
-                ]
-            ]
-        ]
-
-
-matcherForm : Matcher -> Html msg
-matcherForm matcher =
-    div [] [ input [ class "input-reset ba br1 b--black-20 pa2 mb2 mr2 dib w-40", value matcher.name ] []
-    , input [ class "input-reset ba br1 b--black-20 pa2 mb2 mr2 dib w-40", value matcher.value ] []
-    , checkbox "Regex" matcher.isRegex
-    ]
-
-
-checkbox : String -> Bool -> Html msg
-checkbox name status =
-    label [ class "f6 dib mb2" ]
-        [ input [ type_ "checkbox", checked status ] []
-        , text <| " " ++ name
-        ]
-
-formField : String -> String -> Html msg
-formField labelText content =
-    div [ class "mt3" ]
-        [ label [ class "f6 b db mb2" ] [ text labelText ]
-        , input [ class "input-reset ba br1 b--black-20 pa2 mb2 db w-100", value content ] []
-        ]
-
-textField : String -> String -> Html msg
-textField labelText content =
-    div [ class "mt3" ]
-        [ label [ class "f6 b db mb2" ] [ text labelText ]
-        , textarea [ class "db border-box hover-black w-100 ba b--black-20 pa2 br1 mb2", value content ] []
-        ]
-
 alertGroupsView : AlertGroup -> Html Msg
 alertGroupsView alertGroup =
     li [ class "pa3 pa4-ns bb b--black-10" ]