♻️ Replace lentes with okulary (performance).

frontend/deps.edn

@@ -13,9 +13,11 @@
   funcool/beicon {:mvn/version "2020.03.29-1"}
   funcool/cuerdas {:mvn/version "2020.03.26-3"}
   funcool/lentes {:mvn/version "1.4.0-SNAPSHOT"}
+
+  funcool/okulary {:mvn/version "2020.04.11-0"}
   funcool/potok {:mvn/version "2.8.0-SNAPSHOT"}
   funcool/promesa {:mvn/version "5.1.0"}
-  funcool/rumext {:mvn/version "2020.04.08-1"}
+  funcool/rumext {:mvn/version "2020.04.11-0"}
   }
  :aliases
  {:dev

frontend/src/uxbox/main/refs.cljs

@@ -9,68 +9,61 @@
 
 (ns uxbox.main.refs
   "A collection of derived refs."
-  (:require [lentes.core :as l]
+  (:require
-            [beicon.core :as rx]
+   [okulary.core :as l]
-            [uxbox.main.constants :as c]
+   [beicon.core :as rx]
-            [uxbox.main.store :as st]
+   [uxbox.main.constants :as c]
-            [uxbox.main.data.helpers :as helpers]))
+   [uxbox.main.store :as st]
+   [uxbox.main.data.helpers :as helpers]))
+
+(def route
+  (l/derived :route st/state))
+
+(def router
+  (l/derived :router st/state))
+
+(def message
+  (l/derived :message st/state))
 
 (def profile
-  (-> (l/key :profile)
+  (l/derived :profile st/state))
-      (l/derive st/state)))
-
-(def workspace
-  (-> (l/key :workspace-local)
-      (l/derive st/state)))
 
 (def workspace-local
-  (-> (l/key :workspace-local)
+  (l/derived :workspace-local st/state))
-      (l/derive st/state)))
 
 (def workspace-layout
-  (-> (l/key :workspace-layout)
+  (l/derived :workspace-layout st/state))
-      (l/derive st/state)))
 
 (def workspace-page
-  (-> (l/key :workspace-page)
+  (l/derived :workspace-page st/state))
-      (l/derive st/state)))
 
 (def workspace-file
-  (-> (l/key :workspace-file)
+  (l/derived :workspace-file st/state))
-      (l/derive st/state)))
 
 (def workspace-project
-  (-> (l/key :workspace-project)
+  (l/derived :workspace-project st/state))
-      (l/derive st/state)))
 
 (def workspace-images
-  (-> (l/key :workspace-images)
+  (l/derived :workspace-images st/state))
-      (l/derive st/state)))
 
 (def workspace-users
-  (-> (l/key :workspace-users)
+  (l/derived :workspace-users st/state))
-      (l/derive st/state)))
 
 (def workspace-data
-  (-> (l/lens #(let [page-id (get-in % [:workspace-page :id])]
+  (-> #(let [page-id (get-in % [:workspace-page :id])]
-                 (get-in % [:workspace-data page-id])))
+         (get-in % [:workspace-data page-id]))
-      (l/derive st/state)))
+      (l/derived st/state)))
-
-(def objects
-  (-> (l/lens #(let [page-id (get-in % [:workspace-page :id])]
-                 (get-in % [:workspace-data page-id :objects])))
-      (l/derive st/state)))
 
 (defn objects-by-id
   [ids]
-  (-> (l/lens (fn [state]
+  (letfn [(selector [state]
-                (let [page-id (get-in state [:workspace-page :id])
+            (let [page-id (get-in state [:workspace-page :id])
-                      objects (get-in state [:workspace-data page-id :objects])]
+                  objects (get-in state [:workspace-data page-id :objects])]
-                  (->> (set ids)
+              (->> (set ids)
-                       (map #(get objects %))
+                   (map #(get objects %))
-                       (filter identity)
+                   (filter identity)
-                       (vec)))))
+                   (vec))))]
-      (l/derive st/state {:equals? =})))
+    (l/derived selector st/state =)))
 
 (defn is-child-selected?
   [id]
@@ -81,71 +74,20 @@
                   shape (get objects id)
                   children (helpers/get-children id objects)]
               (some selected children)))]
