standardized user form

src/cljs/auto_ap/views/pages/admin/users/form.cljs

@@ -0,0 +1,124 @@
+(ns auto-ap.views.pages.admin.users.form
+  (:require [re-frame.core :as re-frame]
+            [reagent.core :as reagent]
+            [clojure.string :as str]
+            [auto-ap.subs :as subs]
+            [auto-ap.events :as events]
+            [auto-ap.entities.clients :as entity]
+            [auto-ap.views.components.address :refer [address-field]]
+            [auto-ap.views.components.admin.side-bar :refer [admin-side-bar]]
+            [auto-ap.views.components.layouts :refer [side-bar-layout]]
+            [auto-ap.views.utils :refer [login-url dispatch-value-change bind-field horizontal-field dispatch-event]]
+            [auto-ap.views.components.modal :refer [modal action-modal]]
+            [auto-ap.views.components.grid :as grid]
+            [auto-ap.utils :refer [by replace-if]]
+            [cljs.reader :as edn]
+            [auto-ap.routes :as routes]
+            [bidi.bidi :as bidi]
+            [auto-ap.status :as status]))
+
+(re-frame/reg-sub
+ ::editing
+ (fn [db]
+   (-> db ::editing)))
+
+(re-frame/reg-event-db
+ ::change
+ (fn  [db [_ path value]]
+   (assoc-in db (concat [::editing] path) value)))
+
+(re-frame/reg-event-db
+ ::editing
+ (fn [db [_ d]]
+   (re-frame/dispatch [::events/modal-status ::edit-user {:visible? true}])
+   (assoc-in db [::editing] d)))
+
+(re-frame/reg-event-db
+ ::add-client
+ (fn [db [_ d]]
+   (let [client (get @(re-frame/subscribe [::subs/clients-by-id])
+                     (get-in db [::editing :adding-client]))]
+     (update-in db [::editing :clients] conj client))))
+
+(re-frame/reg-event-db
+ ::remove-client
+ (fn [db [_ d]]
+   (update-in db [::editing :clients] #(filter (fn [c] (not= (:id c) d)) %))))
+
+(re-frame/reg-event-fx
+ ::save
+ (fn [{:keys [db]} [_]]
+   {:db (-> db
+            (assoc-in [::editing :saving?] true ))
+    :graphql
+    {:token (-> db :user)
+     
+     :query-obj {:venia/operation {:operation/type :mutation
+                                   :operation/name "EditUser"}
+                 
+                 :venia/queries [{:query/data [:edit-user
+                                               {:edit-user (-> (get db ::editing)
+                                                               (update :clients #(map :id %))
+                                                               (select-keys #{:id :name :clients :role}))}
+                                               [:id :name :role [:clients [:id :name]]]]}]}  
+     :on-success [::saved]}}))
+
+(re-frame/reg-event-fx
+ ::saved
+ (fn [{:keys [db]} [_ {:keys [edit-user]}]]
+   (re-frame/dispatch [::events/modal-completed ::edit-user])))
+
+(defn form []
+  (let [editing @(re-frame/subscribe [::editing])]
+    [action-modal {:title (str "Edit " (:name editing))
+                   :id ::edit-user
+                   :action-text "Save"
+                   :save-event [::save]}
+     [horizontal-field
+      [:label.label  "Name"]
+      [bind-field
+       [:input.input {:type "text"
+                      :field [:name]
+                      :spec ::entity/name
+                      :event ::change
+                      :subscription editing}]]]
+
+     [horizontal-field
+      [:label.label  "Role"]
+      [:div.control
+       [:div.select
+        [bind-field
+         [:select {:type "select"
+                   :field [:role]
+                   :spec ::entity/name
+                   :event ::change
+                   :subscription editing}
+          [:option {:value ":none"} "None"]
+          [:option {:value ":user"} "User"]
+          [:option {:value ":manager"} "Manager"]
+          [:option {:value ":admin"} "Admin"]]]]]]
+
+     (when (#{":user" ":manager"} (:role editing))
+       [horizontal-field
+        [:label.label "Clients"]
+        [:div.control
+
+         [:div.field.has-addons
+          [:p.control
+           [:div.select
+            [bind-field
+             [:select {:type "select"
+                       :field [:adding-client]
+                       :event ::change
+                       :subscription editing}
+              [:option]
+              (let [used-clients (set (map :id (:clients editing)))]
+                (for [{:keys [id name]} @(re-frame/subscribe [::subs/clients])
+                      :when (not (used-clients id))]
+                  ^{:key id} [:option {:value id} name]))]]]]
+          [:p.control
+           [:button.button.is-primary {:on-click (dispatch-event [::add-client])} "Add"]]]
+         
+         [:ul
+          (for [{:keys [id name]} (:clients editing)]
+            ^{:key id} [:li  name [:a.icon {:on-click (dispatch-event [::remove-client id])} [:i.fa.fa-times ]]])]]])]))

src/cljs/auto_ap/views/pages/admin/users/table.cljs

@@ -0,0 +1,44 @@
+(ns auto-ap.views.pages.admin.users.table
+  (:require 
+   [clojure.string :as str]
+   [re-frame.core :as re-frame]
+   [auto-ap.views.utils :refer [action-cell-width]]
+   [auto-ap.views.pages.admin.users.form :as form]
+   [auto-ap.views.components.buttons :as buttons]
+   [auto-ap.views.components.grid :as grid]))
+
+(re-frame/reg-event-fx
+ ::params-changed
+ (fn [{:keys [db]} [_ p]]
+   {:db (assoc db ::params p)}))
+
+(re-frame/reg-sub
+ ::params
+ (fn [db]
+   (-> db ::params)))
+
+(defn table [{:keys [status page]}]
+  (let [params @(re-frame/subscribe [::params])]
+    [grid/grid {:status status
+                :on-params-change (fn [p]
+                                    (re-frame/dispatch [::params-changed p]))
+                :params  params
+                :column-count 4}
+     [grid/controls page]
+     [grid/table {:fullwidth true}
+      [grid/header
+       [grid/row {}
+        [grid/header-cell {} "User"]
+        [grid/header-cell {} "Role"]
+        [grid/header-cell {} "Clients"]
+        [grid/header-cell {:style {:width (action-cell-width 1)}} ]]]
+      [grid/body
+       (for [{:keys [id name role clients] :as c} (:data page)]
+         ^{:key (str name "-" id )}
+         [grid/row {:class (:class c)}
+          [grid/cell {} name]
+          [grid/cell {} role]
+          [grid/cell {} (str/join ", " (map :name clients))]
+          [grid/cell {}
+           [buttons/fa-icon {:event [::form/editing c]
+                             :icon "fa-pencil"}]]])]]]))