diff --git a/plugins/woocommerce-admin/client/analytics/components/report-chart/index.js b/plugins/woocommerce-admin/client/analytics/components/report-chart/index.js index 4423cc65aa9..3fa25de6273 100644 --- a/plugins/woocommerce-admin/client/analytics/components/report-chart/index.js +++ b/plugins/woocommerce-admin/client/analytics/components/report-chart/index.js @@ -21,7 +21,6 @@ import { getPreviousDate, } from 'lib/date'; import { getReportChartData } from 'store/reports/utils'; -import { MAX_PER_PAGE } from 'store/constants'; import ReportError from 'analytics/components/report-error'; class ReportChart extends Component { @@ -100,32 +99,8 @@ ReportChart.propTypes = { export default compose( withSelect( ( select, props ) => { const { query, endpoint } = props; - const interval = getIntervalForQuery( query ); - const datesFromQuery = getCurrentDates( query ); - const baseArgs = { - order: 'asc', - interval: interval, - per_page: MAX_PER_PAGE, - }; - const primaryData = getReportChartData( - endpoint, - { - ...baseArgs, - after: datesFromQuery.primary.after, - before: datesFromQuery.primary.before, - }, - select - ); - - const secondaryData = getReportChartData( - endpoint, - { - ...baseArgs, - after: datesFromQuery.secondary.after, - before: datesFromQuery.secondary.before, - }, - select - ); + const primaryData = getReportChartData( endpoint, 'primary', query, select ); + const secondaryData = getReportChartData( endpoint, 'primary', query, select ); return { primaryData, secondaryData, diff --git a/plugins/woocommerce-admin/client/analytics/components/report-summary/index.js b/plugins/woocommerce-admin/client/analytics/components/report-summary/index.js index fa5ecdf644f..a03dcb7547d 100644 --- a/plugins/woocommerce-admin/client/analytics/components/report-summary/index.js +++ b/plugins/woocommerce-admin/client/analytics/components/report-summary/index.js @@ -15,7 +15,7 @@ import PropTypes from 'prop-types'; import { formatCurrency } from 'lib/currency'; import { getNewPath } from 'lib/nav-utils'; import { SummaryList, SummaryListPlaceholder, SummaryNumber } from '@woocommerce/components'; -import { getCurrentDates, getDateParamsFromQuery } from 'lib/date'; +import { getDateParamsFromQuery } from 'lib/date'; import { getSummaryNumbers } from 'store/reports/utils'; import ReportError from 'analytics/components/report-error'; class ReportSummary extends Component { @@ -93,15 +93,7 @@ ReportSummary.propTypes = { export default compose( withSelect( ( select, props ) => { const { query, endpoint } = props; - const datesFromQuery = getCurrentDates( query ); - const summaryNumbers = getSummaryNumbers( - endpoint, - { - primary: datesFromQuery.primary, - secondary: datesFromQuery.secondary, - }, - select - ); + const summaryNumbers = getSummaryNumbers( endpoint, query, select ); return { summaryNumbers, diff --git a/plugins/woocommerce-admin/client/analytics/report/orders/index.js b/plugins/woocommerce-admin/client/analytics/report/orders/index.js index de80ca9415e..2297320f3e7 100644 --- a/plugins/woocommerce-admin/client/analytics/report/orders/index.js +++ b/plugins/woocommerce-admin/client/analytics/report/orders/index.js @@ -15,9 +15,8 @@ import { get } from 'lodash'; import { EmptyContent, ReportFilters } from '@woocommerce/components'; import { filters, advancedFilterConfig } from './config'; import { getAdminLink } from 'lib/nav-utils'; -import { appendTimestamp, getCurrentDates, getIntervalForQuery } from 'lib/date'; +import { appendTimestamp, getCurrentDates } from 'lib/date'; import { getReportChartData } from 'store/reports/utils'; -import { MAX_PER_PAGE } from 'store/constants'; import OrdersReportChart from './chart'; import OrdersReportTable from './table'; @@ -98,23 +97,8 @@ OrdersReport.propTypes = { export default compose( withSelect( ( select, props ) => { const { query } = props; - const interval = getIntervalForQuery( query ); const datesFromQuery = getCurrentDates( query ); - const baseArgs = { - order: 'asc', - interval: interval, - per_page: MAX_PER_PAGE, - }; - - const primaryData = getReportChartData( - 'orders', - { - ...baseArgs, - after: datesFromQuery.primary.after, - before: datesFromQuery.primary.before, - }, - select - ); + const primaryData = getReportChartData( 'orders', 'primary', query, select ); const { getOrders, isGetOrdersError, isGetOrdersRequesting } = select( 'wc-admin' ); const tableQuery = { diff --git a/plugins/woocommerce-admin/client/store/reports/test/utils.js b/plugins/woocommerce-admin/client/store/reports/test/utils.js index f4596bcb8a3..d81ff76a201 100644 --- a/plugins/woocommerce-admin/client/store/reports/test/utils.js +++ b/plugins/woocommerce-admin/client/store/reports/test/utils.js @@ -76,7 +76,7 @@ describe( 'getReportChartData()', () => { setIsReportStatsRequesting( () => { return true; } ); - const result = getReportChartData( 'revenue', {}, select ); + const result = getReportChartData( 'revenue', 'primary', {}, select ); expect( result ).toEqual( { ...response, isRequesting: true } ); } ); @@ -87,7 +87,7 @@ describe( 'getReportChartData()', () => { setIsReportStatsError( () => { return true; } ); - const result = getReportChartData( 'revenue', {}, select ); + const result = getReportChartData( 'revenue', 'primary', {}, select ); expect( result ).toEqual( { ...response, isError: true } ); } ); @@ -122,7 +122,7 @@ describe( 'getReportChartData()', () => { }; } ); - const result = getReportChartData( 'revenue', {}, select ); + const result = getReportChartData( 'revenue', 'primary', {}, select ); expect( result ).toEqual( { ...response, data: { ...data } } ); } ); @@ -168,7 +168,7 @@ describe( 'getReportChartData()', () => { }; } ); - const actualResponse = getReportChartData( 'revenue', {}, select ); + const actualResponse = getReportChartData( 'revenue', 'primary', {}, select ); const expectedResponse = { ...response, data: { @@ -191,7 +191,7 @@ describe( 'getReportChartData()', () => { return false; } ); - const result = getReportChartData( 'revenue', {}, select ); + const result = getReportChartData( 'revenue', 'primary', {}, select ); expect( result ).toEqual( { ...response, isRequesting: true } ); } ); @@ -205,7 +205,7 @@ describe( 'getReportChartData()', () => { } return false; } ); - const result = getReportChartData( 'revenue', {}, select ); + const result = getReportChartData( 'revenue', 'primary', {}, select ); expect( result ).toEqual( { ...response, isError: true } ); } ); @@ -223,7 +223,7 @@ describe( 'getReportChartData()', () => { }; } ); - const result = getReportChartData( 'revenue', {}, select ); + const result = getReportChartData( 'revenue', 'primary', {}, select ); expect( result ).toEqual( { ...response, isEmpty: true } ); } ); } ); @@ -239,15 +239,11 @@ describe( 'getSummaryNumbers()', () => { }, }; - const dates = { - primary: { - after: '2018-10-10', - before: '2018-10-10', - }, - secondary: { - after: '2018-10-09', - before: '2018-10-09', - }, + const query = { + after: '2018-10-10', + before: '2018-10-10', + period: 'custom', + compare: 'previous_period', }; beforeAll( () => { @@ -280,7 +276,7 @@ describe( 'getSummaryNumbers()', () => { setIsReportStatsRequesting( () => { return true; } ); - const result = getSummaryNumbers( 'revenue', dates, select ); + const result = getSummaryNumbers( 'revenue', query, select ); expect( result ).toEqual( { ...response, isRequesting: true } ); } ); @@ -291,7 +287,7 @@ describe( 'getSummaryNumbers()', () => { setIsReportStatsError( () => { return true; } ); - const result = getSummaryNumbers( 'revenue', dates, select ); + const result = getSummaryNumbers( 'revenue', query, select ); expect( result ).toEqual( { ...response, isError: true } ); } ); @@ -319,8 +315,8 @@ describe( 'getSummaryNumbers()', () => { }; } ); - setGetReportStats( ( endpoint, query ) => { - if ( '2018-10-10T00:00:00+00:00' === query.after ) { + setGetReportStats( ( endpoint, _query ) => { + if ( '2018-10-10T00:00:00+00:00' === _query.after ) { return { data: { totals: totals.primary, @@ -336,7 +332,7 @@ describe( 'getSummaryNumbers()', () => { }; } ); - const result = getSummaryNumbers( 'revenue', dates, select ); + const result = getSummaryNumbers( 'revenue', query, select ); expect( result ).toEqual( { ...response, totals } ); } ); } ); diff --git a/plugins/woocommerce-admin/client/store/reports/utils.js b/plugins/woocommerce-admin/client/store/reports/utils.js index 9aa55215bd1..b3fd51a2c90 100644 --- a/plugins/woocommerce-admin/client/store/reports/utils.js +++ b/plugins/woocommerce-admin/client/store/reports/utils.js @@ -9,7 +9,7 @@ import { forEach, isNull } from 'lodash'; * Internal dependencies */ import { MAX_PER_PAGE } from 'store/constants'; -import { appendTimestamp } from 'lib/date'; +import { appendTimestamp, getCurrentDates, getIntervalForQuery } from 'lib/date'; /** * Returns true if a report object is empty. @@ -33,15 +33,34 @@ export function isReportDataEmpty( report ) { return false; } +/** + * Constructs and returns a query associated with a Report data request. + * + * @param {String} dataType 'primary' or 'secondary'. + * @param {Object} query query parameters in the url. + * @returns {Object} data request query parameters. + */ +function getRequestQuery( dataType, query ) { + const datesFromQuery = getCurrentDates( query ); + const interval = getIntervalForQuery( query ); + return { + order: 'asc', + interval, + per_page: MAX_PER_PAGE, + after: appendTimestamp( datesFromQuery[ dataType ].after, 'start' ), + before: appendTimestamp( datesFromQuery[ dataType ].before, 'end' ), + }; +} + /** * Returns summary number totals needed to render a report page. * * @param {String} endpoint Report API Endpoint - * @param {Object} dates Primary and secondary dates. + * @param {Object} query query parameters in the url * @param {object} select Instance of @wordpress/select * @return {Object} Object containing summary number responses. */ -export function getSummaryNumbers( endpoint, dates, select ) { +export function getSummaryNumbers( endpoint, query, select ) { const { getReportStats, isReportStatsRequesting, isReportStatsError } = select( 'wc-admin' ); const response = { isRequesting: false, @@ -52,16 +71,7 @@ export function getSummaryNumbers( endpoint, dates, select ) { }, }; - const baseQuery = { - interval: 'day', - per_page: 1, // We only need the `totals` part of the response. - }; - - const primaryQuery = { - ...baseQuery, - after: appendTimestamp( dates.primary.after, 'start' ), - before: appendTimestamp( dates.primary.before, 'end' ), - }; + const primaryQuery = getRequestQuery( 'primary', query ); const primary = getReportStats( endpoint, primaryQuery ); if ( isReportStatsRequesting( endpoint, primaryQuery ) ) { return { ...response, isRequesting: true }; @@ -71,12 +81,7 @@ export function getSummaryNumbers( endpoint, dates, select ) { const primaryTotals = ( primary && primary.data && primary.data.totals ) || null; - const secondaryQuery = { - ...baseQuery, - per_page: 1, - after: appendTimestamp( dates.secondary.after, 'start' ), - before: appendTimestamp( dates.secondary.before, 'end' ), - }; + const secondaryQuery = getRequestQuery( 'secondary', query ); const secondary = getReportStats( endpoint, secondaryQuery ); if ( isReportStatsRequesting( endpoint, secondaryQuery ) ) { return { ...response, isRequesting: true }; @@ -93,11 +98,12 @@ export function getSummaryNumbers( endpoint, dates, select ) { * Returns all of the data needed to render a chart with summary numbers on a report page. * * @param {String} endpoint Report API Endpoint - * @param {Object} query API arguments + * @param {String} dataType 'primary' or 'secondary' + * @param {Object} query query parameters in the url * @param {object} select Instance of @wordpress/select * @return {Object} Object containing API request information (response, fetching, and error details) */ -export function getReportChartData( endpoint, query, select ) { +export function getReportChartData( endpoint, dataType, query, select ) { const { getReportStats, isReportStatsRequesting, isReportStatsError } = select( 'wc-admin' ); const response = { @@ -110,14 +116,12 @@ export function getReportChartData( endpoint, query, select ) { }, }; - query.after = appendTimestamp( query.after, 'start' ); - query.before = appendTimestamp( query.before, 'end' ); + const requestQuery = getRequestQuery( dataType, query ); + const stats = getReportStats( endpoint, requestQuery ); - const stats = getReportStats( endpoint, query ); - - if ( isReportStatsRequesting( endpoint, query ) ) { + if ( isReportStatsRequesting( endpoint, requestQuery ) ) { return { ...response, isRequesting: true }; - } else if ( isReportStatsError( endpoint, query ) ) { + } else if ( isReportStatsError( endpoint, requestQuery ) ) { return { ...response, isError: true }; } else if ( isReportDataEmpty( stats ) ) { return { ...response, isEmpty: true }; @@ -135,17 +139,17 @@ export function getReportChartData( endpoint, query, select ) { const totalPages = Math.ceil( stats.totalResults / MAX_PER_PAGE ); for ( let i = 2; i <= totalPages; i++ ) { - const _query = { ...query, page: i }; - const _data = getReportStats( endpoint, _query ); - if ( isReportStatsRequesting( endpoint, _query ) ) { + const nextQuery = { ...requestQuery, page: i }; + const _data = getReportStats( endpoint, nextQuery ); + if ( isReportStatsRequesting( endpoint, nextQuery ) ) { continue; } - if ( isReportStatsError( endpoint, _query ) ) { + if ( isReportStatsError( endpoint, nextQuery ) ) { isError = true; isFetching = false; break; } - if ( ! isReportStatsRequesting( endpoint, _query ) ) { + if ( ! isReportStatsRequesting( endpoint, nextQuery ) ) { pagedData.push( _data ); if ( i === totalPages ) { isFetching = false;