-    (-> (l/lens selector)
+    (l/derived selector st/state)))
-        (l/derive st/state))))
 
 (def selected-shapes
-  (-> (l/key :selected)
+  (l/derived :selected workspace-local))
-      (l/derive workspace-local)))
 
 (defn make-selected
   [id]
-  (-> (l/lens #(contains? % id))
+  (l/derived #(contains? % id) selected-shapes))
-      (l/derive selected-shapes)))
 
-(def selected-frame
-  (-> (l/key :selected-frame)
-      (l/derive workspace-local)))
-
-(def toolboxes
-  (-> (l/key :toolboxes)
-      (l/derive workspace-local)))
-
-;; DEPRECATED
 (def selected-zoom
-  (-> (l/key :zoom)
+  (l/derived :zoom workspace-local))
-      (l/derive workspace-local)))
-
-(def selected-tooltip
-  (-> (l/key :tooltip)
-      (l/derive workspace-local)))
-
-(def selected-drawing-shape
-  (-> (l/key :drawing)
-      (l/derive workspace-local)))
 
 (def selected-drawing-tool
-  (-> (l/key :drawing-tool)
+  (l/derived :drawing-tool workspace-local))
-      (l/derive workspace)))
 
 (def selected-edition
-  (-> (l/key :edition)
+  (l/derived :edition workspace-local))
-      (l/derive workspace)))
-
-(def history
-  (-> (l/key :history)
-      (l/derive workspace)))
-
-(defn selected-modifiers
-  [id]
-  {:pre [(uuid? id)]}
-  (-> (l/in [:modifiers id])
-      (l/derive workspace)))
-
-(defn alignment-activated?
-  [flags]
-  (and (contains? flags :grid-indexed)
-       (contains? flags :grid-snap)))
-
-(def selected-alignment
-  (-> (comp (l/key :flags)
-            (l/lens alignment-activated?))
-      (l/derive workspace)))
-
-(def shapes-by-id
-  (-> (l/key :shapes)
-      (l/derive st/state)))
-
-
-
-

frontend/src/uxbox/main/store.cljs

@@ -2,14 +2,15 @@
 ;; License, v. 2.0. If a copy of the MPL was not distributed with this
 ;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
 ;;
-;; Copyright (c) 2015-2017 Andrey Antukh <niwi@niwi.nz>
+;; Copyright (c) 2020 UXBOX Labs SL
 
 (ns uxbox.main.store
-  (:require [beicon.core :as rx]
+  (:require
-            [lentes.core :as l]
+   [beicon.core :as rx]
-            [potok.core :as ptk]
+   [okulary.core :as l]
-            [uxbox.common.uuid :as uuid]
+   [potok.core :as ptk]
-            [uxbox.util.storage :refer [storage]]))
+   [uxbox.common.uuid :as uuid]
+   [uxbox.util.storage :refer [storage]]))
 
 ;; TODO: move outside uxbox.main
 
@@ -17,8 +18,8 @@
 
 (def ^:dynamic *on-error* identity)
 
-(defonce state (atom {}))
+(defonce state (l/atom {}))
-(defonce loader (atom false))
+(defonce loader (l/atom false))
 (defonce store (ptk/store {:on-error #(*on-error* %)}))
 (defonce stream (ptk/input-stream store))
 
@@ -44,10 +45,6 @@
       (rx/filter (fn [s] (deref *debug*)) $)
       (rx/subscribe $ (fn [event]
                         (println "[stream]: " (repr-event event)))))))
