From bf3888585a57bf34032d2a687ade3966bbed774f Mon Sep 17 00:00:00 2001 From: Andrey Antukh Date: Tue, 9 May 2023 14:05:19 +0200 Subject: [PATCH] :sparkles: Add some minor performance improvements to dashboard components --- frontend/src/app/main/data/dashboard.cljs | 4 +- frontend/src/app/main/ui/dashboard.cljs | 43 +++++++++++-------- .../src/app/main/ui/dashboard/file_menu.cljs | 4 +- frontend/src/app/main/ui/dashboard/files.cljs | 8 ++-- 4 files changed, 32 insertions(+), 27 deletions(-) diff --git a/frontend/src/app/main/data/dashboard.cljs b/frontend/src/app/main/data/dashboard.cljs index 8d07a6cd8..794865923 100644 --- a/frontend/src/app/main/data/dashboard.cljs +++ b/frontend/src/app/main/data/dashboard.cljs @@ -893,8 +893,8 @@ (update [_ state] (let [origin-project (get-in state [:dashboard-files (first ids) :project-id])] (-> state - (d/update-in-when [:dashboard-projects origin-project :count] #(- % (count ids))) - (d/update-in-when [:dashboard-projects project-id :count] #(+ % (count ids)))))) + (d/update-in-when [:dashboard-projects origin-project] update :count #(- % (count ids))) + (d/update-in-when [:dashboard-projects project-id] update :count #(+ % (count ids)))))) ptk/WatchEvent (watch [_ _ _] diff --git a/frontend/src/app/main/ui/dashboard.cljs b/frontend/src/app/main/ui/dashboard.cljs index 8498c1d97..881928a88 100644 --- a/frontend/src/app/main/ui/dashboard.cljs +++ b/frontend/src/app/main/ui/dashboard.cljs @@ -159,8 +159,8 @@ [:span (tr "dashboard.libraries-and-templates")] [:span.icon (if collapsed i/arrow-up i/arrow-down)]]] [:div.content {:ref content-ref - :style {:left @card-offset :width (str container-size "px")}} - + :style {:left @card-offset :width (str container-size "px")}} + (for [num-item (range (count templates)) :let [item (nth templates num-item)]] (let [is-visible? (and (>= num-item first-visible-card) (<= num-item last-visible-card))] [:a.card-container {:tab-index (if (or (not is-visible?) collapsed) @@ -227,25 +227,31 @@ [{:keys [team projects project section search-term profile] :as props}] (let [container (mf/use-ref) content-width (mf/use-state 0) - default-project-id - (->> (vals projects) - (d/seek :is-default) - (:id)) - on-resize - (fn [_] - (let [dom (mf/ref-val container) - width (obj/get dom "clientWidth")] - (reset! content-width width)))] - (mf/use-effect - #(let [key1 (events/listen js/window "resize" on-resize)] - (fn [] - (events/unlistenByKey key1)))) + default-project-id + (mf/with-memo [projects] + (->> (vals projects) + (d/seek :is-default) + (:id))) + + on-resize + (mf/use-fn + (fn [_] + (let [dom (mf/ref-val container) + width (obj/get dom "clientWidth")] + (reset! content-width width)))) + + clear-selected-fn + (mf/use-fn + #(st/emit! (dd/clear-selected-files)))] + + (mf/with-effect [] + (let [key1 (events/listen js/window "resize" on-resize)] + #(events/unlistenByKey key1))) (mf/use-effect on-resize) - [:div.dashboard-content {:on-click #(st/emit! (dd/clear-selected-files)) - :ref container} + [:div.dashboard-content {:on-click clear-selected-fn :ref container} (case section :dashboard-projects [:* @@ -280,8 +286,7 @@ :search-term search-term}] :dashboard-libraries - [* - [:& libraries-page {:team team}]] + [:& libraries-page {:team team}] :dashboard-team-members [:& team-members-page {:team team :profile profile}] diff --git a/frontend/src/app/main/ui/dashboard/file_menu.cljs b/frontend/src/app/main/ui/dashboard/file_menu.cljs index 36fadaa36..f79b2d4b6 100644 --- a/frontend/src/app/main/ui/dashboard/file_menu.cljs +++ b/frontend/src/app/main/ui/dashboard/file_menu.cljs @@ -131,7 +131,7 @@ on-move (fn [team-id project-id] - (let [params {:ids (set (map :id files)) + (let [params {:ids (into #{} (map :id) files) :project-id project-id}] (fn [] (st/emit! (dd/move-files @@ -213,7 +213,7 @@ (rx/map group-by-team) (rx/subs #(when (mf/ref-val mounted-ref) (reset! teams %))))))) - + (when current-team (let [sub-options (concat (vec (for [project current-projects] {:option-name (get-project-name project) diff --git a/frontend/src/app/main/ui/dashboard/files.cljs b/frontend/src/app/main/ui/dashboard/files.cljs index e67ebbfc6..b7d9426cf 100644 --- a/frontend/src/app/main/ui/dashboard/files.cljs +++ b/frontend/src/app/main/ui/dashboard/files.cljs @@ -39,7 +39,7 @@ on-menu-click (mf/use-fn (fn [event] - (let [position (dom/get-client-position event)] + (let [position (dom/get-client-position event)] (dom/prevent-default event) (swap! local assoc :menu-open true :menu-pos position)))) @@ -64,7 +64,7 @@ [:header.dashboard-header (if (:is-default project) - [:div.dashboard-title#dashboard-drafts-title + [:div.dashboard-title#dashboard-drafts-title [:h1 (tr "labels.drafts")]] (if (:edition @local) @@ -90,7 +90,7 @@ :on-import on-import}] [:div.dashboard-header-actions - [:a.btn-secondary.btn-small + [:a.btn-secondary.btn-small {:tab-index "0" :on-click on-create-click :data-test "new-file" @@ -114,7 +114,7 @@ [:div.icon.tooltip.tooltip-bottom-left {:tab-index "0" - :on-click on-menu-click + :on-click on-menu-click :alt (tr "dashboard.options") :on-key-down (fn [event] (when (kbd/enter? event)