ux improvements for erros.

src/cljs/auto_ap/views/utils.cljs

@@ -1,11 +1,25 @@
 (ns auto-ap.views.utils
   (:require [re-frame.core :as re-frame]
+            [cljsjs.react-transition-group]
+            [reagent.core :as reagent]
             [clojure.spec.alpha :as s]
             [cljs-time.coerce :as c]
             [cljs-time.core :as time]
             [auto-ap.events :as events]
             [auto-ap.subs :as subs]
-            [cljs-time.format :as format]))
+            [cljs-time.format :as format]
+            [goog.i18n.NumberFormat.Format])
+  (:import
+   (goog.i18n NumberFormat)
+   (goog.i18n.NumberFormat Format)))
+(def nff
+  (NumberFormat. Format/CURRENCY))
+
+(defn- nf
+  [num]
+  (.format nff (str num)))
+
+
 
 (defn active-when= [active-page candidate]
   (when (= active-page candidate) " is-active"))
@@ -143,3 +157,13 @@
 
 
 
+(def css-transition-group
+  (reagent/adapt-react-class js/ReactTransitionGroup.CSSTransition))
+
+(defn appearing [{:keys [visible? enter-class exit-class timeout]} & children ]
+  (let [final-state (reagent/atom visible?)]
+    (fn [{:keys [visible?]} & children]
+      [css-transition-group {:in visible? :class-names {:exit exit-class :enter enter-class} :timeout timeout :onEnter (fn [] (reset! final-state true )) :onExited (fn [] (reset! final-state false))} 
+       (if (or @final-state visible?)
+         (first children)
+         [:div])])))