3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-07-08 16:37:20 +02:00
Code Issues Projects Releases Packages Wiki Activity

⚡ Add minor performance improvements to workspace main components

Browse source
This commit is contained in:
Andrey Antukh 2023-05-15 14:11:23 +02:00 • committed by Alejandro Alonso
parent bdb0e24c40
commit ca439cf604
1 changed files with 38 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

65
frontend/src/app/main/ui/workspace.cljs
View file

@ -5,7 +5,6 @@
;; Copyright (c) KALEIDOS INC ;; Copyright (c) KALEIDOS INC
(ns app.main.ui.workspace (ns app.main.ui.workspace
(:import goog.events.EventType)
(:require (:require
[app.common.data.macros :as dm] [app.common.data.macros :as dm]
[app.main.data.messages :as msg] [app.main.data.messages :as msg]
@ -101,22 +100,26 @@
:selected selected :selected selected
:layout layout}]])])) :layout layout}]])]))
(def trimmed-page-ref (l/derived :workspace-trimmed-page st/state =)) (def ^:private ref:page-loaded
(l/derived
(fn [state]
(some? (:workspace-trimmed-page state)))
st/state))
(mf/defc workspace-page (mf/defc workspace-page
[{:keys [file layout page-id wglobal] :as props}] {::mf/wrap-props false}
[{:keys [file layout page-id wglobal]}]
(let [prev-page-id (hooks/use-previous page-id)
page-loaded? (mf/deref ref:page-loaded)]
(let [prev-page-id (hooks/use-previous page-id)] (mf/with-effect [page-id prev-page-id]
(mf/with-effect
[page-id]
(when (and prev-page-id (not= prev-page-id page-id)) (when (and prev-page-id (not= prev-page-id page-id))
(st/emit! (dw/finalize-page prev-page-id))) (st/emit! (dw/finalize-page prev-page-id)))
(if (nil? page-id) (if (nil? page-id)
(st/emit! (dw/go-to-page)) (st/emit! (dw/go-to-page))
(st/emit! (dw/initialize-page page-id)))) (st/emit! (dw/initialize-page page-id))))
(when (mf/deref trimmed-page-ref) (when ^boolean page-loaded?
[:& workspace-content {:page-id page-id [:& workspace-content {:page-id page-id
:file file :file file
:wglobal wglobal :wglobal wglobal
@ -128,31 +131,28 @@
i/loader-pencil]) i/loader-pencil])
(mf/defc workspace (mf/defc workspace
{::mf/wrap [mf/memo]} {::mf/wrap [mf/memo]
[{:keys [project-id file-id page-id layout-name] :as props}] ::mf/wrap-props false}
[{:keys [project-id file-id page-id layout-name]}]
(let [file (mf/deref refs/workspace-file) (let [file (mf/deref refs/workspace-file)
project (mf/deref refs/workspace-project) project (mf/deref refs/workspace-project)
layout (mf/deref refs/workspace-layout) layout (mf/deref refs/workspace-layout)
wglobal (mf/deref refs/workspace-global) wglobal (mf/deref refs/workspace-global)
ready? (mf/deref refs/workspace-ready?) ready? (mf/deref refs/workspace-ready?)
workspace-read-only? (mf/deref refs/workspace-read-only?) read-only? (mf/deref refs/workspace-read-only?)
team-id (:team-id project)
file-name (:name file)
components-v2 (features/use-feature :components-v2) components-v2 (features/use-feature :components-v2)
new-css-system (features/use-feature :new-css-system) new-css-system (features/use-feature :new-css-system)
background-color (:background-color wglobal) background-color (:background-color wglobal)]
focus-out (mf/with-effect []
(mf/use-callback (let [focus-out #(st/emit! (dw/workspace-focus-lost))
(fn [] key (events/listen globals/document "blur" focus-out)]
(st/emit! (dw/workspace-focus-lost))))] (partial events/unlistenByKey key)))
(mf/use-effect
(mf/deps focus-out)
(fn []
(let [keys [(events/listen globals/window EventType.BLUR focus-out)]]
#(doseq [key keys]
(events/unlistenByKey key)))))
;; Setting the layout preset by its name ;; Setting the layout preset by its name
(mf/with-effect [layout-name] (mf/with-effect [layout-name]
@ -164,22 +164,21 @@
(st/emit! ::dwp/force-persist (st/emit! ::dwp/force-persist
(dw/finalize-file project-id file-id)))) (dw/finalize-file project-id file-id))))
;; Set html theme color and close any non-modal dialog that may be still open (mf/with-effect []
(mf/with-effect
(st/emit! msg/hide)) (st/emit! msg/hide))
;; Set properly the page title ;; Set properly the page title
(mf/with-effect [(:name file)] (mf/with-effect [file-name]
(when (:name file) (when file-name
(dom/set-html-title (tr "title.workspace" (:name file))))) (dom/set-html-title (tr "title.workspace" file-name))))
[:& (mf/provider ctx/current-file-id) {:value (:id file)} [:& (mf/provider ctx/current-file-id) {:value file-id}
[:& (mf/provider ctx/current-team-id) {:value (:team-id project)} [:& (mf/provider ctx/current-team-id) {:value team-id}
[:& (mf/provider ctx/current-project-id) {:value (:id project)} [:& (mf/provider ctx/current-project-id) {:value project-id}
[:& (mf/provider ctx/current-page-id) {:value page-id} [:& (mf/provider ctx/current-page-id) {:value page-id}
[:& (mf/provider ctx/components-v2) {:value components-v2} [:& (mf/provider ctx/components-v2) {:value components-v2}
[:& (mf/provider ctx/new-css-system) {:value new-css-system} [:& (mf/provider ctx/new-css-system) {:value new-css-system}
[:& (mf/provider ctx/workspace-read-only?) {:value workspace-read-only?} [:& (mf/provider ctx/workspace-read-only?) {:value read-only?}
[:section#workspace {:style {:background-color background-color [:section#workspace {:style {:background-color background-color
:touch-action "none"}} :touch-action "none"}}
(when (not (:hide-ui layout)) (when (not (:hide-ui layout))
@ -190,7 +189,7 @@
[:& context-menu] [:& context-menu]
(if ready? (if ^boolean ready?
[:& workspace-page {:page-id page-id [:& workspace-page {:page-id page-id
:file file :file file
:wglobal wglobal :wglobal wglobal