MSD: Update the empty state for search results on both sites and domains #108439

arthur791004 · 2026-01-30T12:11:25Z

Proposed Changes

Introduce the DataViewsEmptyStateLayout component so we don't need to build the empty state from scratch for each view
Apply the DataViewsEmptyStateLayout to DataViews on both sites and domains screen

Sites	Domains

Why are these changes being made?

Improve the experience of the empty search state

Testing Instructions

Sites

Go to /sites
Search any keyword until there is no result
Ensure the empty search state is correct

Domains

Go to /domains
Search any keyword until there is no result
Ensure the empty search state is correct

Pre-merge Checklist

Has the general commit checklist been followed? (PCYsg-hS-p2)
Have you written new tests for your changes?
Have you tested the feature in Simple (P9HQHe-k8-p2), Atomic (P9HQHe-jW-p2), and self-hosted Jetpack sites (PCYsg-g6b-p2)?
Have you checked for TypeScript, React or other console errors?
Have you tested accessibility for your changes? Ensure the feature remains usable with various user agents (e.g., browsers), interfaces (e.g., keyboard navigation), and assistive technologies (e.g., screen readers) (PCYsg-S3g-p2).
Have you used memoizing on expensive computations? More info in Memoizing with create-selector and Using memoizing selectors and Our Approach to Data
Have we added the "[Status] String Freeze" label as soon as any new strings were ready for translation (p4TIVU-5Jq-p2)?
- For UI changes, have we tested the change in various languages (for example, ES, PT, FR, or DE)? The length of text and words vary significantly between languages.
For changes affecting Jetpack: Have we added the "[Status] Needs Privacy Updates" label if this pull request changes what data or activity we track or use (p4TIVU-aUh-p2)?

github-actions · 2026-01-30T12:11:35Z

Calypso Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-168336

Jetpack Cloud live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-168336&env=jetpack

Automattic for Agencies live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-168336&env=a8c-for-agencies

Dashboard live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-168336&env=dashboard

matticbot · 2026-01-30T12:19:23Z

This PR modifies the release build for the following Calypso Apps:

For info about this notification, see here: PCYsg-OT6-p2

agents-manager
help-center
notifications
wpcom-block-editor

To test WordPress.com changes, run install-plugin.sh $pluginSlug feat/dataviews-empty-state-v2 on your sandbox.

StevenDufresne · 2026-02-01T21:48:40Z

Yeah, I think this is the right approach. I reached a similar conclusion after putting up #108433. There's more redundancy than needed, since we're swapping actions and conditionally rendering the OfferCard on search views.

Worth mentioning, I would prefer not call anything V2.

arthur791004 · 2026-02-02T07:11:55Z

Worth mentioning, I would prefer not call anything V2.

This is just a temporary name like CustomSelectControlV2 😅 Will rename it when we're able to remove the V1

arthur791004 · 2026-02-02T07:12:37Z

This one seems better as we have different requirements of domain empty state for CIAB. See #108424.

client/dashboard/sites/index.tsx

fushar · 2026-02-03T02:53:30Z

client/dashboard/sites/index.tsx

 						isLoading={ isLoadingSites || ( isPlaceholderData && hasNoData ) }
 						isPlaceholderData={ isPlaceholderData }
