Skip to content

Add loading and empty placeholders to the list of sites - #2190

Merged
sejas merged 3 commits into
trunkfrom
stu-1080-studio-add-loading-state-in-import-remote-site-site-creation
Dec 5, 2025
Merged

Add loading and empty placeholders to the list of sites#2190
sejas merged 3 commits into
trunkfrom
stu-1080-studio-add-loading-state-in-import-remote-site-site-creation

Conversation

@epeicher

@epeicher epeicher commented Dec 4, 2025

Copy link
Copy Markdown
Contributor

Related issues

Proposed Changes

  • Extracts the content of the SyncSitesSelector modal to an external component and uses it as part of the pull-remote-site component so both uses the same Loading... and empty search logic
  • Adds a new Gutenberg color to use the same style than in the Gutenberg modal

Before

CleanShot.2025-12-04.at.13.11.46.mp4

After

CleanShot.2025-12-04.at.13.10.00.mp4

Testing Instructions

  • Apply this branch and run npm start
  • Click on Add site and select Pull an existing site
  • Verify you can see the Loading... while the sites are loaded, if not you can hit Cmd+R in dev to refresh the data and repeat the step
  • Filter by a non existing site on the search
  • Verify that you can see the message about No sites found for...
Regression testing
  • Navigate to the Sync tab and conenct a site
  • Check that there is not any regression in the list of sites displayed

Pre-merge Checklist

  • Have you checked for TypeScript, React or other console errors?
@epeicher epeicher self-assigned this Dec 4, 2025
@epeicher
epeicher requested a review from a team December 4, 2025 12:20
@github-actions

github-actions Bot commented Dec 4, 2025

Copy link
Copy Markdown
Contributor

📊 Performance Test Results

Comparing 4e86e0a vs trunk

site-editor

Metric trunk 4e86e0a Diff Change
load 9258.00 ms 9633.00 ms +375.00 ms 🔴 4.1%

site-startup

Metric trunk 4e86e0a Diff Change
siteCreation 20251.00 ms 18435.00 ms -1816.00 ms 🟢 -9.0%
siteStartup 8972.00 ms 10065.00 ms +1093.00 ms 🔴 12.2%

Results are median values from multiple test runs.

Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change

…udio-add-loading-state-in-import-remote-site-site-creation

@bcotrim bcotrim left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As a new user without any sites on WordPress.com, I see an empty screen. Similarly to using a filter without results, I think we could show a more user friendly message to the user.

Image

Code LGTM 👍

@sejas

sejas commented Dec 5, 2025

Copy link
Copy Markdown
Member

As a new user without any sites on WordPress.com, I see an empty screen. Similarly to using a filter without results, I think we could show a more user friendly message to the user.

We are tackling that under STU-1085

@sejas sejas left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Works as expected. I confirm the loading state appears. Now the list of sites is more consistent between the Pull an existing site and the they sync modal.

I added a message for new users without any site as suggested by @bcotrim 7681ea0

Image Image
@sejas
sejas merged commit d34bf28 into trunk Dec 5, 2025
8 of 9 checks passed
@sejas
sejas deleted the stu-1080-studio-add-loading-state-in-import-remote-site-site-creation branch December 5, 2025 08:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

3 participants