            [:div.filter-control-input
             {:style {:margin-bottom 10}}
             [:select {:value @filter-type :on-change (fn [e]
-                                                         (reset! filter-type (.. e -target -value))
-                                                         (println (.. e -target -value)))}
-             [:option "contains"]
-             [:option "slower than"]]
+                                                         (reset! filter-type
+                                                                 (keyword (str/replace (.. e -target -value) " " "-"))))}
+             [:option :contains]
+             [:option :slower-than]]
             [search-input {:on-save save-query
                            :on-change #(reset! filter-input (.. % -target -value))}]
             [:button.button.icon-button {:on-click save-query
                                          :style {:margin 0}}
              [components/icon-add]]
-            ;; [:button {:style {:background "#aae0ec"
-            ;;                   :padding 7
-            ;;                   :margin 5}}
-            ;;  "-"]]
             [:br]]
            [:ul.filter-items
              (map (fn [item]

      (let [padding   {:padding "0px 5px 0px 5px"}
            row-style (merge padding {:border-top (case op-type :event "1px solid lightgrey" nil)})
            #_#__ (js/console.log (devtools/header-api-call tags))]

        (list [:tr {:key   id
                    :style {:color (case op-type
                                     :sub/create "green"

                               nil)}])))

(defn query->fn [query]
  (if (= :contains (:filter-type query))
    (fn [trace]
      (str/includes? (str/lower-case (str (:operation trace) " " (:op-type trace)))
                    (:query query)))
