mirror of
https://github.com/penpot/penpot.git
synced 2025-03-11 07:11:32 -05:00
💄 Replace some use-callback with shorter use-fn on sidebar/assets
This commit is contained in:
parent
0fc2442175
commit
fcbb95e8b6
2 changed files with 103 additions and 102 deletions
|
@ -25,6 +25,7 @@
|
||||||
- Newsletter Opt-in options for subscription categories [Taiga #3242](https://tree.taiga.io/project/penpot/us/3242)
|
- Newsletter Opt-in options for subscription categories [Taiga #3242](https://tree.taiga.io/project/penpot/us/3242)
|
||||||
- Print emails to console by default if smtp is disabled
|
- Print emails to console by default if smtp is disabled
|
||||||
- Add `email-verification` flag for enable/disable email verification
|
- Add `email-verification` flag for enable/disable email verification
|
||||||
|
- Make graphics thumbnails load lazy [Taiga #4252](https://tree.taiga.io/project/penpot/issue/4252)
|
||||||
|
|
||||||
### :bug: Bugs fixed
|
### :bug: Bugs fixed
|
||||||
|
|
||||||
|
|
|
@ -12,7 +12,7 @@
|
||||||
[app.common.pages.helpers :as cph]
|
[app.common.pages.helpers :as cph]
|
||||||
[app.common.spec :as us]
|
[app.common.spec :as us]
|
||||||
[app.common.text :as txt]
|
[app.common.text :as txt]
|
||||||
[app.config :as cfg]
|
[app.config :as cf]
|
||||||
[app.main.data.events :as ev]
|
[app.main.data.events :as ev]
|
||||||
[app.main.data.modal :as modal]
|
[app.main.data.modal :as modal]
|
||||||
[app.main.data.workspace :as dw]
|
[app.main.data.workspace :as dw]
|
||||||
|
@ -136,7 +136,7 @@
|
||||||
on-close #(modal/hide!)
|
on-close #(modal/hide!)
|
||||||
|
|
||||||
on-accept
|
on-accept
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps form)
|
(mf/deps form)
|
||||||
(fn [_]
|
(fn [_]
|
||||||
(let [asset-name (get-in @form [:clean-data :asset-name])]
|
(let [asset-name (get-in @form [:clean-data :asset-name])]
|
||||||
|
@ -248,8 +248,6 @@
|
||||||
(when (> num-selected 1)
|
(when (> num-selected 1)
|
||||||
(set-drag-image event item-ref num-selected))))
|
(set-drag-image event item-ref num-selected))))
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
(defn- on-drag-enter-asset-group
|
(defn- on-drag-enter-asset-group
|
||||||
[event dragging? prefix selected-assets-paths]
|
[event dragging? prefix selected-assets-paths]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
|
@ -328,7 +326,7 @@
|
||||||
menu-state (mf/use-state auto-pos-menu-state)
|
menu-state (mf/use-state auto-pos-menu-state)
|
||||||
|
|
||||||
on-fold-group
|
on-fold-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps file-id box path group-open?)
|
(mf/deps file-id box path group-open?)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
|
@ -337,12 +335,12 @@
|
||||||
path
|
path
|
||||||
(not group-open?)))))
|
(not group-open?)))))
|
||||||
on-context-menu
|
on-context-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(swap! menu-state #(open-auto-pos-menu % event))))
|
(swap! menu-state #(open-auto-pos-menu % event))))
|
||||||
|
|
||||||
on-close-menu
|
on-close-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
(swap! menu-state close-auto-pos-menu)))]
|
(swap! menu-state close-auto-pos-menu)))]
|
||||||
|
|
||||||
|
@ -373,12 +371,12 @@
|
||||||
dragging? (mf/use-state false)
|
dragging? (mf/use-state false)
|
||||||
|
|
||||||
unselect-all
|
unselect-all
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
(st/emit! (dw/unselect-all-assets))))
|
(st/emit! (dw/unselect-all-assets))))
|
||||||
|
|
||||||
on-component-click
|
on-component-click
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps component selected-components)
|
(mf/deps component selected-components)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
|
@ -391,29 +389,29 @@
|
||||||
(on-asset-click event (:id component) unselect-all)))))
|
(on-asset-click event (:id component) unselect-all)))))
|
||||||
|
|
||||||
on-drop
|
on-drop
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps component dragging? selected-components selected-components-full selected-components-paths)
|
(mf/deps component dragging? selected-components selected-components-full selected-components-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drop-asset event component dragging? selected-components selected-components-full
|
(on-drop-asset event component dragging? selected-components selected-components-full
|
||||||
selected-components-paths dwl/rename-component)))
|
selected-components-paths dwl/rename-component)))
|
||||||
|
|
||||||
on-drag-over
|
on-drag-over
|
||||||
(mf/use-callback #(dom/prevent-default %))
|
(mf/use-fn #(dom/prevent-default %))
|
||||||
|
|
||||||
on-drag-enter
|
on-drag-enter
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps component dragging? selected-components selected-components-paths)
|
(mf/deps component dragging? selected-components selected-components-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-enter-asset event component dragging? selected-components selected-components-paths)))
|
(on-drag-enter-asset event component dragging? selected-components selected-components-paths)))
|
||||||
|
|
||||||
on-drag-leave
|
on-drag-leave
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging?)
|
(mf/deps dragging?)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-leave-asset event dragging?)))
|
(on-drag-leave-asset event dragging?)))
|
||||||
|
|
||||||
on-component-drag-start
|
on-component-drag-start
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps component selected-components item-ref on-drag-start)
|
(mf/deps component selected-components item-ref on-drag-start)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-asset-drag-start event component selected-components item-ref :components on-drag-start)))]
|
(on-asset-drag-start event component selected-components item-ref :components on-drag-start)))]
|
||||||
|
@ -468,21 +466,21 @@
|
||||||
(map #(if (nil? %) "" %)))
|
(map #(if (nil? %) "" %)))
|
||||||
|
|
||||||
on-drag-enter
|
on-drag-enter
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging? prefix selected-components-paths)
|
(mf/deps dragging? prefix selected-components-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-enter-asset-group event dragging? prefix selected-components-paths)))
|
(on-drag-enter-asset-group event dragging? prefix selected-components-paths)))
|
||||||
|
|
||||||
on-drag-leave
|
on-drag-leave
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging?)
|
(mf/deps dragging?)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-leave-asset event dragging?)))
|
(on-drag-leave-asset event dragging?)))
|
||||||
|
|
||||||
on-drag-over (mf/use-callback #(dom/prevent-default %))
|
on-drag-over (mf/use-fn #(dom/prevent-default %))
|
||||||
|
|
||||||
on-drop
|
on-drop
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging? prefix selected-components-paths selected-components-full)
|
(mf/deps dragging? prefix selected-components-paths selected-components-full)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drop-asset-group event dragging? prefix selected-components-paths selected-components-full dwl/rename-component)))]
|
(on-drop-asset-group event dragging? prefix selected-components-paths selected-components-full dwl/rename-component)))]
|
||||||
|
@ -569,7 +567,7 @@
|
||||||
groups (group-assets components reverse-sort?)
|
groups (group-assets components reverse-sort?)
|
||||||
|
|
||||||
on-duplicate
|
on-duplicate
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps @state)
|
(mf/deps @state)
|
||||||
(fn []
|
(fn []
|
||||||
(if (empty? selected-components)
|
(if (empty? selected-components)
|
||||||
|
@ -580,7 +578,7 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))))
|
(st/emit! (dwu/commit-undo-transaction))))))
|
||||||
|
|
||||||
on-delete
|
on-delete
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps @state file-id multi-components? multi-assets?)
|
(mf/deps @state file-id multi-components? multi-assets?)
|
||||||
(fn []
|
(fn []
|
||||||
(if (or multi-components? multi-assets?)
|
(if (or multi-components? multi-assets?)
|
||||||
|
@ -591,25 +589,25 @@
|
||||||
(dwu/commit-undo-transaction)))))
|
(dwu/commit-undo-transaction)))))
|
||||||
|
|
||||||
on-rename
|
on-rename
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps @state)
|
(mf/deps @state)
|
||||||
(fn []
|
(fn []
|
||||||
(swap! state assoc :renaming (:component-id @state))))
|
(swap! state assoc :renaming (:component-id @state))))
|
||||||
|
|
||||||
do-rename
|
do-rename
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps @state)
|
(mf/deps @state)
|
||||||
(fn [new-name]
|
(fn [new-name]
|
||||||
(st/emit! (dwl/rename-component (:renaming @state) new-name))
|
(st/emit! (dwl/rename-component (:renaming @state) new-name))
|
||||||
(swap! state assoc :renaming nil)))
|
(swap! state assoc :renaming nil)))
|
||||||
|
|
||||||
cancel-rename
|
cancel-rename
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
(swap! state assoc :renaming nil)))
|
(swap! state assoc :renaming nil)))
|
||||||
|
|
||||||
on-context-menu
|
on-context-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps selected-components on-clear-selection)
|
(mf/deps selected-components on-clear-selection)
|
||||||
(fn [component-id]
|
(fn [component-id]
|
||||||
(fn [event]
|
(fn [event]
|
||||||
|
@ -620,12 +618,12 @@
|
||||||
(swap! menu-state #(open-auto-pos-menu % event))))))
|
(swap! menu-state #(open-auto-pos-menu % event))))))
|
||||||
|
|
||||||
on-close-menu
|
on-close-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
(swap! menu-state close-auto-pos-menu)))
|
(swap! menu-state close-auto-pos-menu)))
|
||||||
|
|
||||||
create-group
|
create-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps components selected-components on-clear-selection)
|
(mf/deps components selected-components on-clear-selection)
|
||||||
(fn [group-name]
|
(fn [group-name]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -641,7 +639,7 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
rename-group
|
rename-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps components)
|
(mf/deps components)
|
||||||
(fn [path last-path]
|
(fn [path last-path]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -655,14 +653,14 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
on-group
|
on-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps components selected-components)
|
(mf/deps components selected-components)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
(modal/show! :name-group-dialog {:accept create-group})))
|
(modal/show! :name-group-dialog {:accept create-group})))
|
||||||
|
|
||||||
on-rename-group
|
on-rename-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps components)
|
(mf/deps components)
|
||||||
(fn [event path last-path]
|
(fn [event path last-path]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
|
@ -671,7 +669,7 @@
|
||||||
:accept rename-group})))
|
:accept rename-group})))
|
||||||
|
|
||||||
on-ungroup
|
on-ungroup
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps components)
|
(mf/deps components)
|
||||||
(fn [path]
|
(fn [path]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -685,7 +683,7 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
on-drag-start
|
on-drag-start
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn [component event]
|
(fn [component event]
|
||||||
(dnd/set-data! event "penpot/component" {:file-id file-id
|
(dnd/set-data! event "penpot/component" {:file-id file-id
|
||||||
:component component})
|
:component component})
|
||||||
|
@ -737,31 +735,33 @@
|
||||||
dragging? (mf/use-state false)
|
dragging? (mf/use-state false)
|
||||||
|
|
||||||
on-drop
|
on-drop
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps object dragging? selected-objects selected-graphics-full selected-graphics-paths)
|
(mf/deps object dragging? selected-objects selected-graphics-full selected-graphics-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drop-asset event object dragging? selected-objects selected-graphics-full
|
(on-drop-asset event object dragging? selected-objects selected-graphics-full
|
||||||
selected-graphics-paths dwl/rename-media)))
|
selected-graphics-paths dwl/rename-media)))
|
||||||
|
|
||||||
on-drag-over (mf/use-callback #(dom/prevent-default %))
|
on-drag-over (mf/use-fn #(dom/prevent-default %))
|
||||||
|
|
||||||
on-drag-enter
|
on-drag-enter
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps object dragging? selected-objects selected-graphics-paths)
|
(mf/deps object dragging? selected-objects selected-graphics-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-enter-asset event object dragging? selected-objects selected-graphics-paths)))
|
(on-drag-enter-asset event object dragging? selected-objects selected-graphics-paths)))
|
||||||
|
|
||||||
on-drag-leave
|
on-drag-leave
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging?)
|
(mf/deps dragging?)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-leave-asset event dragging?)))
|
(on-drag-leave-asset event dragging?)))
|
||||||
|
|
||||||
on-grahic-drag-start
|
on-grahic-drag-start
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps object selected-objects item-ref on-drag-start)
|
(mf/deps object selected-objects item-ref on-drag-start)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-asset-drag-start event object selected-objects item-ref :graphics on-drag-start)))]
|
(on-asset-drag-start event object selected-objects item-ref :graphics on-drag-start)))
|
||||||
|
|
||||||
|
]
|
||||||
|
|
||||||
[:div {:ref item-ref
|
[:div {:ref item-ref
|
||||||
:class-name (dom/classnames
|
:class-name (dom/classnames
|
||||||
|
@ -816,21 +816,21 @@
|
||||||
|
|
||||||
|
|
||||||
on-drag-enter
|
on-drag-enter
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging? prefix selected-graphics-paths)
|
(mf/deps dragging? prefix selected-graphics-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-enter-asset-group event dragging? prefix selected-graphics-paths)))
|
(on-drag-enter-asset-group event dragging? prefix selected-graphics-paths)))
|
||||||
|
|
||||||
on-drag-leave
|
on-drag-leave
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging?)
|
(mf/deps dragging?)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-leave-asset event dragging?)))
|
(on-drag-leave-asset event dragging?)))
|
||||||
|
|
||||||
on-drag-over (mf/use-callback #(dom/prevent-default %))
|
on-drag-over (mf/use-fn #(dom/prevent-default %))
|
||||||
|
|
||||||
on-drop
|
on-drop
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging? prefix selected-graphics-paths selected-graphics-full)
|
(mf/deps dragging? prefix selected-graphics-paths selected-graphics-full)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drop-asset-group event dragging? prefix selected-graphics-paths selected-graphics-full dwl/rename-media)))]
|
(on-drop-asset-group event dragging? prefix selected-graphics-paths selected-graphics-full dwl/rename-media)))]
|
||||||
|
@ -920,13 +920,13 @@
|
||||||
groups (group-assets objects reverse-sort?)
|
groups (group-assets objects reverse-sort?)
|
||||||
|
|
||||||
add-graphic
|
add-graphic
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
#(st/emit! (dwl/set-assets-box-open file-id :graphics true))
|
#(st/emit! (dwl/set-assets-box-open file-id :graphics true))
|
||||||
(dom/click (mf/ref-val input-ref))))
|
(dom/click (mf/ref-val input-ref))))
|
||||||
|
|
||||||
on-file-selected
|
on-file-selected
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps file-id)
|
(mf/deps file-id)
|
||||||
(fn [blobs]
|
(fn [blobs]
|
||||||
(let [params {:file-id file-id
|
(let [params {:file-id file-id
|
||||||
|
@ -936,7 +936,7 @@
|
||||||
:asset-type "graphics"})))))
|
:asset-type "graphics"})))))
|
||||||
|
|
||||||
on-delete
|
on-delete
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps @state multi-objects? multi-assets?)
|
(mf/deps @state multi-objects? multi-assets?)
|
||||||
(fn []
|
(fn []
|
||||||
(if (or multi-objects? multi-assets?)
|
(if (or multi-objects? multi-assets?)
|
||||||
|
@ -944,25 +944,25 @@
|
||||||
(st/emit! (dwl/delete-media {:id (:object-id @state)})))))
|
(st/emit! (dwl/delete-media {:id (:object-id @state)})))))
|
||||||
|
|
||||||
on-rename
|
on-rename
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps @state)
|
(mf/deps @state)
|
||||||
(fn []
|
(fn []
|
||||||
(swap! state assoc :renaming (:object-id @state))))
|
(swap! state assoc :renaming (:object-id @state))))
|
||||||
|
|
||||||
cancel-rename
|
cancel-rename
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
(swap! state assoc :renaming nil)))
|
(swap! state assoc :renaming nil)))
|
||||||
|
|
||||||
do-rename
|
do-rename
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps @state)
|
(mf/deps @state)
|
||||||
(fn [new-name]
|
(fn [new-name]
|
||||||
(st/emit! (dwl/rename-media (:renaming @state) new-name))
|
(st/emit! (dwl/rename-media (:renaming @state) new-name))
|
||||||
(swap! state assoc :renaming nil)))
|
(swap! state assoc :renaming nil)))
|
||||||
|
|
||||||
on-context-menu
|
on-context-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps selected-objects on-clear-selection)
|
(mf/deps selected-objects on-clear-selection)
|
||||||
(fn [object-id]
|
(fn [object-id]
|
||||||
(fn [event]
|
(fn [event]
|
||||||
|
@ -973,12 +973,12 @@
|
||||||
(swap! menu-state #(open-auto-pos-menu % event))))))
|
(swap! menu-state #(open-auto-pos-menu % event))))))
|
||||||
|
|
||||||
on-close-menu
|
on-close-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
(swap! menu-state close-auto-pos-menu)))
|
(swap! menu-state close-auto-pos-menu)))
|
||||||
|
|
||||||
create-group
|
create-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps objects selected-objects on-clear-selection)
|
(mf/deps objects selected-objects on-clear-selection)
|
||||||
(fn [group-name]
|
(fn [group-name]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -994,7 +994,7 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
rename-group
|
rename-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps objects)
|
(mf/deps objects)
|
||||||
(fn [path last-path]
|
(fn [path last-path]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -1008,14 +1008,14 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
on-group
|
on-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps objects selected-objects)
|
(mf/deps objects selected-objects)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
(modal/show! :name-group-dialog {:accept create-group})))
|
(modal/show! :name-group-dialog {:accept create-group})))
|
||||||
|
|
||||||
on-rename-group
|
on-rename-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps objects)
|
(mf/deps objects)
|
||||||
(fn [event path last-path]
|
(fn [event path last-path]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
|
@ -1023,7 +1023,7 @@
|
||||||
:last-path last-path
|
:last-path last-path
|
||||||
:accept rename-group})))
|
:accept rename-group})))
|
||||||
on-ungroup
|
on-ungroup
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps objects)
|
(mf/deps objects)
|
||||||
(fn [path]
|
(fn [path]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -1037,7 +1037,7 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
on-drag-start
|
on-drag-start
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn [{:keys [name id mtype]} event]
|
(fn [{:keys [name id mtype]} event]
|
||||||
(dnd/set-data! event "text/asset-id" (str id))
|
(dnd/set-data! event "text/asset-id" (str id))
|
||||||
(dnd/set-data! event "text/asset-name" name)
|
(dnd/set-data! event "text/asset-name" name)
|
||||||
|
@ -1136,7 +1136,7 @@
|
||||||
(st/emit! (dwl/update-color updated-color file-id))))
|
(st/emit! (dwl/update-color updated-color file-id))))
|
||||||
|
|
||||||
delete-color
|
delete-color
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps @state multi-colors? multi-assets? file-id)
|
(mf/deps @state multi-colors? multi-assets? file-id)
|
||||||
(fn []
|
(fn []
|
||||||
(if (or multi-colors? multi-assets?)
|
(if (or multi-colors? multi-assets?)
|
||||||
|
@ -1178,7 +1178,7 @@
|
||||||
:position :right}))
|
:position :right}))
|
||||||
|
|
||||||
on-context-menu
|
on-context-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps color selected-colors on-clear-selection)
|
(mf/deps color selected-colors on-clear-selection)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(when local?
|
(when local?
|
||||||
|
@ -1187,32 +1187,32 @@
|
||||||
(swap! menu-state #(open-auto-pos-menu % event)))))
|
(swap! menu-state #(open-auto-pos-menu % event)))))
|
||||||
|
|
||||||
on-close-menu
|
on-close-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
(swap! menu-state close-auto-pos-menu)))
|
(swap! menu-state close-auto-pos-menu)))
|
||||||
on-drop
|
on-drop
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps color dragging? selected-colors selected-colors-full selected-colors-paths move-color)
|
(mf/deps color dragging? selected-colors selected-colors-full selected-colors-paths move-color)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drop-asset event color dragging? selected-colors selected-colors-full
|
(on-drop-asset event color dragging? selected-colors selected-colors-full
|
||||||
selected-colors-paths move-color)))
|
selected-colors-paths move-color)))
|
||||||
|
|
||||||
on-drag-over (mf/use-callback #(dom/prevent-default %))
|
on-drag-over (mf/use-fn #(dom/prevent-default %))
|
||||||
|
|
||||||
on-drag-enter
|
on-drag-enter
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps color dragging? selected-colors selected-colors-paths)
|
(mf/deps color dragging? selected-colors selected-colors-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-enter-asset event color dragging? selected-colors selected-colors-paths)))
|
(on-drag-enter-asset event color dragging? selected-colors selected-colors-paths)))
|
||||||
|
|
||||||
on-drag-leave
|
on-drag-leave
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging?)
|
(mf/deps dragging?)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-leave-asset event dragging?)))
|
(on-drag-leave-asset event dragging?)))
|
||||||
|
|
||||||
on-color-drag-start
|
on-color-drag-start
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps color selected-colors item-ref)
|
(mf/deps color selected-colors item-ref)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-asset-drag-start event color selected-colors item-ref :colors identity)))]
|
(on-asset-drag-start event color selected-colors item-ref :colors identity)))]
|
||||||
|
@ -1282,20 +1282,20 @@
|
||||||
move-color (partial dwl/rename-color file-id)
|
move-color (partial dwl/rename-color file-id)
|
||||||
|
|
||||||
on-drag-enter
|
on-drag-enter
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging? prefix selected-colors-paths)
|
(mf/deps dragging? prefix selected-colors-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-enter-asset-group event dragging? prefix selected-colors-paths)))
|
(on-drag-enter-asset-group event dragging? prefix selected-colors-paths)))
|
||||||
|
|
||||||
on-drag-leave (mf/use-callback
|
on-drag-leave (mf/use-fn
|
||||||
(mf/deps dragging?)
|
(mf/deps dragging?)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-leave-asset event dragging?)))
|
(on-drag-leave-asset event dragging?)))
|
||||||
|
|
||||||
on-drag-over (mf/use-callback #(dom/prevent-default %))
|
on-drag-over (mf/use-fn #(dom/prevent-default %))
|
||||||
|
|
||||||
on-drop
|
on-drop
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging? prefix selected-colors-paths selected-colors-full move-color)
|
(mf/deps dragging? prefix selected-colors-paths selected-colors-full move-color)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drop-asset-group event dragging? prefix selected-colors-paths selected-colors-full move-color)))]
|
(on-drop-asset-group event dragging? prefix selected-colors-paths selected-colors-full move-color)))]
|
||||||
|
@ -1376,13 +1376,13 @@
|
||||||
groups (group-assets colors reverse-sort?)
|
groups (group-assets colors reverse-sort?)
|
||||||
|
|
||||||
add-color
|
add-color
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps file-id)
|
(mf/deps file-id)
|
||||||
(fn [value _opacity]
|
(fn [value _opacity]
|
||||||
(st/emit! (dwl/add-color value))))
|
(st/emit! (dwl/add-color value))))
|
||||||
|
|
||||||
add-color-clicked
|
add-color-clicked
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps file-id)
|
(mf/deps file-id)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(st/emit! (dwl/set-assets-box-open file-id :colors true)
|
(st/emit! (dwl/set-assets-box-open file-id :colors true)
|
||||||
|
@ -1397,7 +1397,7 @@
|
||||||
:position :right})))
|
:position :right})))
|
||||||
|
|
||||||
create-group
|
create-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps colors selected-colors on-clear-selection file-id)
|
(mf/deps colors selected-colors on-clear-selection file-id)
|
||||||
(fn [color-id]
|
(fn [color-id]
|
||||||
(fn [group-name]
|
(fn [group-name]
|
||||||
|
@ -1415,7 +1415,7 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction)))))
|
(st/emit! (dwu/commit-undo-transaction)))))
|
||||||
|
|
||||||
rename-group
|
rename-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps colors)
|
(mf/deps colors)
|
||||||
(fn [path last-path]
|
(fn [path last-path]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -1430,7 +1430,7 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
on-group
|
on-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps colors selected-colors)
|
(mf/deps colors selected-colors)
|
||||||
(fn [color-id]
|
(fn [color-id]
|
||||||
(fn [event]
|
(fn [event]
|
||||||
|
@ -1438,7 +1438,7 @@
|
||||||
(modal/show! :name-group-dialog {:accept (create-group color-id)}))))
|
(modal/show! :name-group-dialog {:accept (create-group color-id)}))))
|
||||||
|
|
||||||
on-rename-group
|
on-rename-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps colors)
|
(mf/deps colors)
|
||||||
(fn [event path last-path]
|
(fn [event path last-path]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
|
@ -1446,7 +1446,7 @@
|
||||||
:last-path last-path
|
:last-path last-path
|
||||||
:accept rename-group})))
|
:accept rename-group})))
|
||||||
on-ungroup
|
on-ungroup
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps colors)
|
(mf/deps colors)
|
||||||
(fn [path]
|
(fn [path]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -1497,28 +1497,28 @@
|
||||||
(let [item-ref (mf/use-ref)
|
(let [item-ref (mf/use-ref)
|
||||||
dragging? (mf/use-state false)
|
dragging? (mf/use-state false)
|
||||||
on-drop
|
on-drop
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps typography dragging? selected-typographies selected-typographies-full selected-typographies-paths move-typography)
|
(mf/deps typography dragging? selected-typographies selected-typographies-full selected-typographies-paths move-typography)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drop-asset event typography dragging? selected-typographies selected-typographies-full
|
(on-drop-asset event typography dragging? selected-typographies selected-typographies-full
|
||||||
selected-typographies-paths move-typography)))
|
selected-typographies-paths move-typography)))
|
||||||
|
|
||||||
on-drag-over (mf/use-callback #(dom/prevent-default %))
|
on-drag-over (mf/use-fn #(dom/prevent-default %))
|
||||||
|
|
||||||
on-drag-enter
|
on-drag-enter
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps typography dragging? selected-typographies selected-typographies-paths)
|
(mf/deps typography dragging? selected-typographies selected-typographies-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-enter-asset event typography dragging? selected-typographies selected-typographies-paths)))
|
(on-drag-enter-asset event typography dragging? selected-typographies selected-typographies-paths)))
|
||||||
|
|
||||||
on-drag-leave
|
on-drag-leave
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging?)
|
(mf/deps dragging?)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-leave-asset event dragging?)))
|
(on-drag-leave-asset event dragging?)))
|
||||||
|
|
||||||
on-typography-drag-start
|
on-typography-drag-start
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps typography selected-typographies item-ref)
|
(mf/deps typography selected-typographies item-ref)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-asset-drag-start event typography selected-typographies item-ref :typographies identity)))]
|
(on-asset-drag-start event typography selected-typographies item-ref :typographies identity)))]
|
||||||
|
@ -1559,21 +1559,21 @@
|
||||||
move-typography (partial dwl/rename-typography file-id)
|
move-typography (partial dwl/rename-typography file-id)
|
||||||
|
|
||||||
on-drag-enter
|
on-drag-enter
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging? prefix selected-typographies-paths)
|
(mf/deps dragging? prefix selected-typographies-paths)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-enter-asset-group event dragging? prefix selected-typographies-paths)))
|
(on-drag-enter-asset-group event dragging? prefix selected-typographies-paths)))
|
||||||
|
|
||||||
on-drag-leave
|
on-drag-leave
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging?)
|
(mf/deps dragging?)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drag-leave-asset event dragging?)))
|
(on-drag-leave-asset event dragging?)))
|
||||||
|
|
||||||
on-drag-over (mf/use-callback #(dom/prevent-default %))
|
on-drag-over (mf/use-fn #(dom/prevent-default %))
|
||||||
|
|
||||||
on-drop
|
on-drop
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps dragging? prefix selected-typographies-paths selected-typographies-full move-typography)
|
(mf/deps dragging? prefix selected-typographies-paths selected-typographies-full move-typography)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(on-drop-asset-group event dragging? prefix selected-typographies-paths selected-typographies-full move-typography)))]
|
(on-drop-asset-group event dragging? prefix selected-typographies-paths selected-typographies-full move-typography)))]
|
||||||
|
@ -1658,7 +1658,7 @@
|
||||||
(seq (:colors selected-assets)))
|
(seq (:colors selected-assets)))
|
||||||
|
|
||||||
add-typography
|
add-typography
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps file-id)
|
(mf/deps file-id)
|
||||||
(fn [_]
|
(fn [_]
|
||||||
(st/emit! (dwl/add-typography txt/default-typography)
|
(st/emit! (dwl/add-typography txt/default-typography)
|
||||||
|
@ -1666,7 +1666,7 @@
|
||||||
:asset-type "typography"}))))
|
:asset-type "typography"}))))
|
||||||
|
|
||||||
handle-change
|
handle-change
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps file-id)
|
(mf/deps file-id)
|
||||||
(fn [typography changes]
|
(fn [typography changes]
|
||||||
(st/emit! (dwl/update-typography (merge typography changes) file-id))))
|
(st/emit! (dwl/update-typography (merge typography changes) file-id))))
|
||||||
|
@ -1686,7 +1686,7 @@
|
||||||
ids)))
|
ids)))
|
||||||
|
|
||||||
create-group
|
create-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps typographies selected-typographies on-clear-selection file-id)
|
(mf/deps typographies selected-typographies on-clear-selection file-id)
|
||||||
(fn [group-name]
|
(fn [group-name]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -1703,7 +1703,7 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
rename-group
|
rename-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps typographies)
|
(mf/deps typographies)
|
||||||
(fn [path last-path]
|
(fn [path last-path]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -1718,14 +1718,14 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
on-group
|
on-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps typographies selected-typographies)
|
(mf/deps typographies selected-typographies)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
(modal/show! :name-group-dialog {:accept create-group})))
|
(modal/show! :name-group-dialog {:accept create-group})))
|
||||||
|
|
||||||
on-rename-group
|
on-rename-group
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps typographies)
|
(mf/deps typographies)
|
||||||
(fn [event path last-path]
|
(fn [event path last-path]
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
|
@ -1733,7 +1733,7 @@
|
||||||
:last-path last-path
|
:last-path last-path
|
||||||
:accept rename-group})))
|
:accept rename-group})))
|
||||||
on-ungroup
|
on-ungroup
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps typographies)
|
(mf/deps typographies)
|
||||||
(fn [path]
|
(fn [path]
|
||||||
(on-clear-selection)
|
(on-clear-selection)
|
||||||
|
@ -1748,7 +1748,7 @@
|
||||||
(st/emit! (dwu/commit-undo-transaction))))
|
(st/emit! (dwu/commit-undo-transaction))))
|
||||||
|
|
||||||
on-context-menu
|
on-context-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps selected-typographies on-clear-selection)
|
(mf/deps selected-typographies on-clear-selection)
|
||||||
(fn [id event]
|
(fn [id event]
|
||||||
(when local?
|
(when local?
|
||||||
|
@ -1758,7 +1758,7 @@
|
||||||
(swap! menu-state #(open-auto-pos-menu % event)))))
|
(swap! menu-state #(open-auto-pos-menu % event)))))
|
||||||
|
|
||||||
on-close-menu
|
on-close-menu
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
(swap! menu-state close-auto-pos-menu)))
|
(swap! menu-state close-auto-pos-menu)))
|
||||||
|
|
||||||
|
@ -1771,7 +1771,7 @@
|
||||||
(st/emit! #(assoc-in % [:workspace-global :edit-typography] (:id @state))))
|
(st/emit! #(assoc-in % [:workspace-global :edit-typography] (:id @state))))
|
||||||
|
|
||||||
handle-delete-typography
|
handle-delete-typography
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps @state multi-typographies? multi-assets?)
|
(mf/deps @state multi-typographies? multi-assets?)
|
||||||
(fn []
|
(fn []
|
||||||
(if (or multi-typographies? multi-assets?)
|
(if (or multi-typographies? multi-assets?)
|
||||||
|
@ -1941,17 +1941,17 @@
|
||||||
components (apply-filters (mf/deref components-ref) filters @reverse-sort?)
|
components (apply-filters (mf/deref components-ref) filters @reverse-sort?)
|
||||||
|
|
||||||
toggle-sort
|
toggle-sort
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn [_]
|
(fn [_]
|
||||||
(swap! reverse-sort? not)))
|
(swap! reverse-sort? not)))
|
||||||
|
|
||||||
toggle-listing
|
toggle-listing
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn [_]
|
(fn [_]
|
||||||
(swap! listing-thumbs? not)))
|
(swap! listing-thumbs? not)))
|
||||||
|
|
||||||
extend-selected-assets
|
extend-selected-assets
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps selected-assets)
|
(mf/deps selected-assets)
|
||||||
(fn [asset-type asset-groups asset-id]
|
(fn [asset-type asset-groups asset-id]
|
||||||
(letfn [(flatten-groups
|
(letfn [(flatten-groups
|
||||||
|
@ -1982,12 +1982,12 @@
|
||||||
(st/emit! (dw/select-assets values asset-type))))))))
|
(st/emit! (dw/select-assets values asset-type))))))))
|
||||||
|
|
||||||
unselect-all
|
unselect-all
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(fn []
|
(fn []
|
||||||
(st/emit! (dw/unselect-all-assets))))
|
(st/emit! (dw/unselect-all-assets))))
|
||||||
|
|
||||||
on-asset-click
|
on-asset-click
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps selected-assets)
|
(mf/deps selected-assets)
|
||||||
(fn [asset-type asset-groups event asset-id default-click]
|
(fn [asset-type asset-groups event asset-id default-click]
|
||||||
(cond
|
(cond
|
||||||
|
@ -2006,7 +2006,7 @@
|
||||||
(default-click event)))))
|
(default-click event)))))
|
||||||
|
|
||||||
on-assets-delete
|
on-assets-delete
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps selected-assets)
|
(mf/deps selected-assets)
|
||||||
(fn []
|
(fn []
|
||||||
(st/emit! (dwu/start-undo-transaction))
|
(st/emit! (dwu/start-undo-transaction))
|
||||||
|
@ -2141,20 +2141,20 @@
|
||||||
filters (mf/use-state {:term "" :box :all})
|
filters (mf/use-state {:term "" :box :all})
|
||||||
|
|
||||||
on-search-term-change
|
on-search-term-change
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps team-id)
|
(mf/deps team-id)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(let [value (dom/get-target-val event)]
|
(let [value (dom/get-target-val event)]
|
||||||
(swap! filters assoc :term value))))
|
(swap! filters assoc :term value))))
|
||||||
|
|
||||||
on-search-clear-click
|
on-search-clear-click
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps team-id)
|
(mf/deps team-id)
|
||||||
(fn [_]
|
(fn [_]
|
||||||
(swap! filters assoc :term "")))
|
(swap! filters assoc :term "")))
|
||||||
|
|
||||||
on-box-filter-change
|
on-box-filter-change
|
||||||
(mf/use-callback
|
(mf/use-fn
|
||||||
(mf/deps team-id)
|
(mf/deps team-id)
|
||||||
(fn [event]
|
(fn [event]
|
||||||
(let [value (-> (dom/get-target event)
|
(let [value (-> (dom/get-target event)
|
||||||
|
|
Loading…
Add table
Reference in a new issue