notid/integreat
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

ux improvements for erros.

Browse Source
This commit is contained in:
Bryce Covert
2019-02-20 11:39:19 -08:00
parent 91d9ea346d
commit 985b5339af
12 changed files with 134 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/cljs/auto_ap/views/components/layouts.cljs
View File

@@ -7,11 +7,10 @@
[auto-ap.routes :as routes]
[auto-ap.subs :as subs]
[auto-ap.events :as events]
[auto-ap.views.utils :refer [active-when active-when= login-url dispatch-event]]
[auto-ap.views.utils :refer [active-when active-when= login-url dispatch-event appearing css-transition-group]]
[auto-ap.views.components.vendor-dialog :refer [vendor-dialog]]))
(def css-transition-group
(reagent/adapt-react-class js/ReactTransitionGroup.CSSTransition))
(defn navbar-drop-down-contents [{:keys [id]} children ]
(let [toggle-fn (fn [] (re-frame/dispatch [::events/toggle-menu id]))]
@@ -32,10 +31,10 @@
(.stopPropagation e)
(re-frame/dispatch [::events/toggle-menu id])
true)} header]
[:div {:class "navbar-dropdown"}
(when menu-active?
[navbar-drop-down-contents {:id id}
[:div child]])]]))})))
[appearing {:visible? menu-active? :enter-class "appear" :exit-class "disappear" :timeout 200}
[:div {:class "navbar-dropdown"}
[navbar-drop-down-contents {:id id}
[:div child]]]]]))})))
(defn login-dropdown []
(let [user (re-frame/subscribe [::subs/user])
@@ -105,13 +104,9 @@
[:strong "Integreat"] ]]])
(defn appearing-side-bar [{:keys [visible?]} & children ]
(let [final-state (reagent/atom visible?)]
(fn [{:keys [visible?]} & children]
[css-transition-group {:in visible? :class-names {:exitDone "bounce animated" :exit "slide-out-right" :enter "slide-in-right"} :timeout 500 :onEnter (fn [] (reset! final-state true )) :onExited (fn [] (reset! final-state false))}
(if (or @final-state visible?)
[:aside {:class "column is-3 aside menu" :style {:height "calc(100vh - 46px)" :overflow "auto"}}
[:div.sub-main {} children ]]
[:div])])))
[appearing {:visible? visible? :enter-class "slide-in-right" :exit-class "slide-out-right" :timeout 500}
[:aside {:class "column is-3 aside menu" :style {:height "calc(100vh - 46px)" :overflow "auto"}}
[:div.sub-main {} children ]]])
(defn side-bar-layout [{:keys [side-bar main ap bottom right-side-bar]}]
(let [ap @(re-frame/subscribe [::subs/active-page])
@@ -125,7 +120,11 @@
]]]
[:div {:class "column messages hero " :style { :overflow "auto" }, :id "message-feed"}
^{:key (str "active-page-" (:name client))}
[:div.inbox-messages main]]
[:div.inbox-messages
(when-let [error @(re-frame/subscribe [::subs/page-failure])]
[:div.notification.is-warning.animated.fadeInUp
error])
main]]
(when right-side-bar
right-side-bar)
]