Jetpack stats on home page (https://github.com/woocommerce/woocommerce-admin/pull/4481)

* Get Jetpack stats appearing on the home page

* Update hidden stats in stats overview test

* Make jetpack stats appear by default

* Add reportUrlType to dashboard store performance area

Co-authored-by: Rebecca Scott <me@becdetat.com>

plugins/woocommerce-admin/client/dashboard/store-performance/index.js

@@ -30,7 +30,7 @@ import withSelect from 'wc-api/with-select';
 import './style.scss';
 import { recordEvent } from 'lib/tracks';
 import { CurrencyContext } from 'lib/currency-context';
-import { getIndicatorData, getIndictorValues } from './utils';
+import { getIndicatorData, getIndicatorValues } from './utils';
 
 const { performanceIndicators: indicators } = getSetting( 'dataEndpoints', {
 	performanceIndicators: [],
@@ -146,7 +146,8 @@ class StorePerformance extends Component {
 							secondaryValue,
 							delta,
 							reportUrl,
-						} = getIndictorValues( {
+							reportUrlType,
+						} = getIndicatorValues( {
 							indicator,
 							primaryData,
 							secondaryData,
@@ -159,6 +160,7 @@ class StorePerformance extends Component {
 							<SummaryNumber
 								key={ i }
 								href={ reportUrl }
+								hrefType={ reportUrlType }
 								label={ indicator.label }
 								value={ primaryValue }
 								prevLabel={ prevLabel }

plugins/woocommerce-admin/client/dashboard/store-performance/utils.js

@@ -11,8 +11,23 @@ import { getCurrentDates, appendTimestamp } from '@woocommerce/date';
 import { SETTINGS_STORE_NAME } from '@woocommerce/data';
 import { getNewPath } from '@woocommerce/navigation';
 import { calculateDelta, formatValue } from '@woocommerce/number';
+import { getAdminLink } from '@woocommerce/wc-admin-settings';
 
-export const getIndictorValues = ( {
+function getReportUrl( href, persistedQuery, primaryItem ) {
+	if ( ! href ) {
+		return '';
+	}
+
+	if ( href === '/jetpack' ) {
+		return getAdminLink( 'admin.php?page=jetpack#/dashboard' );
+	}
+
+	return getNewPath( persistedQuery, href, {
+		chart: primaryItem.chart,
+	} );
+}
+
+export const getIndicatorValues = ( {
 	indicator,
 	primaryData,
 	secondaryData,
@@ -38,12 +53,8 @@ export const getIndictorValues = ( {
 			primaryItem._links.report[ 0 ] &&
 			primaryItem._links.report[ 0 ].href ) ||
 		'';
-	const reportUrl =
-		( href &&
-			getNewPath( persistedQuery, href, {
-				chart: primaryItem.chart,
-			} ) ) ||
-		'';
+	const reportUrl = getReportUrl( href, persistedQuery, primaryItem );
+	const reportUrlType = href === '/jetpack' ? 'wp-admin' : 'wc-admin';
 	const isCurrency = primaryItem.format === 'currency';
 
 	const delta = calculateDelta( primaryItem.value, secondaryItem.value );
@@ -58,6 +69,7 @@ export const getIndictorValues = ( {
 		secondaryValue,
 		delta,
 		reportUrl,
+		reportUrlType,
 	};
 };
 

plugins/woocommerce-admin/client/homepage/stats-overview/defaults.js

@@ -10,6 +10,8 @@ export const DEFAULT_STATS = applyFilters(
 		'revenue/net_revenue',
 		'orders/orders_count',
 		'products/items_sold',
+		'jetpack/stats/visitors',
+		'jetpack/stats/views',
 	]
 );
 

plugins/woocommerce-admin/client/homepage/stats-overview/stats-list.js

@@ -22,7 +22,7 @@ import { recordEvent } from 'lib/tracks';
 import { CurrencyContext } from 'lib/currency-context';
 import {
 	getIndicatorData,
-	getIndictorValues,
+	getIndicatorValues,
 } from 'dashboard/store-performance/utils';
 
 export const StatsList = ( {
@@ -62,7 +62,8 @@ export const StatsList = ( {
 					secondaryValue,
 					delta,
 					reportUrl,
-				} = getIndictorValues( {
+					reportUrlType,
+				} = getIndicatorValues( {
 					indicator: item,
 					primaryData,
 					secondaryData,
@@ -76,6 +77,7 @@ export const StatsList = ( {
 						isHomepage
 						key={ item.stat }
 						href={ reportUrl }
+						hrefType={ reportUrlType }
 						label={ item.label }
 						value={ primaryValue }
 						prevLabel={ __(

plugins/woocommerce-admin/packages/components/src/summary/number.js

@@ -21,6 +21,7 @@ import Link from '../link';
 const SummaryNumber = ( {
 	delta,
 	href,
+	hrefType,
 	isOpen,
 	label,
 	onToggle,
@@ -81,6 +82,7 @@ const SummaryNumber = ( {
 			containerProps.href = href;
 			containerProps.role = 'menuitem';
 			containerProps.onClick = onLinkClickCallback;
+			containerProps.type = hrefType;
 		}
 	} else {
 		Container = 'div';
@@ -154,6 +156,11 @@ SummaryNumber.propTypes = {
 	 * An internal link to the report focused on this number.
 	 */
 	href: PropTypes.string,
+	/**
+	 * The type of the link
+	 */
+	hrefType: PropTypes.oneOf( [ 'wp-admin', 'wc-admin', 'external' ] )
+		.isRequired,
 	/**
 	 * Boolean describing whether the menu list is open. Only applies in mobile view,
 	 * and only applies to the toggle-able item (first in the list).
@@ -196,6 +203,7 @@ SummaryNumber.propTypes = {
 
 SummaryNumber.defaultProps = {
 	href: '',
+	hrefType: 'wc-admin',
 	isOpen: false,
 	prevLabel: __( 'Previous Period:', 'woocommerce-admin' ),
 	reverseTrend: false,

plugins/woocommerce-admin/src/API/Reports/PerformanceIndicators/Controller.php

@@ -231,6 +231,8 @@ class Controller extends \WC_REST_Reports_Controller {
 			$this->endpoints[ $endpoint ] = '/jetpack/v4/module/' . $item['module'] . '/data';
 			$this->formats[ $stat ]       = $item['format'];
 		}
+
+		$this->urls['jetpack/stats'] = '/jetpack';
 	}
 
 	/**