-(def auth-ref
-  (-> (l/key :auth)
-      (l/derive state)))
-
 (defn emit!
   ([] nil)
   ([event]

frontend/src/uxbox/main/ui.cljs

@@ -11,33 +11,28 @@
   (:require
    [beicon.core :as rx]
    [cuerdas.core :as str]
-   [lentes.core :as l]
    [potok.core :as ptk]
    [rumext.alpha :as mf]
    [uxbox.builtins.icons :as i]
-   [uxbox.common.exceptions :as ex]
    [uxbox.common.data :as d]
+   [uxbox.common.exceptions :as ex]
    [uxbox.main.data.auth :refer [logout]]
    [uxbox.main.data.messages :as dm]
    [uxbox.main.refs :as refs]
    [uxbox.main.store :as st]
    [uxbox.main.ui.dashboard :refer [dashboard]]
    [uxbox.main.ui.login :refer [login-page]]
+   [uxbox.main.ui.not-found :refer [not-found-page]]
    [uxbox.main.ui.profile.recovery :refer [profile-recovery-page]]
    [uxbox.main.ui.profile.recovery-request :refer [profile-recovery-request-page]]
    [uxbox.main.ui.profile.register :refer [profile-register-page]]
-   [uxbox.main.ui.viewer :refer [viewer-page]]
    [uxbox.main.ui.settings :as settings]
-   [uxbox.main.ui.not-found :refer [not-found-page]]
    [uxbox.main.ui.shapes]
+   [uxbox.main.ui.viewer :refer [viewer-page]]
    [uxbox.main.ui.workspace :as workspace]
    [uxbox.util.i18n :refer [tr]]
    [uxbox.util.timers :as ts]))
 
-(def route-iref
-  (-> (l/key :route)
-      (l/derive st/state)))
-
 ;; --- Routes
 
 (def routes
@@ -142,7 +137,7 @@
 
 (mf/defc app
   []
-  (let [route (mf/deref route-iref)]
+  (let [route (mf/deref refs/route)]
     (when route
       [:& app-container {:route route :key (get-in route [:data :name])}])))
 

frontend/src/uxbox/main/ui/colorpicker.cljs

@@ -6,7 +6,7 @@
 
 (ns uxbox.main.ui.colorpicker
   (:require
-   [lentes.core :as l]
+   [okulary.core :as l]
    [uxbox.main.store :as st]
    [goog.object :as gobj]
    [rumext.alpha :as mf]
@@ -15,7 +15,6 @@
 (mf/defc colorpicker
   [{:keys [on-change value colors] :as props}]
   (let [local-value (mf/use-state value)
-
         on-change-complete #(do
                               (reset! local-value %)
                               (on-change (gobj/get % "hex")))]
@@ -26,18 +25,16 @@
                         :onChangeComplete on-change-complete
                         :style {:box-shadow "none"}}]))
 
-(defn- lookup-colors
-  [state]
-  (as-> {} $
-    (reduce (fn [acc shape]
-              (-> acc
-                  (update (:fill-color shape) (fnil inc 0))
-                  (update (:stroke-color shape) (fnil inc 0))))
-            $ (vals (:shapes state)))
-    (reverse (sort-by second $))
-    (map first $)
-    (remove nil? $)))
 
 (def most-used-colors
-  (-> (l/lens lookup-colors)
+  (letfn [(selector [{:keys [objects]}]
-      (l/derive st/state)))
+            (as-> {} $
+              (reduce (fn [acc shape]
+                        (-> acc
+                            (update (:fill-color shape) (fnil inc 0))
+                            (update (:stroke-color shape) (fnil inc 0))))
+                      $ (vals objects))
+              (reverse (sort-by second $))
+              (map first $)
+              (remove nil? $)))]
+    (l/derived selector st/state)))

frontend/src/uxbox/main/ui/dashboard/library.cljs

@@ -10,7 +10,7 @@
 
 (ns uxbox.main.ui.dashboard.library
   (:require
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
    [cuerdas.core :as str]
    [uxbox.util.router :as rt]
@@ -302,16 +302,16 @@
                          :accept-text "Delete"}))]]}]]])))
 
 (defn libraries-ref [section team-id]
-  (-> (comp (l/key :library) (l/key section) (l/key team-id))
+  (-> (l/in [:library section team-id])
-      (l/derive st/state)))
+      (l/derived st/state)))
 
 (defn selected-items-ref [section library-id]
-  (-> (comp (l/key :library-items) (l/key section) (l/key library-id))
+  (-> (l/in [:library-items section library-id])
-      (l/derive st/state)))
+      (l/derived st/state)))
 
 (def last-deleted-library-ref
-  (-> (comp (l/key :library) (l/key :last-deleted-library))
+  (-> (l/in [:library :last-deleted-library])
-      (l/derive st/state)))
+      (l/derived st/state)))
 
 (mf/defc library-page
   [{:keys [team-id library-id section]}]

frontend/src/uxbox/main/ui/dashboard/project.cljs

@@ -9,7 +9,7 @@
 
 (ns uxbox.main.ui.dashboard.project
   (:require
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
    [uxbox.builtins.icons :as i]
    [uxbox.util.i18n :as i18n :refer [t]]
@@ -24,13 +24,11 @@
    [uxbox.main.ui.dashboard.grid :refer [grid]]))
 
 (def projects-ref
-  (-> (l/key :projects)
+  (l/derived :projects st/state))
-      (l/derive st/state)))
 
 (def files-ref
-  (-> (comp (l/key :files)
+  (-> (comp vals :files)
-            (l/lens vals))
+      (l/derived st/state)))
-      (l/derive st/state)))
 
 (mf/defc project-header
   [{:keys [team-id project-id] :as props}]

frontend/src/uxbox/main/ui/dashboard/recent_files.cljs

@@ -9,7 +9,7 @@
 
 (ns uxbox.main.ui.dashboard.recent-files
   (:require
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
    [uxbox.builtins.icons :as i]
    [uxbox.common.exceptions :as ex]
@@ -31,16 +31,13 @@
 ;; --- Component: Content
 
 (def projects-ref
-  (-> (l/key :projects)
+  (l/derived :projects st/state))
-      (l/derive st/state)))
 
 (def recent-file-ids-ref
-  (-> (l/key :recent-file-ids)
+  (l/derived :recent-file-ids st/state))
-      (l/derive st/state)))
 
 (def files-ref
-  (-> (l/key :files)
+  (l/derived :files st/state))
-      (l/derive st/state)))
 
 ;; --- Component: Recent files
 

