   [event]
   (-> event .-target .-value))
 
-
-(defn edit-tea-form
-  [tea edit?]
-  (let [edit-tea (reagent/atom (:name tea))]
-    (fn [tea]
-      [:form.pull-left {:type "text"
-                        :value @edit-tea
-                        :on-change #(reset! edit-tea (value-event %))}]
-      [:button.btn.btn-success.pull-right {:on-click (fn [e]
-                                                      (re-frame/dispatch
-                                                        [:replace-tea tea @edit-tea])
-                                                      (swap! edit? not))}
-       "Finalize"])))
-
 (defn tea-edit-toggler
   [tea]
-  (let [edit? (reagent/atom false)]
+  (let [edit? (reagent/atom false)
+        tmp-edit (reagent/atom (:name tea))]
     (fn [tea]
       (if @edit?
         [:tr
-          [:td.pull-right [edit-tea-form tea edit?]]]
+          [:td
+            [:input.form-control {:type "text"
+                                  :value @tmp-edit
+                                  :on-change #(reset! tmp-edit (value-event %))}]
+            [:button.btn.btn-success.pull-right
+              {:on-click (fn [e]
+                          (re-frame/dispatch
+                            [:replace-tea tea @tmp-edit])
+                          (swap! edit? not))}
+              "Finalize"]]]
         [:tr
           [:td.pull-left {:on-click #(swap! edit? not)} (:name tea)]]))))
 

  (fn [app-db [_ id]]
    (ajax/GET (str "/api/teas/" id "/delete")
              :error-handler (fn [response] (println "DELETE-TEA ERROR" response))
              :handler (fn [response] (println name " deleted") (re-frame/dispatch [:load-teas])(reset! edit-tea-snap nil)))))


(re-frame/register-handler

  []
  (fn []
    [:div.form-group
     [:div.row [:div.col-md-12]
       [:button.btn.btn-info {:on-click (fn [_] (swap! show-edit not))} "Show/Hide edit form"]
       [:div.p (str "Preview: " (or @edit-tea-snap "*no tea selected*") " -> " (or @edit-tea "*no tea selected*"))]
       [:div.p]
       [:form {:style {:visibility (if @show-edit
                                     "visible"
                                     "hidden")}}
        [:input.form-control {:field :text :id :change-tea :value @edit-tea :on-change sync-edit-tea
        ; [:input.btn.btn-info {:type "submit" :value "Update Tea Name" :on-click #((update-tea @edit-tea-id @edit-tea)
                                                                                  (reset! edit-tea nil)
                                                                                  (reset! edit-tea-snap nil)}]]
       [:input.btn.btn-danger {:type "button" :value (str "Delete " @edit-tea-snap) :on-click #(delete-tea @edit-tea)}]]]))

;; tea-edit can be re-written so that it will look like the tea is being
;; modified in place on the DOM -- as a sort of preview -- then once the
