Stats: prompt users to update the Jetpack plugin #99278

myhro · 2025-02-04T17:50:02Z

Closes Automattic/jetpack-roadmap#2219.

Proposed Changes

Prompt users to update the Jetpack plugin when they select Regions/Cities in the Locations card.

Why are these changes being made?

(p1HpG7-rpL-p2)

Testing Instructions

Note

This feature is meant for Odyssey/self-hosted users. Jurassic Ninja should work perfectly for this scenario, specially when used with the Jetpack Beta Tester plugin.

Navigate to Jetpack > Stats on your self-hosted site.
Add &flags=stats/locations to the URL.
Scroll down to the Locations section, the different scenarios below can be observed:

Outdated (14.1) or recent (14.2) Jetpack plugin, no commercial license

Outdated (14.1) Jetpack plugin, commercial license available

Recent (14.2) Jetpack plugin, commercial license available

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 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 · 2025-02-04T17:50:16Z

Calypso Live (direct link)

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

Jetpack Cloud live (direct link)

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

Automattic for Agencies live (direct link)

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

matticbot · 2025-02-04T17:58:10Z

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

Sections (~189 bytes added 📈 [gzipped])

name   parsed_size           gzip_size
stats      +1023 B  (+0.1%)     +189 B  (+0.1%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

matticbot · 2025-02-04T21:35:55Z

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

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

notifications
odyssey-stats
wpcom-block-editor

To test WordPress.com changes, run install-plugin.sh $pluginSlug add/stats-jetpack-update-prompt on your sandbox.

myhro · 2025-02-04T22:22:10Z

client/my-sites/stats/features/modules/stats-locations/stats-locations.tsx

 	const {
-		data = [],
+		data: locationsViewsData = [],
 		isLoading: isRequestingData,
 		isError,
 	} = useLocationViewsQuery< StatsLocationViewsData >( siteId, geoMode, query, countryFilter, {
-		enabled: ! shouldGate,
+		enabled: ! shouldGate && supportsLocationsStatsFeature,
 	} );

+	const countriesViewsData = useSelector( ( state ) =>
+		getSiteStatsNormalizedData( state, siteId, statType, query )
+	) as [ id: number, label: string ];


Tried to check just one or the other, but there were complaints that hooks cannot be conditionally rendered. Shouldn't be an actual performance issue, given the StatsLocationViewsData has the enabled flag and getSiteStatsNormalizedData makes use of cache.

Sounds good to me. I assume the getSiteStatsNormalizedData selector retrieves stats from the Redux state, which are stored thanks to QuerySiteStats. Maybe it’s time to render that query component only when needed? Otherwise, we’ll be attempting to fetch the legacy country-views API even when we don’t need it.

Just to clarify, this isn’t an issue related to your PR. It could be addressed in another one if you prefer.

I'm all in for further improving that. Would you mind opening an issue about it? I'm not sure I got 100% of the context to better describe what we need to do.

Sure, I'll take a look and open the issue in the project board :)

client/my-sites/stats/stats-card-upsell/stats-card-upsell-overlay.tsx

client/my-sites/stats/features/modules/stats-locations/stats-locations.tsx

Initsogar · 2025-02-04T23:12:47Z

client/my-sites/stats/features/modules/stats-locations/stats-locations.tsx

 	const {
-		data = [],
+		data: locationsViewsData = [],
 		isLoading: isRequestingData,
 		isError,
 	} = useLocationViewsQuery< StatsLocationViewsData >( siteId, geoMode, query, countryFilter, {
-		enabled: ! shouldGate,
+		enabled: ! shouldGate && supportsLocationsStatsFeature,
 	} );

+	const countriesViewsData = useSelector( ( state ) =>
+		getSiteStatsNormalizedData( state, siteId, statType, query )
+	) as [ id: number, label: string ];


Sounds good to me. I assume the getSiteStatsNormalizedData selector retrieves stats from the Redux state, which are stored thanks to QuerySiteStats. Maybe it’s time to render that query component only when needed? Otherwise, we’ll be attempting to fetch the legacy country-views API even when we don’t need it.

Just to clarify, this isn’t an issue related to your PR. It could be addressed in another one if you prefer.

client/my-sites/stats/features/modules/stats-locations/stats-locations.tsx

myhro

Thanks for the review @Initsogar. I addressed your comments. Can you please take a look at it again?

client/my-sites/stats/features/modules/stats-locations/stats-locations.tsx

myhro · 2025-02-05T15:39:47Z

client/my-sites/stats/features/modules/stats-locations/stats-locations.tsx

 	const {
-		data = [],
+		data: locationsViewsData = [],
 		isLoading: isRequestingData,
 		isError,
 	} = useLocationViewsQuery< StatsLocationViewsData >( siteId, geoMode, query, countryFilter, {
-		enabled: ! shouldGate,
+		enabled: ! shouldGate && supportsLocationsStatsFeature,
 	} );

+	const countriesViewsData = useSelector( ( state ) =>
+		getSiteStatsNormalizedData( state, siteId, statType, query )
+	) as [ id: number, label: string ];


I'm all in for further improving that. Would you mind opening an issue about it? I'm not sure I got 100% of the context to better describe what we need to do.

Initsogar

Looks good to me! ✅

I tried testing with a site with the following conditions:

Older Jetpack plugin
No commercial license

✅ Clicking on the regions or cities tab, shows me the upsell prompt

✅ After purchasing a commercial license, it shows me the Jetpack upgrade prompt

✅ It redirected me to the plugins admin page (/wp-admin/plugins.php) and after updating my Jetpack to the latest version, and looking Stats again, I can see the regions and cities tabs unlocked properly!

✅ In addition to the happy path, I made some tests to ensure the upsell prompt is working as usual when using the latest Jetpack version, and it works as expected.

client/my-sites/stats/features/modules/stats-locations/stats-locations.tsx

Initsogar · 2025-02-05T18:48:38Z

I'm all in for further improving that. Would you mind opening an issue about it? I'm not sure I got 100% of the context to better describe what we need to do.

It didn't let me reply in the same thread, so I'm adding an additional comment here:

I just created a follow-up task to address this issue: https://github.com/Automattic/jetpack-roadmap/issues/2287

myhro · 2025-02-05T23:13:45Z

Awesome. Thanks for the careful review and creating the follow-up issue, Rafa! Merging...

myhro force-pushed the add/stats-jetpack-update-prompt branch from 4394682 to 7beeb03 Compare February 4, 2025 21:13

myhro force-pushed the add/stats-jetpack-update-prompt branch from 7beeb03 to bddde31 Compare February 4, 2025 22:06

myhro commented Feb 4, 2025

View reviewed changes

myhro changed the title ~~[WIP] Stats: prompt users to update the Jetpack plugin~~ Stats: prompt users to update the Jetpack plugin Feb 4, 2025

myhro added [Feature] Stats Everything related to our analytics product at /stats/ [Status] Needs Review The PR is ready for review. This also triggers e2e canary tests and wp-desktop tests automatically. labels Feb 4, 2025

myhro marked this pull request as ready for review February 4, 2025 22:25

myhro requested a review from Initsogar February 4, 2025 22:31

kangzj reviewed Feb 4, 2025

View reviewed changes

client/my-sites/stats/stats-card-upsell/stats-card-upsell-overlay.tsx Show resolved Hide resolved

Initsogar reviewed Feb 4, 2025

View reviewed changes

client/my-sites/stats/features/modules/stats-locations/stats-locations.tsx Show resolved Hide resolved

myhro commented Feb 5, 2025

View reviewed changes

myhro requested a review from Initsogar February 5, 2025 15:40

myhro added 5 commits February 5, 2025 14:09

Stats: prompt users to update the Jetpack plugin

2fbfc2b

Use a different icon for the Jetpack update card

be3a084

Refactor module overlay

148217f

Updated enabled filter on useLocationViewsQuery

e79584b

Explain when the legacy countries endpoint is used

c8af5e7

myhro force-pushed the add/stats-jetpack-update-prompt branch from 41fb65b to c8af5e7 Compare February 5, 2025 17:11

Initsogar approved these changes Feb 5, 2025

View reviewed changes

client/my-sites/stats/features/modules/stats-locations/stats-locations.tsx Show resolved Hide resolved

myhro merged commit aeccbd3 into trunk Feb 5, 2025
13 checks passed

myhro deleted the add/stats-jetpack-update-prompt branch February 5, 2025 23:13

github-actions bot removed the [Status] Needs Review The PR is ready for review. This also triggers e2e canary tests and wp-desktop tests automatically. label Feb 5, 2025

Initsogar mentioned this pull request Feb 7, 2025

Stats Locations: prevent redundant country-views API calls #99509

Merged

8 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Stats: prompt users to update the Jetpack plugin #99278

Stats: prompt users to update the Jetpack plugin #99278

myhro commented Feb 4, 2025 •

edited

Loading

github-actions bot commented Feb 4, 2025 •

edited by matticbot

Loading

matticbot commented Feb 4, 2025 •

edited

Loading

matticbot commented Feb 4, 2025

myhro Feb 4, 2025

Initsogar Feb 4, 2025

myhro Feb 5, 2025

Initsogar Feb 5, 2025

Initsogar Feb 4, 2025

myhro left a comment

myhro Feb 5, 2025

Initsogar left a comment

Initsogar commented Feb 5, 2025

myhro commented Feb 5, 2025

Stats: prompt users to update the Jetpack plugin #99278

Stats: prompt users to update the Jetpack plugin #99278

Conversation

myhro commented Feb 4, 2025 • edited Loading

Proposed Changes

Why are these changes being made?

Testing Instructions

Outdated (14.1) or recent (14.2) Jetpack plugin, no commercial license

Outdated (14.1) Jetpack plugin, commercial license available

Recent (14.2) Jetpack plugin, commercial license available

Pre-merge Checklist

github-actions bot commented Feb 4, 2025 • edited by matticbot Loading

matticbot commented Feb 4, 2025 • edited Loading

matticbot commented Feb 4, 2025

myhro Feb 4, 2025

Choose a reason for hiding this comment

Initsogar Feb 4, 2025

Choose a reason for hiding this comment

myhro Feb 5, 2025

Choose a reason for hiding this comment

Initsogar Feb 5, 2025

Choose a reason for hiding this comment

Initsogar Feb 4, 2025

Choose a reason for hiding this comment

myhro left a comment

Choose a reason for hiding this comment

myhro Feb 5, 2025

Choose a reason for hiding this comment

Initsogar left a comment

Choose a reason for hiding this comment

Initsogar commented Feb 5, 2025

myhro commented Feb 5, 2025

myhro commented Feb 4, 2025 •

edited

Loading

github-actions bot commented Feb 4, 2025 •

edited by matticbot

Loading

matticbot commented Feb 4, 2025 •

edited

Loading