Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-11 01:10:28 -05:00
Code Issues Activity

🎉 Add hooks and memoization to group components.

Browse source
This commit is contained in:
Andrey Antukh 2020-04-10 17:25:23 +02:00 committed by Alonso Torres
parent 0b4365b3c3
commit 39807186df
1 changed files with 62 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

60
frontend/src/uxbox/main/ui/shapes/group.cljs
View file

@ -2,7 +2,10 @@
;; License, v. 2.0. If a copy of the MPL was not distributed with this ;; 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/. ;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
;; ;;
;; Copyright (c) 2016-2019 Andrey Antukh <niwi@niwi.nz> ;; This Source Code Form is "Incompatible With Secondary Licenses", as
;; defined by the Mozilla Public License, v. 2.0.
;;
;; Copyright (c) 2020 UXBOX Labs SL
(ns uxbox.main.ui.shapes.group (ns uxbox.main.ui.shapes.group
(:require (:require
@ -20,36 +23,62 @@
(defonce ^:dynamic *debug* (atom false)) (defonce ^:dynamic *debug* (atom false))
(defn- equals?
[np op]
(let [n-shape (unchecked-get np "shape")
o-shape (unchecked-get op "shape")
n-frame (unchecked-get np "frame")
o-frame (unchecked-get op "frame")]
(and (= n-frame o-frame)
(= n-shape o-shape))))
(declare translate-to-frame) (declare translate-to-frame)
(declare group-shape) (declare group-shape)
(defn group-wrapper [shape-wrapper] (defn group-wrapper
[shape-wrapper]
(let [group-shape (group-shape shape-wrapper)]
(mf/fnc group-wrapper (mf/fnc group-wrapper
{::mf/wrap-props false} {::mf/wrap [#(mf/memo' % equals?)]
::mf/wrap-props false}
[props] [props]
(let [shape (unchecked-get props "shape") (let [shape (unchecked-get props "shape")
frame (unchecked-get props "frame") frame (unchecked-get props "frame")
on-mouse-down #(common/on-mouse-down % shape) on-mouse-down (mf/use-callback (mf/deps shape)
on-context-menu #(common/on-context-menu % shape) #(common/on-mouse-down % shape))
children (-> (refs/objects-by-id (:shapes shape)) mf/deref) on-context-menu (mf/use-callback (mf/deps shape)
is-child-selected? (-> (refs/is-child-selected? (:id shape)) mf/deref) #(common/on-context-menu % shape))
children-ref (mf/use-memo (mf/deps shape)
#(refs/objects-by-id (:shapes shape)))
children (mf/deref children-ref)
is-child-selected-ref (mf/use-memo (mf/deps (:id shape))
#(refs/is-child-selected? (:id shape)))
is-child-selected? (mf/deref is-child-selected-ref)
on-double-click on-double-click
(mf/use-callback
(mf/deps (:id shape))
(fn [event] (fn [event]
(dom/stop-propagation event) (dom/stop-propagation event)
(dom/prevent-default event) (dom/prevent-default event)
(st/emit! (dw/select-inside-group (st/emit! (dw/select-inside-group (:id shape) @ms/mouse-position))))]
(:id shape)
@ms/mouse-position)))]
[:g.shape {:on-mouse-down on-mouse-down [:g.shape
{:on-mouse-down on-mouse-down
:on-context-menu on-context-menu :on-context-menu on-context-menu
:on-double-click on-double-click} :on-double-click on-double-click}
[:& (group-shape shape-wrapper) {:frame frame
[:& group-shape
{:frame frame
:shape (geom/transform-shape frame shape) :shape (geom/transform-shape frame shape)
:children children :children children
:is-child-selected? is-child-selected?}]]))) :is-child-selected? is-child-selected?}]]))))
(defn group-shape [shape-wrapper] (defn group-shape
[shape-wrapper]
(mf/fnc group-shape (mf/fnc group-shape
{::mf/wrap-props false} {::mf/wrap-props false}
[props] [props]
@ -68,7 +97,8 @@
(+ y (/ height 2))))] (+ y (/ height 2))))]
[:g {:transform transform} [:g {:transform transform}
(for [item children] (for [item children]
[:& shape-wrapper {:frame frame [:& shape-wrapper
{:frame frame
:shape (cond-> item :shape (cond-> item
displacement-modifier (assoc :displacement-modifier displacement-modifier) displacement-modifier (assoc :displacement-modifier displacement-modifier)
resize-modifier (assoc :resize-modifier resize-modifier)) resize-modifier (assoc :resize-modifier resize-modifier))