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 bd4020827ff..f7bdefd12db 100644 --- a/plugins/woocommerce-admin/client/analytics/components/report-table/index.js +++ b/plugins/woocommerce-admin/client/analytics/components/report-table/index.js @@ -5,7 +5,7 @@ import { applyFilters } from '@wordpress/hooks'; import { Component } from '@wordpress/element'; import { compose } from '@wordpress/compose'; -import { first, get, orderBy } from 'lodash'; +import { get, orderBy } from 'lodash'; import PropTypes from 'prop-types'; /** @@ -20,6 +20,7 @@ import { onQueryChange } from '@woocommerce/navigation'; import ReportError from 'analytics/components/report-error'; import { getReportChartData, getReportTableData } from 'store/reports/utils'; import withSelect from 'wc-api/with-select'; +import { extendTableData } from './utils'; const TABLE_FILTER = 'woocommerce_admin_report_table'; @@ -131,56 +132,6 @@ ReportTable.defaultProps = { tableQuery: {}, }; -const extendTableData = ( select, props, queriedTableData ) => { - const { extendItemsMethodNames, itemIdField, query } = props; - const itemsData = queriedTableData.items.data; - if ( - ! Array.isArray( itemsData ) || - ! itemsData.length || - ! extendItemsMethodNames || - ! itemIdField - ) { - return queriedTableData; - } - - const { - [ extendItemsMethodNames.isError ]: isErrorMethod, - [ extendItemsMethodNames.isRequesting ]: isRequestingMethod, - [ extendItemsMethodNames.load ]: loadMethod, - } = select( 'wc-api' ); - const extendQuery = { - include: itemsData.map( item => item[ itemIdField ] ).join( ',' ), - per_page: itemsData.length, - ...query, - }; - const extendedItems = loadMethod( extendQuery ); - const isExtendedItemsRequesting = isRequestingMethod ? isRequestingMethod( extendQuery ) : false; - const isExtendedItemsError = isErrorMethod ? isErrorMethod( extendQuery ) : false; - - const extendedItemsData = itemsData.map( item => { - const extendedItemData = first( - extendedItems.filter( extendedItem => item.id === extendedItem.id ) - ); - return { - ...item, - ...extendedItemData, - }; - } ); - - const isRequesting = queriedTableData.isRequesting || isExtendedItemsRequesting; - const isError = queriedTableData.isError || isExtendedItemsError; - - return { - ...queriedTableData, - isRequesting, - isError, - items: { - ...queriedTableData.items, - data: extendedItemsData, - }, - }; -}; - export default compose( withSelect( ( select, props ) => { const { endpoint, getSummary, query, tableData, tableQuery } = props; diff --git a/plugins/woocommerce-admin/client/analytics/components/report-table/utils.js b/plugins/woocommerce-admin/client/analytics/components/report-table/utils.js new file mode 100644 index 00000000000..81e2f3c095f --- /dev/null +++ b/plugins/woocommerce-admin/client/analytics/components/report-table/utils.js @@ -0,0 +1,55 @@ +/** @format */ +/** + * External dependencies + */ +import { first } from 'lodash'; + +export function extendTableData( select, props, queriedTableData ) { + const { extendItemsMethodNames, itemIdField, query } = props; + const itemsData = queriedTableData.items.data; + if ( + ! Array.isArray( itemsData ) || + ! itemsData.length || + ! extendItemsMethodNames || + ! itemIdField + ) { + return queriedTableData; + } + + const { + [ extendItemsMethodNames.isError ]: isErrorMethod, + [ extendItemsMethodNames.isRequesting ]: isRequestingMethod, + [ extendItemsMethodNames.load ]: loadMethod, + } = select( 'wc-api' ); + const extendQuery = { + include: itemsData.map( item => item[ itemIdField ] ).join( ',' ), + per_page: itemsData.length, + ...query, + }; + const extendedItems = loadMethod( extendQuery ); + const isExtendedItemsRequesting = isRequestingMethod ? isRequestingMethod( extendQuery ) : false; + const isExtendedItemsError = isErrorMethod ? isErrorMethod( extendQuery ) : false; + + const extendedItemsData = itemsData.map( item => { + const extendedItemData = first( + extendedItems.filter( extendedItem => item.id === extendedItem.id ) + ); + return { + ...item, + ...extendedItemData, + }; + } ); + + const isRequesting = queriedTableData.isRequesting || isExtendedItemsRequesting; + const isError = queriedTableData.isError || isExtendedItemsError; + + return { + ...queriedTableData, + isRequesting, + isError, + items: { + ...queriedTableData.items, + data: extendedItemsData, + }, + }; +}