diff --git a/plugins/woocommerce-admin/client/analytics/components/report-table/index.js b/plugins/woocommerce-admin/client/analytics/components/report-table/index.js
index 033b17fad69..300af420eee 100644
--- a/plugins/woocommerce-admin/client/analytics/components/report-table/index.js
+++ b/plugins/woocommerce-admin/client/analytics/components/report-table/index.js
@@ -116,7 +116,8 @@ ReportTable.defaultProps = {
export default compose(
withSelect( ( select, props ) => {
const { endpoint, getSummary, query, tableQuery } = props;
- const primaryData = getSummary ? getReportChartData( endpoint, 'primary', query, select ) : {};
+ const chartEndpoint = 'variations' === endpoint ? 'products' : endpoint;
+ const primaryData = getSummary ? getReportChartData( chartEndpoint, 'primary', query, select ) : {};
const tableData = getReportTableData( endpoint, query, select, tableQuery );
return {
diff --git a/plugins/woocommerce-admin/client/analytics/report/products/table-variations.js b/plugins/woocommerce-admin/client/analytics/report/products/table-variations.js
index 3285f4bcaf9..d2ad073a2da 100644
--- a/plugins/woocommerce-admin/client/analytics/report/products/table-variations.js
+++ b/plugins/woocommerce-admin/client/analytics/report/products/table-variations.js
@@ -2,9 +2,9 @@
/**
* External dependencies
*/
-import { __ } from '@wordpress/i18n';
+import { __, _n } from '@wordpress/i18n';
import { Component } from '@wordpress/element';
-import { map } from 'lodash';
+import { map, get } from 'lodash';
/**
* WooCommerce dependencies
@@ -17,6 +17,7 @@ import { getNewPath, getPersistedQuery } from '@woocommerce/navigation';
* Internal dependencies
*/
import ReportTable from 'analytics/components/report-table';
+import { numberFormat } from 'lib/number';
export default class VariationsReportTable extends Component {
constructor() {
@@ -26,11 +27,11 @@ export default class VariationsReportTable extends Component {
this.getRowsContent = this.getRowsContent.bind( this );
}
- getVariationName( variation ) {
- return variation.attributes.reduce( ( desc, attribute, index, arr ) => {
- desc += `${ attribute.option }${ arr.length === index + 1 ? '' : ', ' }`;
- return desc;
- }, variation.product_name + ' / ' );
+ getVariationName( row ) {
+ const extendedInfo = get( row, 'extended_info', {} );
+ const attributes = get( extendedInfo, 'attributes', {} );
+
+ return extendedInfo.name + ' / ' + attributes.map( a => a.option ).join( ', ' );
}
getHeadersContent() {
@@ -94,10 +95,15 @@ export default class VariationsReportTable extends Component {
filter: 'advanced',
product_includes: query.products,
} );
+ const editPostLink = `post.php?post=${ product_id }&action=edit`;
return [
{
- display: name,
+ display: (
+
+ { name }
+
+ ),
value: name,
},
{
@@ -118,7 +124,7 @@ export default class VariationsReportTable extends Component {
},
{
display: (
-
+
{ stockStatuses[ stock_status ] }
),
@@ -132,6 +138,31 @@ export default class VariationsReportTable extends Component {
} );
}
+ getSummary( totals ) {
+ if ( ! totals ) {
+ return [];
+ }
+ return [
+ {
+ // @TODO: When primaryData is segmented, fix this to reflect variations, not products.
+ label: _n( 'variation sold', 'variations sold', totals.products_count, 'wc-admin' ),
+ value: numberFormat( totals.products_count ),
+ },
+ {
+ label: _n( 'item sold', 'items sold', totals.items_sold, 'wc-admin' ),
+ value: numberFormat( totals.items_sold ),
+ },
+ {
+ label: __( 'gross revenue', 'wc-admin' ),
+ value: formatCurrency( totals.gross_revenue ),
+ },
+ {
+ label: _n( 'orders', 'orders', totals.orders_count, 'wc-admin' ),
+ value: numberFormat( totals.orders_count ),
+ },
+ ];
+ }
+
render() {
const { query } = this.props;
@@ -150,9 +181,11 @@ export default class VariationsReportTable extends Component {
itemIdField="product_id"
labels={ labels }
query={ query }
+ getSummary={ this.getSummary }
tableQuery={ {
orderby: query.orderby || 'items_sold',
order: query.order || 'desc',
+ extended_info: true,
} }
title={ __( 'Variations', 'wc-admin' ) }
/>
diff --git a/plugins/woocommerce-admin/client/store/reports/items/resolvers.js b/plugins/woocommerce-admin/client/store/reports/items/resolvers.js
index dcf1abe3aaa..0d2ecfe3449 100644
--- a/plugins/woocommerce-admin/client/store/reports/items/resolvers.js
+++ b/plugins/woocommerce-admin/client/store/reports/items/resolvers.js
@@ -20,7 +20,7 @@ export default {
async getReportItems( ...args ) {
const [ endpoint, query ] = args.slice( -2 );
- const swaggerEndpoints = [ 'categories', 'coupons', 'taxes', 'variations' ];
+ const swaggerEndpoints = [ 'categories', 'coupons', 'taxes' ];
if ( swaggerEndpoints.indexOf( endpoint ) >= 0 ) {
try {
const response = await fetch(