Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-08 07:50:43 -05:00
Code Issues Activity

⚡ Add efficiency improvements to use-resize-hook

Browse source
This commit is contained in:
Andrey Antukh 2024-09-04 14:23:30 +02:00
parent 9619fcbc1f
commit b2c0bed84c
1 changed files with 35 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
frontend/src/app/main/ui/hooks/resize.cljs
View file

@ -6,6 +6,7 @@
(ns app.main.ui.hooks.resize
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.geom.point :as gpt]
[app.common.logging :as log]
@ -20,6 +21,15 @@
(def last-resize-type nil)
(defn- get-initial-state
[initial file-id key]
(let [saved (dm/get-in @storage [::state file-id key])]
(d/nilv saved initial)))
(defn- update-persistent-state
[data file-id key size]
(update-in data [::state file-id] assoc key size))
(defn set-resize-type! [type]
(set! last-resize-type type))
@ -28,26 +38,28 @@
(use-resize-hook key initial min-val max-val axis negate? resize-type nil))
([key initial min-val max-val axis negate? resize-type on-change-size]
(let [current-file-id (mf/use-ctx ctx/current-file-id)
size-state (mf/use-state (or (get-in @storage [::saved-resize current-file-id key]) initial))
parent-ref (mf/use-ref nil)
(let [file-id (mf/use-ctx ctx/current-file-id)
dragging-ref (mf/use-ref false)
current-size* (mf/use-state #(get-initial-state initial file-id key))
current-size (deref current-size*)
parent-ref (mf/use-ref nil)
dragging-ref (mf/use-ref false)
start-size-ref (mf/use-ref nil)
start-ref (mf/use-ref nil)
start-ref (mf/use-ref nil)
on-pointer-down
(mf/use-callback
(mf/deps @size-state)
(mf/use-fn
(mf/deps current-size)
(fn [event]
(dom/capture-pointer event)
(mf/set-ref-val! start-size-ref @size-state)
(mf/set-ref-val! start-size-ref current-size)
(mf/set-ref-val! dragging-ref true)
(mf/set-ref-val! start-ref (dom/get-client-position event))
(set! last-resize-type resize-type)))
on-lost-pointer-capture
(mf/use-callback
(mf/use-fn
(fn [event]
(dom/release-pointer event)
(mf/set-ref-val! start-size-ref nil)
@ -56,40 +68,39 @@
(set! last-resize-type nil)))
on-pointer-move
(mf/use-callback
(mf/deps min-val max-val negate?)
(mf/use-fn
(mf/deps min-val max-val negate? file-id key)
(fn [event]
(when (mf/ref-val dragging-ref)
(let [start (mf/ref-val start-ref)
pos (dom/get-client-position event)
pos (dom/get-client-position event)
delta (-> (gpt/to-vec start pos)
(cond-> negate? gpt/negate)
(get axis))
start-size (mf/ref-val start-size-ref)
new-size (-> (+ start-size delta) (max min-val) (min max-val))]
(reset! size-state new-size)
(swap! storage assoc-in [::saved-resize current-file-id key] new-size)
(when on-change-size (on-change-size new-size))))))
(reset! current-size* new-size)
(swap! storage update-persistent-state file-id key new-size)))))
set-size
(mf/use-callback
(mf/deps on-change-size)
(mf/use-fn
(mf/deps on-change-size file-id key)
(fn [new-size]
(let [new-size (mth/clamp new-size min-val max-val)]
(reset! size-state new-size)
(swap! storage assoc-in [::saved-resize current-file-id key] new-size)
(when on-change-size (on-change-size new-size)))))]
(reset! current-size* new-size)
(swap! storage update-persistent-state file-id key new-size))))]
(mf/use-effect
(fn []
(when on-change-size (on-change-size @size-state))))
(mf/with-effect [on-change-size current-size]
(when on-change-size
(on-change-size current-size)))
{:on-pointer-down on-pointer-down
:on-lost-pointer-capture on-lost-pointer-capture
:on-pointer-move on-pointer-move
:parent-ref parent-ref
:set-size set-size
:size @size-state})))
:size current-size})))
(defn use-resize-observer
[callback]