WPORG Plugins: use 1.2 endpoint and pass locale parameter. (#57636)

* WPORG Plugins: use 1.2 endpoint and pass locale parameter. * WPORG Plugins: use 1.2 endpoint, pass locale parameter. * Fixes tests. * Plugins API: refines fields to fetch. * Plugins Search: add tracks event when searching for a plugin. (#57694) * Plugins Search: add tracks event when searching for a plugin. * Plugins Search: uses result_count key instead of results. * Plugins Search: rename track event to be more descriptive. * Plugins Browser: use the correct recordTracksEvent action creator. Co-authored-by: cpap <papazoglou.charalampos@gmail.com> * Plugins Search: fixes test comment. * Plugins Search: limit the data needed. Co-authored-by: cpap <papazoglou.charalampos@gmail.com>
Automattic · Nov 10, 2021 · b019e58 · b019e58
1 parent 0178a4a
commit b019e58
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 82 deletions.
diff --git a/client/lib/wporg/index.js b/client/lib/wporg/index.js
@@ -1,51 +1,28 @@
 import languages from '@automattic/languages';
-import debugFactory from 'debug';
-import i18n from 'i18n-calypso';
 import { find } from 'lodash';
 import { stringify as stringifyQs } from 'qs';
-import jsonp from './jsonp';
-
-const debug = debugFactory( 'wporg' );
 
 /**
  * Constants
  */
-const WPORG_PLUGINS_LIST = 'https://api.wordpress.org/plugins/info/1.1/?action=query_plugins';
+const WPORG_PLUGINS_ENDPOINT = 'https://api.wordpress.org/plugins/info/1.2/';
 const DEFAULT_PAGE_SIZE = 24;
 const DEFAULT_CATEGORY = 'all';
 const DEFAULT_FIRST_PAGE = 1;
 
 const WPORG_THEMES_ENDPOINT = 'https://api.wordpress.org/themes/info/1.1/';
 const WPORG_CORE_TRANSLATIONS_ENDPOINT = 'https://api.wordpress.org/translations/core/1.0/';
 
-function getWporgLocaleCode() {
-	const currentLocaleCode = i18n.getLocaleSlug();
-	let wpOrgLocaleCode = find( languages, { langSlug: currentLocaleCode } ).wpLocale;
+function getWporgLocaleCode( currentUserLocale ) {
+	let wpOrgLocaleCode = find( languages, { langSlug: currentUserLocale } ).wpLocale;
 
 	if ( wpOrgLocaleCode === '' ) {
-		wpOrgLocaleCode = currentLocaleCode;
+		wpOrgLocaleCode = currentUserLocale;
 	}
 
 	return wpOrgLocaleCode;
 }
 
-async function pluginRequest( url, body ) {
-	try {
-		const response = await fetch( url, {
-			method: 'POST',
-			headers: { Accept: 'application/json', 'Content-Type': 'application/x-www-form-urlencoded' },
-			body,
-		} );
-
-		if ( response.ok ) {
-			return [ null, await response.json() ];
-		}
-		return [ new Error( await response.body ), null ];
-	} catch ( error ) {
-		return [ error, null ];
-	}
-}
-
 async function getRequest( url, query ) {
 	const response = await fetch( `${ url }?${ stringifyQs( query ) }`, {
 		method: 'GET',
@@ -64,61 +41,40 @@ async function getRequest( url, query ) {
  * @param {string} pluginSlug The plugin identifier.
  * @returns {Promise} Promise with the plugins details.
  */
-export function fetchPluginInformation( pluginSlug ) {
+export function fetchPluginInformation( pluginSlug, locale ) {
 	const query = {
-		fields: 'short_description,icons,banners,compatibility,ratings,-contributors',
-		locale: getWporgLocaleCode(),
+		action: 'plugin_information',
+		'request[slug]': pluginSlug.replace( new RegExp( '.php$' ), '' ),
+		'request[locale]': getWporgLocaleCode( locale ),
+		'request[fields]': 'icons,short_description,-contributors,-added,-donate_link,-homepage',
 	};
 
-	pluginSlug = pluginSlug.replace( new RegExp( '.php$' ), '' );
-
-	const baseUrl = 'https://api.wordpress.org/plugins/info/1.0/' + pluginSlug + '.jsonp';
-
-	return new Promise( ( resolve, reject ) => {
-		jsonp( baseUrl, query, function ( error, data ) {
-			if ( error ) {
-				debug( 'error downloading plugin details from .org: %s', error );
-				reject( error );
-				return;
-			}
-
-			if ( ! data || ! data.slug ) {
-				debug( 'unrecognized format fetching plugin details from .org: %s', data );
-				reject( new Error( 'Unrecognized response format' ) );
-				return;
-			}
-
-			resolve( data );
-		} );
-	} );
+	return getRequest( WPORG_PLUGINS_ENDPOINT, query );
 }
 
-export function fetchPluginsList( options, callback ) {
-	let payload;
+export function fetchPluginsList( options ) {
 	// default variables;
 	const page = options.page || DEFAULT_FIRST_PAGE;
 	const pageSize = options.pageSize || DEFAULT_PAGE_SIZE;
 	const category = options.category || DEFAULT_CATEGORY;
 	const search = options.search;
 
-	payload =
-		'request[page]=' +
-		page +
-		'&request[per_page]=' +
-		pageSize +
-		'&request[fields][icons]=1&request[fields][banners]=1' +
-		'&request[fields][compatibility]=1&request[fields][tested]=0' +
-		'&request[fields][requires]=0&request[fields][sections]=0';
+	const query = {
+		action: 'query_plugins',
+		'request[page]': page,
+		'request[per_page]': pageSize,
+		'request[fields]':
+			'icons,-active_installs,-downloaded,-last_updated,-ratings,-rating,-requires,-requires_php,-tags,-tested,-contributors,-added,-donate_link,-homepage',
+		'request[locale]': getWporgLocaleCode( options.locale ),
+	};
 
 	if ( search ) {
-		payload += '&request[search]=' + search;
+		query[ 'request[search]' ] = search;
 	} else {
-		payload += '&request[browse]=' + category;
+		query[ 'request[browse]' ] = category;
 	}
 
-	pluginRequest( WPORG_PLUGINS_LIST, encodeURI( payload ) ).then( ( [ err, data ] ) => {
-		callback( err, data );
-	} );
+	return getRequest( WPORG_PLUGINS_ENDPOINT, query );
 }
 
 /**

diff --git a/client/state/plugins/wporg/actions.js b/client/state/plugins/wporg/actions.js
@@ -10,6 +10,8 @@ import {
 	PLUGINS_WPORG_PLUGIN_RECEIVE,
 	PLUGINS_WPORG_PLUGIN_REQUEST,
 } from 'calypso/state/action-types';
+import { recordTracksEvent } from 'calypso/state/analytics/actions';
+import { getCurrentUserLocale } from 'calypso/state/current-user/selectors';
 import {
 	getNextPluginsListPage,
 	isFetching,
@@ -32,7 +34,7 @@ export function fetchPluginData( pluginSlug ) {
 		} );
 
 		try {
-			const data = await fetchPluginInformation( pluginSlug );
+			const data = await fetchPluginInformation( pluginSlug, getCurrentUserLocale( getState() ) );
 
 			dispatch( {
 				type: PLUGINS_WPORG_PLUGIN_RECEIVE,
@@ -118,19 +120,28 @@ export function fetchPluginsList(
 			return;
 		}
 
-		fetchWporgPluginsList(
-			{
-				pageSize,
-				page,
-				category,
-				search: searchTerm,
-			},
-			function ( error, data ) {
-				dispatch(
-					receivePluginsList( category, page, searchTerm, data?.plugins ?? [], error, data?.info )
-				);
-			}
-		);
+		return fetchWporgPluginsList( {
+			pageSize,
+			page,
+			category,
+			search: searchTerm,
+			locale: getCurrentUserLocale( getState() ),
+		} )
+			.then( ( { info, plugins } ) => {
+				dispatch( receivePluginsList( category, page, searchTerm, plugins, null, info ) );
+				// Do not trigger a new tracks event for subsequent pages.
+				if ( searchTerm && info?.page === 1 ) {
+					dispatch(
+						recordTracksEvent( 'calypso_plugins_search_results_show', {
+							search_term: searchTerm,
+							results_count: info?.results,
+						} )
+					);
+				}
+			} )
+			.catch( ( error ) => {
+				dispatch( receivePluginsList( category, page, searchTerm, [], error ) );
+			} );
 	};
 }
 

diff --git a/client/state/plugins/wporg/test/actions.js b/client/state/plugins/wporg/test/actions.js
@@ -71,9 +71,9 @@ describe( 'WPorg Data Actions', () => {
 		expect( fetchPluginsList ).toBeInstanceOf( Function );
 	} );
 
-	test( 'FetchPluginList action should dispatch two actions and make a request', async () => {
+	test( 'FetchPluginList action should dispatch 3 actions and make a request', async () => {
 		await store.dispatch( fetchPluginsList( 'new', 1, undefined ) );
-		expect( store.dispatch ).toHaveBeenCalledTimes( 2 );
+		expect( store.dispatch ).toHaveBeenCalledTimes( 3 );
 		expect( wporg.fetchPluginsList ).toHaveBeenCalledTimes( 1 );
 	} );