frontend/src/uxbox/main/ui/dashboard/search.cljs

@@ -10,7 +10,7 @@
 
 (ns uxbox.main.ui.dashboard.search
   (:require
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
    [uxbox.main.store :as st]
    [uxbox.main.data.dashboard :as dsh]
@@ -20,8 +20,8 @@
 ;; --- Component: Search
 
 (def search-result-ref
-  (-> (l/in [:dashboard-local :search-result])
+  (-> #(get-in % [:dashboard-local :search-result])
-      (l/derive st/state)))
+      (l/derived st/state)))
 
 (mf/defc search-page
   [{:keys [team-id search-term] :as props}]

frontend/src/uxbox/main/ui/dashboard/sidebar.cljs

@@ -11,7 +11,7 @@
 (ns uxbox.main.ui.dashboard.sidebar
   (:require
    [cuerdas.core :as str]
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
    [goog.functions :as f]
    [uxbox.builtins.icons :as i]
@@ -65,8 +65,7 @@
         [:span.element-title name]])]))
 
 (def projects-iref
-  (-> (l/key :projects)
+  (l/derived :projects st/state))
-      (l/derive st/state)))
 
 (mf/defc sidebar-projects
   [{:keys [team-id selected-project-id] :as props}]

frontend/src/uxbox/main/ui/messages.cljs

@@ -1,29 +1,22 @@
 (ns uxbox.main.ui.messages
   (:require
-   [lentes.core :as l]
    [rumext.alpha :as mf]
    [uxbox.builtins.icons :as i]
    [uxbox.main.data.messages :as dm]
+   [uxbox.main.refs :as refs]
    [uxbox.main.store :as st]
+   [uxbox.util.data :refer [classnames]]
    [uxbox.util.dom :as dom]
-   [uxbox.util.timers :as ts]
    [uxbox.util.i18n :as i18n :refer [t]]
-   [uxbox.util.data :refer [classnames]]))
+   [uxbox.util.timers :as ts]))
 
 ;; --- Main Component (entry point)
 
 (declare notification)
 
