github/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-08-23 05:08:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

🐛 Fix gitch of placeholder when switching between teams on dashboard (#10922)

Browse Source 
* 🐛 Fix use single point for retrieving state and propagate it

* 🐛 Fix use loading message instead of placeholder when loading files
This commit is contained in:
Luis de Dios 2026-08-18 17:50:15 +02:00 committed by GitHub
parent 4ac14cfd08
commit 7061ecae0a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 64 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
frontend/src/app/main/ui/dashboard.cljs
View File

@ -27,6 +27,7 @@
[app.main.ui.dashboard.files :refer [files-section*]] [app.main.ui.dashboard.files :refer [files-section*]]
[app.main.ui.dashboard.fonts :refer [fonts-page* font-providers-page*]] [app.main.ui.dashboard.fonts :refer [fonts-page* font-providers-page*]]
[app.main.ui.dashboard.import] [app.main.ui.dashboard.import]
[app.main.ui.dashboard.layout-toggle :as lt]
[app.main.ui.dashboard.libraries :refer [libraries-page*]] [app.main.ui.dashboard.libraries :refer [libraries-page*]]
[app.main.ui.dashboard.projects :refer [projects-section*]] [app.main.ui.dashboard.projects :refer [projects-section*]]
[app.main.ui.dashboard.search :refer [search-page*]] [app.main.ui.dashboard.search :refer [search-page*]]
@ -51,7 +52,7 @@
(mf/defc dashboard-content* (mf/defc dashboard-content*
{::mf/private true} {::mf/private true}
[{:keys [team projects project section search-term profile default-project]}] [{:keys [team projects project section search-term profile default-project layout on-layout-change]}]
(let [container (mf/use-ref) (let [container (mf/use-ref)
content-width (mf/use-state 0) content-width (mf/use-state 0)
@ -100,18 +101,18 @@
:dashboard-recent :dashboard-recent
(when (seq projects) (when (seq projects)
[:* [:*
[:> projects-section* [:> projects-section* {:team team
{:team team :projects projects
:projects projects :profile profile
:profile profile}] :layout layout
:on-layout-change on-layout-change}]
(when ^boolean show-templates? (when ^boolean show-templates?
[:> templates-section* [:> templates-section* {:profile profile
{:profile profile :project-id project-id
:project-id project-id :team-id team-id
:team-id team-id :default-project-id default-project-id
:default-project-id default-project-id :content-width @content-width}])])
:content-width @content-width}])])
:dashboard-fonts :dashboard-fonts
[:> fonts-page* {:team team}] [:> fonts-page* {:team team}]
@ -123,14 +124,15 @@
(when project (when project
[:* [:*
[:> files-section* {:team team [:> files-section* {:team team
:project project}] :project project
:layout layout
:on-layout-change on-layout-change}]
(when ^boolean show-templates? (when ^boolean show-templates?
[:> templates-section* [:> templates-section* {:profile profile
{:profile profile :team-id team-id
:team-id team-id :project-id project-id
:project-id project-id :default-project-id default-project-id
:default-project-id default-project-id :content-width @content-width}])])
:content-width @content-width}])])
:dashboard-search :dashboard-search
[:> search-page* {:team team [:> search-page* {:team team
@ -155,7 +157,9 @@
:dashboard-deleted :dashboard-deleted
[:> deleted-section* {:team team [:> deleted-section* {:team team
:projects projects :projects projects
:profile profile}] :profile profile
:layout layout
:on-layout-change on-layout-change}]
nil)])) nil)]))
@ -313,7 +317,15 @@
(mf/with-memo [projects] (mf/with-memo [projects]
(->> projects (->> projects
(filter :is-default) (filter :is-default)
(first)))] (first)))
layout* (hooks/use-persisted-state lt/layout-key lt/default-layout)
layout (deref layout*)
on-layout-change
(mf/use-fn
(fn [value]
(reset! layout* (keyword value))))]
(hooks/use-shortcuts ::dashboard sc/shortcuts-dashboard :dashboard) (hooks/use-shortcuts ::dashboard sc/shortcuts-dashboard :dashboard)
@ -347,22 +359,22 @@
;; team is already set so don't put the team into mf/deps. ;; team is already set so don't put the team into mf/deps.
[:main {:class (stl/css :dashboard) [:main {:class (stl/css :dashboard)
:key (dm/str (:id team))} :key (dm/str (:id team))}
[:> sidebar* [:> sidebar* {:team team
{:team team :projects projects
:projects projects :project project
:project project :default-project default-project
:default-project default-project :profile profile
:profile profile :section section
:section section :search-term search-term}]
:search-term search-term}] [:> dashboard-content* {:projects projects
[:> dashboard-content* :profile profile
{:projects projects :project project
:profile profile :default-project default-project
:project project :section section
:default-project default-project :search-term search-term
:section section :team team
:search-term search-term :layout layout
:team team}]]])) :on-layout-change on-layout-change}]]]))
(mf/defc dashboard-page* (mf/defc dashboard-page*
{::mf/lazy-load true} {::mf/lazy-load true}

12
frontend/src/app/main/ui/dashboard/deleted.cljs
View File

@ -219,16 +219,8 @@
(tr "labels.deleted")]]])) (tr "labels.deleted")]]]))
(mf/defc deleted-section* (mf/defc deleted-section*
[{:keys [team projects]}] [{:keys [team projects layout on-layout-change]}]
(let [layout* (hooks/use-persisted-state lt/layout-key lt/default-layout) (let [deleted-map
layout (deref layout*)
on-layout-change
(mf/use-fn
(fn [value]
(reset! layout* (keyword value))))
deleted-map
(mf/deref ref:deleted-files) (mf/deref ref:deleted-files)
projects projects

20
frontend/src/app/main/ui/dashboard/files.cljs
View File

@ -137,7 +137,7 @@
:on-import on-import}])]])) :on-import on-import}])]]))
(mf/defc files-section* (mf/defc files-section*
[{:keys [project team]}] [{:keys [project team layout on-layout-change]}]
(let [files (mf/deref refs/files) (let [files (mf/deref refs/files)
project-id (get project :id) project-id (get project :id)
@ -147,7 +147,6 @@
(sort-by :modified-at) (sort-by :modified-at)
(reverse))) (reverse)))
can-edit? (-> team :permissions :can-edit) can-edit? (-> team :permissions :can-edit)
project-id (:id project) project-id (:id project)
is-draft-proyect (:is-default project) is-draft-proyect (:is-default project)
@ -155,19 +154,16 @@
[rowref limit] (hooks/use-dynamic-grid-item-width) [rowref limit] (hooks/use-dynamic-grid-item-width)
file-count (or (count files) 0) file-count (or (count files) 0)
loading? (and (some? (:count project))
(not= (:count project) file-count))
empty-state-viewer (and (not can-edit?) empty-state-viewer (and (not can-edit?)
(= 0 file-count)) (= 0 file-count)
(not loading?))
selected-files (mf/deref refs/selected-files) selected-files (mf/deref refs/selected-files)
layout* (hooks/use-persisted-state lt/layout-key lt/default-layout)
layout (deref layout*)
on-layout-change
(mf/use-fn
(fn [value]
(reset! layout* (keyword value))))
on-file-created on-file-created
(mf/use-fn (mf/use-fn
(fn [file-data] (fn [file-data]
@ -216,7 +212,7 @@
(tr "dashboard.empty-placeholder-drafts-subtitle") (tr "dashboard.empty-placeholder-drafts-subtitle")
(tr "dashboard.empty-placeholder-files-subtitle"))}] (tr "dashboard.empty-placeholder-files-subtitle"))}]
[:> grid* {:project project [:> grid* {:project project
:files files :files (if loading? nil files)
:selected-files selected-files :selected-files selected-files
:can-edit can-edit? :can-edit can-edit?
:origin :files :origin :files

16
frontend/src/app/main/ui/dashboard/projects.cljs
View File

@ -109,6 +109,10 @@
team-id (get team :id) team-id (get team :id)
file-count (or (:count project) 0) file-count (or (:count project) 0)
loading? (and (pos? (:count project))
(empty? files))
is-draft? (:is-default project) is-draft? (:is-default project)
empty? (and (not can-edit) empty? (and (not can-edit)
(= 0 file-count)) (= 0 file-count))
@ -292,7 +296,7 @@
[:> line-grid* {:project project [:> line-grid* {:project project
:team team :team team
:files files :files (if loading? nil files)
:create-fn create-file :create-fn create-file
:can-edit can-edit :can-edit can-edit
:limit limit :limit limit
@ -313,7 +317,7 @@
(l/derived :recent-files st/state)) (l/derived :recent-files st/state))
(mf/defc projects-section* (mf/defc projects-section*
[{:keys [team projects profile]}] [{:keys [team projects profile layout on-layout-change]}]
(let [team-id (get team :id) (let [team-id (get team :id)
@ -334,14 +338,6 @@
show-deleted? (:can-edit permisions) show-deleted? (:can-edit permisions)
layout* (hooks/use-persisted-state lt/layout-key lt/default-layout)
layout (deref layout*)
on-layout-change
(mf/use-fn
(fn [value]
(reset! layout* (keyword value))))
projects projects
(mf/with-memo [projects] (mf/with-memo [projects]
(->> projects (->> projects