Performance Profiler: Pass locale to endpoints (#97055)

* Performance Profiler: Pass locale to endpoints * Update types of the locale parameter
Automattic · Dec 10, 2024 · 2550dd0 · 2550dd0
1 parent 5b246f6
commit 2550dd0
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 12 deletions.
diff --git a/client/data/site-profiler/use-url-basic-metrics-query.ts b/client/data/site-profiler/use-url-basic-metrics-query.ts
@@ -14,16 +14,21 @@ function mapScores( response: UrlBasicMetricsQueryResponse ) {
 	return { ...response, success: basic.success, basic: basicMetricsScored };
 }
 
-export const useUrlBasicMetricsQuery = ( url?: string, hash?: string, advance = false ) => {
+export const useUrlBasicMetricsQuery = (
+	url?: string,
+	hash?: string,
+	advance = false,
+	locale?: string | null
+) => {
 	return useQuery( {
-		queryKey: [ 'url', 'basic-metrics', url, advance ],
+		queryKey: [ 'url', 'basic-metrics', url, advance, locale ],
 		queryFn: (): Promise< UrlBasicMetricsQueryResponse > =>
 			wp.req.get(
 				{
 					path: '/site-profiler/metrics/basic',
 					apiNamespace: 'wpcom/v2',
 				},
-				{ url, ...( advance ? { advance: '1' } : {} ) }
+				{ url, ...( advance ? { advance: '1' } : {} ), locale }
 			),
 		select: mapScores,
 		meta: {

diff --git a/client/data/site-profiler/use-url-performance-insights.ts b/client/data/site-profiler/use-url-performance-insights.ts
@@ -6,16 +6,20 @@ function mapResult( response: UrlPerformanceInsightsQueryResponse ) {
 	return response.pagespeed;
 }
 
-export const useUrlPerformanceInsightsQuery = ( url?: string, hash?: string ) => {
+export const useUrlPerformanceInsightsQuery = (
+	url?: string,
+	hash?: string,
+	locale?: string | null
+) => {
 	return useQuery( {
-		queryKey: [ 'url', 'performance', url, hash ],
+		queryKey: [ 'url', 'performance', url, hash, locale ],
 		queryFn: () =>
 			wp.req.get(
 				{
 					path: '/site-profiler/metrics/advanced/insights',
 					apiNamespace: 'wpcom/v2',
 				},
-				{ url, hash }
+				{ url, hash, locale }
 			),
 		meta: {
 			persist: false,

diff --git a/client/hosting/performance/site-performance.tsx b/client/hosting/performance/site-performance.tsx
@@ -1,7 +1,7 @@
 import page from '@automattic/calypso-router';
 import { useMobileBreakpoint } from '@automattic/viewport-react';
 import { Button } from '@wordpress/components';
-import { translate } from 'i18n-calypso';
+import { translate, getLocaleSlug } from 'i18n-calypso';
 import moment from 'moment';
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useSiteSettings } from 'calypso/blocks/plugins-scheduled-updates/hooks/use-site-settings';
@@ -53,13 +53,15 @@ const usePerformanceReport = (
 
 	const [ retestState, setRetestState ] = useState( 'idle' );
 
+	const localeSlug = getLocaleSlug();
+
 	const {
 		data: basicMetrics,
 		isError: isBasicMetricsError,
 		isFetched: isBasicMetricsFetched,
 		isLoading: isLoadingBasicMetrics,
 		refetch: requeueAdvancedMetrics,
-	} = useUrlBasicMetricsQuery( url, hash, true );
+	} = useUrlBasicMetricsQuery( url, hash, true, localeSlug );
 	const { final_url: finalUrl, token } = basicMetrics || {};
 	useEffect( () => {
 		if ( token && finalUrl ) {
@@ -80,7 +82,7 @@ const usePerformanceReport = (
 		status: insightsStatus,
 		isError: isInsightsError,
 		isLoading: isLoadingInsights,
-	} = useUrlPerformanceInsightsQuery( url, token ?? hash );
+	} = useUrlPerformanceInsightsQuery( url, token ?? hash, localeSlug );
 
 	const mobileReport =
 		typeof performanceInsights?.mobile === 'string' ? undefined : performanceInsights?.mobile;

diff --git a/client/performance-profiler/pages/dashboard/index.tsx b/client/performance-profiler/pages/dashboard/index.tsx
@@ -1,7 +1,6 @@
 import clsx from 'clsx';
 import { useTranslate } from 'i18n-calypso';
 import React, { useEffect, useRef } from 'react';
-import './style.scss';
 import DocumentHead from 'calypso/components/data/document-head';
 import { PerformanceReport } from 'calypso/data/site-profiler/types';
 import { useUrlBasicMetricsQuery } from 'calypso/data/site-profiler/use-url-basic-metrics-query';
@@ -17,6 +16,8 @@ import { profilerVersion } from 'calypso/performance-profiler/utils/profiler-ver
 import { updateQueryParams } from 'calypso/performance-profiler/utils/query-params';
 import { LoadingScreen } from '../loading-screen';
 
+import './style.scss';
+
 type PerformanceProfilerDashboardProps = {
 	url: string;
 	tab: TabType;
@@ -33,10 +34,10 @@ export const PerformanceProfilerDashboard = ( props: PerformanceProfilerDashboar
 		data: basicMetrics,
 		isError: isBasicMetricsError,
 		isFetched,
-	} = useUrlBasicMetricsQuery( url, hash, true );
+	} = useUrlBasicMetricsQuery( url, hash, true, translate.localeSlug );
 	const { final_url: finalUrl, token } = basicMetrics || {};
 	const { data: performanceInsights, isError: isPerformanceInsightsError } =
-		useUrlPerformanceInsightsQuery( url, hash );
+		useUrlPerformanceInsightsQuery( url, hash, translate.localeSlug );
 	const isError =
 		isBasicMetricsError ||
 		isPerformanceInsightsError ||