-(def ^:private message-iref
-  (-> (l/key :message)
-      (l/derive st/state)))
-
 (mf/defc messages
   []
-  (let [message (mf/deref message-iref)
+  (let [message (mf/deref refs/message)]
-        ;; message {:type :error
-        ;;          :content "Hello world!"}
-        ]
     (when message
       [:& notification {:type (:type message)
                         :status (:status message)
@@ -31,7 +24,7 @@
 
 (mf/defc messages-widget
   []
-  (let [message (mf/deref message-iref)
+  (let [message (mf/deref refs/message)
         message {:type :error
                  :content "Hello world!"}]
 

frontend/src/uxbox/main/ui/viewer.cljs

@@ -12,7 +12,7 @@
    [beicon.core :as rx]
    [goog.events :as events]
    [goog.object :as gobj]
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
    [uxbox.builtins.icons :as i]
    [uxbox.common.exceptions :as ex]
@@ -93,12 +93,10 @@
 ;; --- Component: Viewer Page
 
 (def viewer-data-ref
-  (-> (l/key :viewer-data)
+  (l/derived :viewer-data st/state))
-      (l/derive st/state)))
 
 (def viewer-local-ref
-  (-> (l/key :viewer-local)
+  (l/derived :viewer-local st/state))
-      (l/derive st/state)))
 
 (mf/defc viewer-page
   [{:keys [page-id index token] :as props}]

frontend/src/uxbox/main/ui/workspace.cljs

@@ -65,7 +65,7 @@
        [:& colorpalette {:left-sidebar? left-sidebar?}])
 
      [:& messages]
-     [:& context-menu {}]
+     [:& context-menu]
 
      [:section.workspace-content
       {:class classes

frontend/src/uxbox/main/ui/workspace/colorpalette.cljs

@@ -2,42 +2,40 @@
 ;; License, v. 2.0. If a copy of the MPL was not distributed with this
 ;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
 ;;
-;; Copyright (c) 2015-2017 Andrey Antukh <niwi@niwi.nz>
+;; This Source Code Form is "Incompatible With Secondary Licenses", as
-;; Copyright (c) 2015-2017 Juan de la Cruz <delacruzgarciajuan@gmail.com>
+;; defined by the Mozilla Public License, v. 2.0.
+;;
+;; Copyright (c) 2020 UXBOX Labs SL
 
 (ns uxbox.main.ui.workspace.colorpalette
   (:require
    [beicon.core :as rx]
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
    [uxbox.builtins.icons :as i]
    [uxbox.main.data.colors :as udc]
-   [uxbox.main.data.workspace :as udw]
    [uxbox.main.data.library :as dlib]
+   [uxbox.main.data.workspace :as udw]
+   [uxbox.main.refs :as refs]
    [uxbox.main.store :as st]
+   [uxbox.main.ui.components.context-menu :refer [context-menu]]
    [uxbox.main.ui.keyboard :as kbd]
    [uxbox.util.color :refer [hex->rgb]]
-   [uxbox.util.data :refer [read-string seek]]
+   [uxbox.util.dom :as dom]))
-   [uxbox.util.dom :as dom]
-   [uxbox.main.ui.components.context-menu :refer [context-menu]]))
 
 ;; --- Refs
 
-(def project-ref
-  (-> (l/key :workspace-project)
-      (l/derive st/state)))
-
 (def libraries-ref
-  (-> (comp (l/key :library) (l/key :palettes))
+  (l/derived #(get-in % [:library :palettes]) st/state))
-      (l/derive st/state)))
 
-(defn selected-items-ref [library-id]
+(defn selected-items-ref
-  (-> (comp (l/key :library-items) (l/key :palettes) (l/key library-id))
+  [library-id]
-      (l/derive st/state)))
+  (->> #(get-in % [:library-items :palettes library-id])
+       (l/derived st/state)))
 
 (def selected-library-ref
-  (-> (comp (l/key :library-selected) (l/key :palettes))
+  (-> #(get-in % [:library-selected :palettes])
-      (l/derive st/state)))
+      (l/derived st/state)))
 
 ;; --- Components
 
@@ -64,7 +62,7 @@
       (mf/use-effect
        (mf/deps current-selection)
        #(st/emit! (dlib/retrieve-library-data :palettes current-selection)))
-      
+
       (let [items (-> current-selection selected-items-ref  mf/deref)
             doc-width (.. js/document -documentElement -clientWidth)
             width (:width @state (* doc-width 0.84))
@@ -108,7 +106,7 @@
 
         [:div.color-palette {:class (when left-sidebar? "left-sidebar-open")}
          [:& context-menu {:selectable true
-                           :selected (->> libraries (filter #(= (:id %) current-selection)) first :name) 
+                           :selected (->> libraries (filter #(= (:id %) current-selection)) first :name)
                            :show (:show-menu @state)
                            :on-close #(swap! state assoc :show-menu false)
                            :options (mapv #(vector (:name %) (partial handle-click %)) libraries)} ]
@@ -130,7 +128,7 @@
 
 (mf/defc colorpalette
   [{:keys [left-sidebar?]}]
-  (let [team-id (-> project-ref mf/deref :team-id)
+  (let [team-id (-> refs/workspace-project mf/deref :team-id)
         libraries (-> libraries-ref mf/deref vals flatten)]
     (mf/use-effect #(st/emit! (dlib/retrieve-libraries :palettes)
                               (dlib/retrieve-libraries :palettes team-id)))

frontend/src/uxbox/main/ui/workspace/colorpicker.cljs

@@ -7,29 +7,10 @@
 
 (ns uxbox.main.ui.workspace.colorpicker
   (:require
-   [lentes.core :as l]
    [rumext.alpha :as mf]
    [uxbox.main.store :as st]
    [uxbox.main.ui.colorpicker :as cp]))
 
-;; --- Recent Colors Calc. Algorithm
-
-(defn- lookup-colors
-  [state]
-  (as-> {} $
-    (reduce (fn [acc shape]
-              (-> acc
-                  (update (:fill-color shape) (fnil inc 0))
-                  (update (:stroke-color shape) (fnil inc 0))))
-            $ (vals (:shapes state)))
-    (reverse (sort-by second $))
-    (map first $)
-    (remove nil? $)))
-
-(def most-used-colors
-  (-> (l/lens lookup-colors)
-      (l/derive st/state)))
-
 ;; --- Color Picker Modal
 
 (mf/defc colorpicker-modal
@@ -38,7 +19,7 @@
    {:style {:left (str (- x 260) "px")
             :top (str (- y 50) "px")}}
    [:& cp/colorpicker {:value (or value default)
-                       :colors (into-array @most-used-colors)
+                       :colors (into-array @cp/most-used-colors)
                        :on-change on-change}]])
 
 

frontend/src/uxbox/main/ui/workspace/context_menu.cljs

@@ -11,7 +11,7 @@
   "A workspace specific context menu (mouse right click)."
   (:require
    [beicon.core :as rx]
-   [lentes.core :as l]
+   [okulary.core :as l]
    [potok.core :as ptk]
    [rumext.alpha :as mf]
    [uxbox.main.store :as st]
@@ -24,8 +24,7 @@
    [uxbox.main.ui.components.dropdown :refer [dropdown]]))
 
 (def menu-ref
-  (-> (l/key :context-menu)
+  (l/derived :context-menu refs/workspace-local))
-      (l/derive refs/workspace-local)))
 
 (defn- prevent-default
   [event]
@@ -102,8 +101,8 @@
        [:& menu-entry {:title "Hide"
                        :on-click do-hide-shape}])
 
-     
+
-     
+
      (if (:blocked shape)
        [:& menu-entry {:title "Unlock"
                        :on-click do-unlock-shape}]

frontend/src/uxbox/main/ui/workspace/drawarea.cljs

@@ -131,13 +131,10 @@
       ptk/WatchEvent
       (watch [_ state stream]
         (let [{:keys [zoom flags]} (:workspace-local state)
-              align? (refs/alignment-activated? flags)
-
               stoper? #(or (ms/mouse-up? %) (= % :interrupt))
               stoper (rx/filter stoper? stream)
 
               mouse (->> ms/mouse-position
-                         ;; (rx/mapcat #(conditional-align % align?))
                          (rx/map #(gpt/divide % (gpt/point zoom))))]
           (rx/concat
            (->> mouse
@@ -181,14 +178,12 @@
       (watch [_ state stream]
         (let [{:keys [zoom flags]} (:workspace-local state)
 
-              align? (refs/alignment-activated? flags)
               last-point (volatile! (gpt/divide @ms/mouse-position (gpt/point zoom)))
 
               stoper (->> (rx/filter stoper-event? stream)
                           (rx/share))
 
               mouse (->> (rx/sample 10 ms/mouse-position)
-                         ;; (rx/mapcat #(conditional-align % align?))
                          (rx/map #(gpt/divide % (gpt/point zoom))))
 
               points (->> stream
@@ -255,10 +250,8 @@
       ptk/WatchEvent
       (watch [_ state stream]
         (let [{:keys [zoom flags]} (:workspace-local state)
-              align? (refs/alignment-activated? flags)
               stoper (rx/filter stoper-event? stream)
               mouse  (->> (rx/sample 10 ms/mouse-position)
-                          ;; (rx/mapcat #(conditional-align % align?))
                           (rx/map #(gpt/divide % (gpt/point zoom))))]
           (rx/concat
            (rx/of initialize-drawing)
@@ -350,8 +343,3 @@
            :on-click on-click
            :on-mouse-enter on-mouse-enter
            :on-mouse-leave on-mouse-leave}])])))
-
-;; (defn- conditional-align [point align?]
-;;   (if align?
-;;     (uwrk/align-point point)
-;;     (rx/of point)))

frontend/src/uxbox/main/ui/workspace/grid.cljs

@@ -2,27 +2,27 @@
 ;; License, v. 2.0. If a copy of the MPL was not distributed with this
 ;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
 ;;
-;; Copyright (c) 2015-2017 Juan de la Cruz <delacruzgarciajuan@gmail.com>
+;; This Source Code Form is "Incompatible With Secondary Licenses", as
-;; Copyright (c) 2015-2019 Andrey Antukh <niwi@niwi.nz>
+;; defined by the Mozilla Public License, v. 2.0.
+;;
+;; Copyright (c) 2020 UXBOX Labs SL
 
 (ns uxbox.main.ui.workspace.grid
   (:require
    [cuerdas.core :as str]
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
-   [uxbox.main.refs :as refs]
+   [uxbox.main.constants :as c]
-   [uxbox.main.constants :as c]))
+   [uxbox.main.refs :as refs]))
 
 ;; --- Grid (Component)
 
 (def options-iref
-  (-> (l/key :options)
+  (l/derived :options refs/workspace-data))
-      (l/derive refs/workspace-data)))
 
 (mf/defc grid
   {:wrap [mf/memo]}
   [props]
-  (prn "grid$render")
   (let [options (mf/deref options-iref)
         width (:grid-x options 10)
         height (:grid-y options 10)

frontend/src/uxbox/main/ui/workspace/header.cljs

@@ -10,7 +10,6 @@
 
 (ns uxbox.main.ui.workspace.header
   (:require
-   [lentes.core :as l]
    [rumext.alpha :as mf]
    [uxbox.builtins.icons :as i :include-macros true]
    [uxbox.config :as cfg]
@@ -144,17 +143,13 @@
 
 ;; --- Header Component
 
-(def router-ref
-  (-> (l/key :router)
-      (l/derive st/state)))
-
 (mf/defc header
   [{:keys [page file layout project] :as props}]
   (let [locale (i18n/use-locale)
         go-to-dashboard #(st/emit! (rt/nav :dashboard-team {:team-id "self"}))
         zoom (mf/deref refs/selected-zoom)
         locale (i18n/use-locale)
-        router (mf/deref router-ref)
+        router (mf/deref refs/router)
         view-url (rt/resolve router :viewer {:page-id (:id page)} {:index 0})]
     [:header.workspace-header
      [:div.main-icon

frontend/src/uxbox/main/ui/workspace/images.cljs

@@ -21,6 +21,7 @@
    [uxbox.common.uuid :as uuid]))
 
 ;; --- Refs
+;; TODO: pending refactor
 
 (def ^:private collections-iref
   (-> (l/key :images-collections)

frontend/src/uxbox/main/ui/workspace/sidebar/align.cljs

@@ -18,7 +18,9 @@
 (mf/defc align-options
   []
   (let [selected (mf/deref refs/selected-shapes)
-        objects (deref refs/objects) ; don't need to watch objects, only read the value
+
+        ;; don't need to watch objects, only read the value
+        objects  (:objects (deref refs/workspace-data))
 
         disabled (cond
                    (empty? selected) true

frontend/src/uxbox/main/ui/workspace/sidebar/history.cljs

@@ -73,7 +73,7 @@
 
 (mf/defc history-toolbox
   [props]
-  (let [history (mf/deref refs/history)
+  (let [history nil #_(mf/deref refs/history)
         section (mf/use-state :main)
         ;; close #(st/emit! (dw/toggle-flag :history))
         close (constantly nil)
@@ -102,7 +102,7 @@
 
 (mf/defc history-dialog
   [props]
-  (let [history (mf/deref refs/history)
+  (let [history nil  #_(mf/deref refs/history)
         version (:selected history)
         on-accept #(st/emit! udh/apply-selected)
         on-cancel #(st/emit! udh/deselect)]

frontend/src/uxbox/main/ui/workspace/sidebar/layers.cljs

@@ -10,7 +10,6 @@
 
 (ns uxbox.main.ui.workspace.sidebar.layers
   (:require
-   [lentes.core :as l]
    [rumext.alpha :as mf]
    [uxbox.common.data :as d]
    [uxbox.builtins.icons :as i]
@@ -26,10 +25,6 @@
    [uxbox.common.uuid :as uuid]
    [uxbox.util.i18n :as i18n :refer [t]]))
 
-(def ^:private shapes-iref
-  (-> (l/key :shapes)
-      (l/derive st/state)))
-
 ;; --- Helpers
 
 (mf/defc element-icon

frontend/src/uxbox/main/ui/workspace/sidebar/libraries.cljs

@@ -9,7 +9,7 @@
 
 (ns uxbox.main.ui.workspace.sidebar.libraries
   (:require
-   [lentes.core :as l]
+   [okulary.core :as l]
    [cuerdas.core :as str]
    [rumext.alpha :as mf]
    [uxbox.common.data :as d]
@@ -31,25 +31,21 @@
 
 ;; --- Refs
 
-(def project-ref
-  (-> (l/key :workspace-project)
-      (l/derive st/state)))
-
 (defn libraries-ref [section]
-  (-> (comp (l/key :library) (l/key section))
+  (-> (l/in [:library section])
-      (l/derive st/state)))
+      (l/derived st/state)))
 
 (defn selected-items-ref [section library-id]
-  (-> (comp (l/key :library-items) (l/key section) (l/key library-id))
+  (-> (l/in [:library-items section library-id])
-      (l/derive st/state)))
+      (l/derived st/state)))
 
 (defn selected-library-ref [section]
-  (-> (comp (l/key :library-selected) (l/key section))
+  (-> (l/in [:library-selected section])
-      (l/derive st/state)))
+      (l/derived st/state)))
 
 (defn selected-filter-ref [section]
-  (-> (comp (l/key :library-filter) (l/key section))
+  (-> (l/in [:library-filter section])
-      (l/derive st/state)))
+      (l/derived st/state)))
 
 (defmulti shape-from-item (fn [type _] type))
 
@@ -111,7 +107,7 @@
              (if (= section :icons)
                [:svg {:view-box (->> item :metadata :view-box (str/join " "))
                       :width (-> item :metadata :width)
-                      :height (-> item :metadat :height) 
+                      :height (-> item :metadat :height)
                       :dangerouslySetInnerHTML {:__html (:content item)}}]
                [:img {:draggable false
                       :src (:thumb-uri item)}])
@@ -121,7 +117,7 @@
   [{:keys [key]}]
   (let [state (mf/use-state {:menu-open false})
         selected-filter (fn [section] (or (mf/deref (selected-filter-ref section)) :all))
-        team-id (-> project-ref mf/deref :team-id)
+        team-id (-> refs/workspace-project mf/deref :team-id)
 
         filter-to-str {:all (tr "workspace.library.all")
                        :own (tr "workspace.library.own")

frontend/src/uxbox/main/ui/workspace/sidebar/options.cljs

@@ -2,12 +2,14 @@
 ;; License, v. 2.0. If a copy of the MPL was not distributed with this
 ;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
 ;;
-;; Copyright (c) 2015-2016 Andrey Antukh <niwi@niwi.nz>
+;; This Source Code Form is "Incompatible With Secondary Licenses", as
-;; Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>
+;; defined by the Mozilla Public License, v. 2.0.
+;;
+;; Copyright (c) 2020 UXBOX Labs SL
 
 (ns uxbox.main.ui.workspace.sidebar.options
   (:require
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
    [uxbox.builtins.icons :as i]
    [uxbox.main.data.workspace :as udw]
@@ -46,8 +48,8 @@
   [{:keys [shape-id page-id] :as props}]
   (let [shape-iref (-> (mf/deps shape-id page-id)
                        (mf/use-memo
-                        #(-> (l/in [:workspace-data page-id :objects shape-id])
+                        #(-> (l/in [:objects shape-id])
-                             (l/derive st/state))))
+                             (l/derived refs/workspace-data))))
         shape (mf/deref shape-iref)]
     [:& shape-options {:shape shape}]))
 

frontend/src/uxbox/main/ui/workspace/sidebar/options/page.cljs

@@ -10,7 +10,7 @@
   (:require
    [cuerdas.core :as str]
    [rumext.alpha :as mf]
-   [lentes.core :as l]
+   [okulary.core :as l]
    [uxbox.common.data :as d]
    [uxbox.builtins.icons :as i]
    [uxbox.main.constants :as c]
@@ -66,8 +66,7 @@
    :grid-color "#cccccc"})
 
 (def options-iref
-  (-> (l/key :options)
+  (l/derived :options refs/workspace-data))
-      (l/derive refs/workspace-data)))
 
 (mf/defc grid-options
   {:wrap [mf/memo]}

frontend/src/uxbox/main/ui/workspace/sidebar/sitemap.cljs

@@ -8,7 +8,7 @@
 (ns uxbox.main.ui.workspace.sidebar.sitemap
   (:require
    [cuerdas.core :as str]
-   [lentes.core :as l]
+   [okulary.core :as l]
    [rumext.alpha :as mf]
    [uxbox.builtins.icons :as i]
    [uxbox.main.data.workspace :as dw]
@@ -92,8 +92,7 @@
 
 (defn- make-page-ref
   [page-id]
-  (-> (l/in [:pages page-id])
+  (l/derived #(get-in % [:pages page-id]) st/state))
-      (l/derive st/state)))
 
 (mf/defc page-item-wrapper
   [{:keys [page-id index deletable? selected?] :as props}]

frontend/src/uxbox/main/ui/workspace/viewport.cljs

@@ -102,23 +102,12 @@
 ;; --- Viewport
 
 (declare remote-user-cursors)
-(declare frames)
-
-(mf/defc frames-wrapper
-  {::mf/wrap-props false}
-  [props]
-  (let [page     (unchecked-get props "page")
-        page-id  (:id page)
-        data-ref (-> (mf/deps page-id)
-                     (mf/use-memo #(-> (l/in [:workspace-data page-id])
-                                       (l/derive st/state))))
-        data (mf/deref data-ref)]
-    [:& frames {:data data}]))
 
 (mf/defc frames
   {:wrap [mf/memo]}
-  [{:keys [data] :as props}]
+  []
-  (let [objects (:objects data)
+  (let [data    (mf/deref refs/workspace-data)
+        objects (:objects data)
         root    (get objects uuid/zero)
         shapes  (->> (:shapes root)
                      (map #(get objects %)))]
@@ -304,7 +293,7 @@
                      :on-drop on-drop}
       [:g.zoom {:transform (str "scale(" zoom ", " zoom ")")}
        ;; [:& perf/profiler {:label "viewport-frames"}
-       [:& frames-wrapper {:page page}]
+       [:& frames]
 
        (when (seq selected)
          [:& selection-handlers {:selected selected