♻️ Moved outlines to viewport namespace

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

@@ -22,6 +22,7 @@
    [app.main.ui.workspace.viewport.gradients :as gradients]
    [app.main.ui.workspace.viewport.hooks :as hooks]
    [app.main.ui.workspace.viewport.interactions :as interactions]
+   [app.main.ui.workspace.viewport.outline :as outline]
    [app.main.ui.workspace.viewport.pixel-overlay :as pixel-overlay]
    [app.main.ui.workspace.viewport.presence :as presence]
    [app.main.ui.workspace.viewport.selection :as selection]
@@ -197,7 +198,7 @@
       [:g {:style {:pointer-events (if disable-events? "none" "auto")}}
 
        (when show-outlines?
-         [:& widgets/shape-outlines
+         [:& outline/shape-outlines
           {:objects objects
            :selected selected
            :hover (when (not= :frame (:type @hover))

frontend/src/app/main/ui/workspace/viewport/interactions.cljs

@@ -15,12 +15,13 @@
    [app.main.data.workspace :as dw]
    [app.main.refs :as refs]
    [app.main.store :as st]
-   [app.main.ui.workspace.shapes.outline :refer [outline]]
+   [app.main.ui.workspace.viewport.outline :refer [outline]]
    [app.util.data :as dt]
    [app.util.dom :as dom]
    [app.util.keyboard :as kbd]
    [cuerdas.core :as str]
-   [rumext.alpha :as mf]))
+   [rumext.alpha :as mf]
+   ))
 
 (defn- get-click-interaction
   [shape]

frontend/src/app/main/ui/workspace/viewport/outline.cljs

@@ -7,15 +7,16 @@
 ;;
 ;; Copyright (c) 2020 UXBOX Labs SL
 
-(ns app.main.ui.workspace.shapes.outline
+(ns app.main.ui.workspace.viewport.outline
   (:require
-   [rumext.alpha :as mf]
    [app.common.geom.shapes :as gsh]
-   [app.util.object :as obj]
-   [rumext.util :refer [map->obj]]
+   [app.common.pages :as cp]
    [app.main.refs :as refs]
-   [app.util.geom.path :as ugp]))
-
+   [app.util.geom.path :as ugp]
+   [app.util.object :as obj]
+   [clojure.set :as set]
+   [rumext.alpha :as mf]
+   [rumext.util :refer [map->obj]]))
 
 (mf/defc outline
   {::mf/wrap-props false}
@@ -60,3 +61,43 @@
                  :height height})]
 
     [:> outline-type (map->obj (merge common props))]))
+
+(mf/defc shape-outlines-render
+  {::mf/wrap-props false
+   ::mf/wrap [#(mf/memo' % (mf/check-props ["shapes" "zoom"]))]}
+  [props]
+  (let [shapes (obj/get props "shapes")
+        zoom (obj/get props "zoom")
+        color (if (or (> (count shapes) 1) (nil? (:shape-ref (first shapes))))
+                "#31EFB8" "#00E0FF")]
+    (for [shape shapes]
+      [:& outline {:key (str "outline-" (:id shape))
+                   :shape (gsh/transform-shape shape)
+                   :zoom zoom
+                   :color color}])))
+
+(mf/defc shape-outlines
+  {::mf/wrap-props false}
+  [props]
+  (let [selected  (or (obj/get props "selected") #{})
+        hover     (or (obj/get props "hover") #{})
+        objects   (obj/get props "objects")
+        edition   (obj/get props "edition")
+        zoom      (obj/get props "zoom")
+
+        transform (mf/deref refs/current-transform)
+
+        outlines-ids  (->> (set/union selected hover)
+                           (cp/clean-loops objects))
+
+        show-outline? (fn [shape] (and (not (:hidden shape))
+                                       (not (:blocked shape))))
+
+        shapes (->> outlines-ids
+                    (filter #(not= edition %))
+                    (map #(get objects %))
+                    (filterv show-outline?))]
+
+    [:g.outlines {:display (when (some? transform) "none")}
+     [:& shape-outlines-render {:shapes shapes
+                                :zoom zoom}]]))

frontend/src/app/main/ui/workspace/viewport/selection.cljs

@@ -23,7 +23,7 @@
    [app.main.ui.cursors :as cur]
    [app.main.ui.hooks :as hooks]
    [app.main.ui.measurements :as msr]
-   [app.main.ui.workspace.shapes.outline :refer [outline]]
+   [app.main.ui.workspace.viewport.outline :refer [outline]]
    [app.main.ui.workspace.shapes.path.editor :refer [path-editor]]
    [app.util.data :as d]
    [app.util.debug :refer [debug?]]

frontend/src/app/main/ui/workspace/viewport/widgets.cljs

@@ -17,39 +17,11 @@
    [app.main.store :as st]
    [app.main.streams :as ms]
    [app.main.ui.hooks :as hooks]
-   [app.main.ui.workspace.shapes.outline :refer [outline]]
    [app.main.ui.workspace.shapes.path.actions :refer [path-actions]]
    [app.util.dom :as dom]
-   [clojure.set :as set]
+   [app.util.object :as obj]
    [rumext.alpha :as mf]))
 
-(mf/defc shape-outlines
-  {::mf/wrap-props false}
-  [props]
-  (let [objects   (unchecked-get props "objects")
-        selected  (or (unchecked-get props "selected") #{})
-        hover     (or (unchecked-get props "hover") #{})
-        edition   (unchecked-get props "edition")
-        outline?  (set/union selected hover)
-        show-outline? (fn [shape] (and (not (:hidden shape))
-                                       (not (:blocked shape))
-                                       (not= edition (:id shape))
-                                       (outline? (:id shape))))
-
-        shapes    (cond->> (vals objects)
-                    show-outline?   (filter show-outline?))
-
-        transform (mf/deref refs/current-transform)
-        color (if (or (> (count shapes) 1) (nil? (:shape-ref (first shapes))))
-                "#31EFB8" "#00E0FF")]
-    (when (nil? transform)
-      [:g.outlines
-       (for [shape shapes]
-         [:& outline {:key (str "outline-" (:id shape))
-                      :shape (gsh/transform-shape shape)
-                      :color color}])])))
-
-
 (mf/defc pixel-grid
   [{:keys [vbox zoom]}]
   [:g.pixel-grid