[WOOMOB-3477] Migrate dashboard content to Store Design System

[hichamboushaba]

Description

Part of WOOMOB-3477 — does not close the ticket.

This PR migrates the My Store dashboard content area and cards to the Store Design System while preserving the existing Fragment-hosted top app bar.

It:

• opts the dashboard into the Store Design System theme and section background;
• migrates card surfaces, spacing, typography, colors, buttons, dividers, menus, loading skeletons, and error states;
• replaces the legacy pull-to-refresh implementation with Material 3;
• updates the existing cards across Performance, Orders, Reviews, Inbox, Stock, Coupons, Blaze, Google Ads, onboarding, push notifications, top performers, and the AI assistant;
• adds design-system preview coverage for light and dark themes, large fonts, and RTL layouts;
• improves accessibility descriptions for review ratings and the share-store toolbar action.

Remaining work for WOOMOB-3477: migrate the top app bar, then move the Customize action from the toolbar to the bottom position shown in Figma.

Test Steps

1. Open the My Store dashboard for a store with several dashboard cards enabled.
2. In light mode, verify the section background, rounded borderless card surfaces, gutters, headers, typography, dividers, menus, buttons, and data presentation.
3. Open the toolbar Customize action, hide and restore cards, and confirm their visibility and ordering update correctly.
4. Exercise the Performance date range, metric selector, card overflow menus, filters, and available card actions.
5. Pull down on the dashboard and confirm the refresh indicator appears and the dashboard refresh completes.
6. Verify available loading, empty, error, retry, and populated card states.
7. Repeat the visual checks in dark mode, paying particular attention to text, icon, divider, button, and card contrast.
8. On a tablet or landscape device, confirm cards flow into multiple columns with consistent spacing and without clipping.
9. Increase the system font size and enable an RTL locale; confirm card content remains readable and usable.

Images/gif

Theme	Before	After
Light
Dark

• I have considered if this change warrants release notes and have added them to RELEASE-NOTES.txt if necessary. Use the "[Internal]" label for non-user-facing changes.

[dangermattic]

	1 Warning
⚠️	This PR is larger than 300 lines of changes. Please consider splitting it into smaller PRs for easier and faster reviews.

Generated by 🚫 Danger

[wpmobilebot]

📲 You can test the changes from this Pull Request in WooCommerce Android by scanning the QR code below to install the corresponding build.

	App Name	WooCommerce Android
	Platform	📱 Mobile
	Flavor	Jalapeno
	Build Type	Debug
	Build Number	774
	Version	25.2-rc-2
	Application ID	com.woocommerce.android.prealpha
	Commit	97f3c87
	Installation URL	260fajlugbf98

Automatticians: You can use our internal self-serve MC tool to give yourself access to those builds if needed.

[hichamboushaba]

The Dashboard root already painted a background before this PR; this change only updates it to the DS section color. The background is intentionally retained for the hybrid XML/Compose shell and exposed JITM margins. Removing the Activity window background safely would require broader MainActivity-level work, so we are retaining this behavior here.

[codecov-commenter]

Codecov Report

❌ Patch coverage is 0% with 1352 lines in your changes missing coverage. Please review.
✅ Project coverage is 40.94%. Comparing base (c797d14) to head (6d9c166).

Files with missing lines	Patch %	Lines
...ommerce/android/ui/dashboard/DashboardContainer.kt	0.00%	223 Missing ⚠️
...e/android/ui/dashboard/inbox/DashboardInboxCard.kt	0.00%	133 Missing ⚠️
...android/ui/orders/compose/LegacyOrderSummaryRow.kt	0.00%	111 Missing ⚠️
...mmerce/android/ui/dashboard/DashboardPrimitives.kt	0.00%	83 Missing ⚠️
...droid/ui/dashboard/reviews/DashboardReviewsCard.kt	0.00%	81 Missing ⚠️
...ui/dashboard/onboarding/DashboardOnboardingCard.kt	0.00%	74 Missing ⚠️
...oid/ui/products/compose/LegacyProductSummaryRow.kt	0.00%	71 Missing ⚠️
...droid/ui/blaze/campaigs/LegacyBlazeCampaignItem.kt	0.00%	69 Missing ⚠️
...merce/android/ui/orders/compose/OrderSummaryRow.kt	0.00%	53 Missing ⚠️
...roid/ui/dashboard/google/DashboardGoogleAdsCard.kt	0.00%	46 Missing ⚠️
... and 19 more

Additional details and impacted files

@@             Coverage Diff              @@
##              trunk   #16248      +/-   ##
============================================
- Coverage     41.15%   40.94%   -0.21%     
  Complexity    13498    13498              
============================================
  Files          2503     2507       +4     
  Lines        146462   147198     +736     
  Branches      21761    21916     +155     
============================================
  Hits          60275    60275              
- Misses        80089    80825     +736     
  Partials       6098     6098              

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

[claude]

AI Code Review - No issues found. The changes look good.

This is a clean, largely mechanical migration of the My Store dashboard from Material to Material3 / the Woo Design System. I verified the theme boundaries: the new Material3 OrderSummaryRow/ProductSummaryRow (which now read WooTheme.* composition locals) are only used from WooDesignSystemTheme-rooted screens (the dashboard), while the AI Assistant renderers were correctly moved to the new LegacyOrderSummaryRow/LegacyProductSummaryRow variants and POS uses its own local OrderSummaryRow — so there is no risk of a missing-CompositionLocal crash. Public composable signatures are preserved.

The two bot-flagged Lint items (root-background overdraw on fragment_dashboard.xml, and material/material3 mixing inside the new Legacy* files) were already reviewed and explicitly accepted by a repo maintainer as intentional legacy behavior, so I have not re-raised them.

PR housekeeping

• Applied repo AGENTS.md/CLAUDE.md guidance (store vs. POS architecture boundaries) when verifying theme usage.

---

_{Automatic review · claude-opus-4-8 · Workflow run}

_{How to reply to a finding}

Reply on this review (or inline at the line the finding refers to) with one of:

• @claude addressed - I made the change. Bot verifies against the next diff before marking resolved.
• @claude rejected: <reason> - Will not fix; reason gets quoted on the next review.
• @claude not-applicable - Finding does not apply (wrong file, already covered elsewhere, etc.).

The bot honours these on the next review pass.

[irfano]

Screen_recording_20260720_222805.webm

I noticed an issue occurring when placing the app in the background and opening it again while in a scrolled state. You can see in the video that the store name disappears in this case. I noticed the top bar was changed in a follow-up PR. So ignore this.

In the screenshot above, you can see that the two “i” icons have different colors. They were the same on trunk.

Before	After

I think we need more contrast between the context menu and the card background.

[hichamboushaba]

Thanks @irfano for the review.

I think we need more contrast between the context menu and the card background.

Like all design system PRs, please ignore dark color issues for now, until we update our color foundations.

---

I will check and reply to the other comments.

[hichamboushaba]

@irfano Fixed the information-icon color mismatch in 97f3c87. The Stats AndroidView now uses the same Store Design System primary resource as the Compose footer; I also verified both icons render identically in light and dark modes.

[irfano]

LGTM! 👍🏻