-						empty={ emptyState }
+						empty={


Do we need to do the same thing to sites-ciab? Wondering because we are modifying domains-ciab in this PR 🤔

Hmm maybe we can do it later; I don't know if the current actions are applicable to CIAB...

Good question. We don't know what it should look like yet, I agree we can do it later.

fushar

I'm seeing a flashing content when I searched in the Domains page for the first time:

B9fn7O.mp4

To reproduce, you need to Disable cache in your console, then hard reload the Domains page. Then start searching with bogus term to get to the empty search state.

I suspect it has something to do with this suspense boundary since it covers the PageLayout. 🤔

client/dashboard/domains-ciab/empty-domains-state/actions.tsx

client/dashboard/domains/empty-domains-state/actions.tsx

fushar · 2026-02-03T03:39:26Z

client/dashboard/domains-ciab/empty-domains-state/actions.tsx

+	const trackEmptyStateActionClick = ( action: string ) => {
+		recordTracksEvent( 'calypso_domains_dashboard_empty_state_action_click', {
+			action,
+			dashboard: 'ciab',


I know we just copy-paste this from existing code. But just wanted to note so that we don't forget. We might not need this param as we will have other environment value for CIAB when we ship it, which will be present in all Track events automatically:

fushar · 2026-02-03T03:41:09Z

client/dashboard/domains-ciab/empty-domains-state/actions.tsx

+				<EmptyState.ActionItem
+					title={ __( 'Use a domain name you already own' ) }
+					description={ __(
+						'Bring your domain to WordPress.com and manage everything in one place.'


Maybe a question for CIAB team (for later), do we really want to mention wordpress.com here 😄

StevenDufresne · 2026-02-03T04:46:33Z

I suspect it has something to do with #108424 (comment) since it covers the PageLayout. 🤔

Nice catch, yes. We can't wrap the PageLayout with <Suspense>, ever.

StevenDufresne · 2026-02-03T05:10:08Z

I've moved the <Suspense> boundary to wrap around AddDomainButton, that should sort out the flash.

client/dashboard/domains/index.tsx

fushar · 2026-02-04T02:01:12Z

client/dashboard/domains/index.tsx

+					<Suspense fallback={ null }>
+						<EmptyDomainsStateActions />
+					</Suspense>
+					<EmptyDomainsStateUpsell />


I haven't tested it but I believe we should put this one in the above suspense as well together, to avoid layout shift during the JS load 🤔

To be honest, I don't like the lazy-load approach here. It kind of defeats the purpose of ensuring the data exists before rendering the view. I'll have to take a look at the context to understand why we need to lazy load this in the first place.

arthur791004 self-assigned this Jan 30, 2026

This was referenced Jan 30, 2026

MSD Domains: Update the empty state for search results #108437

Closed

Sites: Update the empty state for search results #108435

Closed

arthur791004 force-pushed the feat/dataviews-empty-state-v2 branch from 64e00f5 to cd634fe Compare January 30, 2026 12:20

arthur791004 force-pushed the feat/dataviews-empty-state-v2 branch from cd634fe to 24c9075 Compare February 2, 2026 08:14

arthur791004 marked this pull request as ready for review February 2, 2026 08:16

arthur791004 requested a review from a team as a code owner February 2, 2026 08:16

matticbot added the [Status] Needs Review The PR is ready for review. This also triggers e2e canary tests and wp-desktop tests automatically. label Feb 2, 2026

claude bot reviewed Feb 2, 2026

View reviewed changes

client/dashboard/sites/index.tsx Show resolved Hide resolved

claude bot reviewed Feb 2, 2026

View reviewed changes

client/dashboard/sites/index.tsx Outdated Show resolved Hide resolved

arthur791004 force-pushed the feat/dataviews-empty-state-v2 branch from 24c9075 to 545ae8b Compare February 2, 2026 08:53

arthur791004 requested a review from lucasmendes-design February 2, 2026 10:05

fushar reviewed Feb 3, 2026

View reviewed changes

client/dashboard/domains-ciab/empty-domains-state/actions.tsx Outdated Show resolved Hide resolved

client/dashboard/domains/empty-domains-state/actions.tsx Outdated Show resolved Hide resolved

fushar reviewed Feb 3, 2026

View reviewed changes

StevenDufresne force-pushed the feat/dataviews-empty-state-v2 branch from 55d64ef to 70713e1 Compare February 3, 2026 05:00

StevenDufresne requested a review from fushar February 3, 2026 05:12

fushar reviewed Feb 3, 2026

View reviewed changes

client/dashboard/domains/index.tsx Show resolved Hide resolved

arthur791004 added 5 commits February 3, 2026 20:16

MSD: Add DataViewsEmptyStateV2

5ad129c

MSD: Add isBorderless to the props of EmptyState.Wrapper

b29c826

MSD: Apply DataViewsEmptyStateV2 to sites DataViews

648ae7e

MSD: Apply DataViewsEmptyStateV2 to domain DataViews

cef8488

Fix tests

5c28f9d

arthur791004 and others added 5 commits February 3, 2026 20:16

Rename to DataViewsEmptyStateLayout

610d9fb

Separate out empty site list and empty site search content.

d1a26d4

Localize the Suspense boundary to the button.

57bbc2b

Remove empty fragment.

f042543

Remove the fragment.

9387458

StevenDufresne force-pushed the feat/dataviews-empty-state-v2 branch from 25c1b84 to 9387458 Compare February 3, 2026 11:16

Wrap lazy loaded state actions.

844b6f4

fushar reviewed Feb 4, 2026

View reviewed changes

StevenDufresne mentioned this pull request Feb 4, 2026

Remove lazy loaded components on domain page. #108508

Draft

9 tasks

MSD: Update the empty state for search results on both sites and domains #108439

Are you sure you want to change the base?

MSD: Update the empty state for search results on both sites and domains #108439

Conversation

arthur791004 commented Jan 30, 2026 • edited by StevenDufresne Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Proposed Changes

Why are these changes being made?

Testing Instructions

Sites

Domains

Pre-merge Checklist

Uh oh!

github-actions bot commented Jan 30, 2026 • edited by matticbot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

matticbot commented Jan 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

StevenDufresne commented Feb 1, 2026

Uh oh!

arthur791004 commented Feb 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

arthur791004 commented Feb 2, 2026

Uh oh!

Uh oh!

Uh oh!

fushar Feb 3, 2026

Choose a reason for hiding this comment

Uh oh!

fushar Feb 3, 2026

Choose a reason for hiding this comment

Uh oh!

StevenDufresne Feb 3, 2026

Choose a reason for hiding this comment

Uh oh!

fushar left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

fushar Feb 3, 2026

Choose a reason for hiding this comment

Uh oh!

fushar Feb 3, 2026

Choose a reason for hiding this comment

Uh oh!

StevenDufresne commented Feb 3, 2026

Uh oh!

StevenDufresne commented Feb 3, 2026

Uh oh!

Uh oh!

fushar Feb 4, 2026

Choose a reason for hiding this comment

Uh oh!

StevenDufresne Feb 4, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

arthur791004 commented Jan 30, 2026 •

edited by StevenDufresne

Loading

github-actions bot commented Jan 30, 2026 •

edited by matticbot

Loading

matticbot commented Jan 30, 2026 •

edited

Loading

arthur791004 commented Feb 2, 2026 •

edited

Loading