More work on color collections page.

src/uxbox/main/data/colors.cljs

@@ -8,6 +8,7 @@
 (ns uxbox.main.data.colors
   (:require [clojure.set :as set]
             [beicon.core :as rx]
+            [uxbox.util.datetime :as dt]
             [uxbox.util.uuid :as uuid]
             [uxbox.util.rstore :as rs]
             [uxbox.util.router :as r]
@@ -60,10 +61,9 @@
 (defrecord CollectionsFetched [data]
   rs/UpdateEvent
   (-apply-update [_ state]
-    (let [value (:value data)]
+    (-> state
-      (-> state
+        (assoc-in [:kvstore :color-collections] data)
-          (assoc-in [:kvstore :color-collections] data)
+        (update :color-colls-by-id merge (:value data)))))
-          (update :color-colls-by-id merge value)))))
 
 (defn collections-fetched
   [data]
@@ -94,25 +94,25 @@
 
 ;; --- Create Collection
 
-(defrecord CreateCollection []
+(defrecord CreateCollection [id]
   rs/UpdateEvent
   (-apply-update [_ state]
-    (let [id (uuid/random)
+    (let [item {:name "Unnamed collection"
-          item {:name "Unnamed collection"
+                :id id
+                :created-at (dt/now)
                 :type :own
-                :id id}]
+                :colors #{}}]
-      (-> state
+      (assoc-in state [:color-colls-by-id id] item)))
-          (assoc-in [:color-colls-by-id id] item)
-          (assoc-in [:dashboard :colors :id] id)
-          (assoc-in [:dashboard :colors :type] :own))))
 
   rs/WatchEvent
   (-apply-watch [_ state stream]
-    (rx/of (persist-collections))))
+    (rx/of (persist-collections)
+           (select-collection :own id))))
 
 (defn create-collection
   []
-  (CreateCollection.))
+  (let [id (uuid/random)]
+    (CreateCollection. id)))
 
 ;; --- Persist Collections
 
@@ -120,12 +120,12 @@
   rs/WatchEvent
   (-apply-watch [_ state stream]
     (let [builtin? #(= :builtin (:type %))
-          xf (remove (comp builtin? second))
+          xform (remove (comp builtin? second))
-
+          value (->> (get state :color-colls-by-id)
-          colls (get state :color-colls-by-id)
+                     (into {} xform))
-          data (-> (get-in state [:kvstore :color-collections])
+          store (get-in state [:kvstore :color-collections])
-                   (assoc :value (into {} xf colls)))]
+          store (assoc store :value value)]
-      (->> (rp/req :update/kvstore data)
+      (->> (rp/req :update/kvstore store)
            (rx/map :payload)
            (rx/map collections-fetched)))))
 
@@ -157,7 +157,9 @@
 
   rs/WatchEvent
   (-apply-watch [_ state s]
-    (rx/of (persist-collections))))
+    (let [type (get-in state [:dashboard :colors :type])]
+      (rx/of (persist-collections)
+             (select-collection type)))))
 
 (defn delete-collection
   [id]
@@ -169,7 +171,7 @@
   rs/UpdateEvent
   (-apply-update [_ state]
     (let [replacer #(-> (disj % from) (conj to))]
-      (update-in state [:color-colls-by-id id :data] (fnil replacer #{}))))
+      (update-in state [:color-colls-by-id id :colors] (fnil replacer #{}))))
 
   rs/WatchEvent
   (-apply-watch [_ state s]
@@ -178,7 +180,6 @@
 (defn replace-color
   "Add or replace color in a collection."
   [{:keys [id from to] :as params}]
-  (println "replace-color" params)
   (ReplaceColor. id from to))
 
 ;; --- Remove Color
@@ -186,7 +187,7 @@
 (defrecord RemoveColors [id colors]
   rs/UpdateEvent
   (-apply-update [_ state]
-    (update-in state [:color-colls-by-id id :data]
+    (update-in state [:color-colls-by-id id :colors]
                #(set/difference % colors)))
 
   rs/WatchEvent
@@ -230,7 +231,7 @@
   rs/UpdateEvent
   (-apply-update [_ state]
     (let [selected (get-in state [:dashboard :colors :selected])]
-      (update-in state [:color-colls-by-id id :data] set/union selected)))
+      (update-in state [:color-colls-by-id id :colors] set/union selected)))
 
   rs/WatchEvent
   (-apply-watch [_ state stream]
@@ -248,8 +249,8 @@
   (-apply-update [_ state]
     (let [selected (get-in state [:dashboard :colors :selected])]
       (-> state
-          (update-in [:color-colls-by-id from :data] set/difference selected)
+          (update-in [:color-colls-by-id from :colors] set/difference selected)
-          (update-in [:color-colls-by-id to :data] set/union selected))))
+          (update-in [:color-colls-by-id to :colors] set/union selected))))
 
   rs/WatchEvent
   (-apply-watch [_ state stream]

src/uxbox/main/state.cljs

@@ -3,11 +3,11 @@
 ;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
 ;;
 ;; Copyright (c) 2015-2016 Andrey Antukh <niwi@niwi.nz>
-;; Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
 
 (ns uxbox.main.state
   (:require [beicon.core :as rx]
             [lentes.core :as l]
+            [uxbox.main.state.colors :as colors]
             [uxbox.util.rstore :as rs]
             [uxbox.util.i18n :refer (tr)]
             [uxbox.util.storage :refer (storage)]))
@@ -38,8 +38,7 @@
    :icon-colls-by-id nil
    :icons-by-id nil
    :shapes-by-id nil
-   :elements-by-id nil
+   :color-colls-by-id colors/collections
-   :colors-by-id nil
    :projects-by-id nil
    :pages-by-id nil})
 

src/uxbox/main/ui/dashboard/colors.cljs

@@ -43,7 +43,8 @@
   [own {:keys [id] :as coll}]
   (let [local (:rum/local own)
         dashboard (mx/react dashboard-ref)
-        own? (= :builtin (:type coll))
+        own? (= :own (:type coll))
+        editable? (or own? (nil? id))
         edit? (:edit @local)]
     (letfn [(save []
               (let [dom (mx/ref-node own "input")
@@ -74,10 +75,13 @@
              :on-key-down on-input-keydown}
             (:name coll)]
            [:span.close {:on-click cancel} i/close]]
-          [:span.dashboard-title-field
+          (if own?
-           {:on-double-click edit}
+            [:span.dashboard-title-field
-           (:name coll "Storage")])]
+             {:on-double-click edit}
-       (if (and (not own?) coll)
+             (:name coll)]
+            [:span.dashboard-title-field
+             (:name coll "Storage")]))]
+       (if (and own? coll)
          [:div.edition
           (if edit?
             [:span {:on-click save} i/save]
@@ -92,7 +96,7 @@
   (letfn [(on-click [event]
             (let [type (or type :own)]
               (rs/emit! (dc/select-collection type id))))]
-    (let [colors (count (:data coll))]
+    (let [colors (count (:colors coll))]
       [:li {:on-click on-click
             :class-name (when selected? "current")}
        [:span.element-title
@@ -101,7 +105,7 @@
         (tr "ds.num-elements" (t/c colors))]])))
 
 (def ^:private storage-num-colors-ref
-  (-> (comp (l/in [:color-colls-by-id nil :data])
+  (-> (comp (l/in [:color-colls-by-id nil :colors])
             (l/lens count))
       (l/derive st/state)))
 
@@ -123,7 +127,8 @@
         colls (cond->> (vals colls)
                 own? (filter #(= :own (:type %)))
                 builtin? (filter #(= :builtin (:type %)))
-                own? (sort-by :id))]
+                own? (sort-by :created-at)
+                builtin? (sort-by :created-at))]
     [:ul.library-elements
      (when own?
        [:li
@@ -144,11 +149,11 @@
   (let [own? (= type :own)
         builtin? (= type :builtin)]
     (letfn [(select-tab [type]
-              (if own?
+              (if (= type :own)
                 (rs/emit! (dc/select-collection type))
                 (let [coll (->> (map second colls)
                                  (filter #(= type (:type %)))
-                                 (sort-by :name)
+                                 (sort-by :created-at)
                                  (first))]
                   (if coll
                     (rs/emit! (dc/select-collection type (:id coll)))
@@ -278,9 +283,9 @@
 
 (mx/defc grid
   {:mixins [mx/static]}
-  [{:keys [id type data] :as coll} selected]
+  [{:keys [id type colors] :as coll} selected]
   (let [editable? (or (= :own type) (nil? id))
-        colors (->> (remove nil? data)
+        colors (->> (remove nil? colors)
                     (sort-by identity))]
     [:div.dashboard-grid-content
      [:div.dashboard-grid-row