2018-05-15 15:06:15 +00:00
|
|
|
/** @format */
|
|
|
|
/**
|
|
|
|
* External dependencies
|
|
|
|
*/
|
2018-08-20 21:24:17 +00:00
|
|
|
import { __ } from '@wordpress/i18n';
|
|
|
|
import { applyFilters } from '@wordpress/hooks';
|
2019-07-05 08:15:49 +00:00
|
|
|
import { Component } from '@wordpress/element';
|
2019-02-01 09:55:19 +00:00
|
|
|
import { compose } from '@wordpress/compose';
|
2018-06-14 20:15:11 +00:00
|
|
|
import PropTypes from 'prop-types';
|
2018-08-20 21:24:17 +00:00
|
|
|
import { find } from 'lodash';
|
2018-05-15 15:06:15 +00:00
|
|
|
|
2018-11-15 18:16:23 +00:00
|
|
|
/**
|
|
|
|
* WooCommerce dependencies
|
|
|
|
*/
|
|
|
|
import { useFilters } from '@woocommerce/components';
|
2019-02-26 10:06:37 +00:00
|
|
|
import { getQuery, getSearchWords } from '@woocommerce/navigation';
|
2019-09-23 21:47:08 +00:00
|
|
|
import { getSetting } from '@woocommerce/wc-admin-settings';
|
2018-11-15 18:16:23 +00:00
|
|
|
|
2018-05-15 15:06:15 +00:00
|
|
|
/**
|
|
|
|
* Internal dependencies
|
|
|
|
*/
|
Add loading indicators, error state, and EmptyContent to the revenue report. (#347, woocommerce/woocommerce-admin#348)
* Add loading indiciators for the revenue report.
* Improve accessibility, and fix up some documentation comments.
* Fix top border on mobile
* Add EmptyContent Component and revenue error/empty states. (https://github.com/woocommerce/woocommerce-admin/pull/348)
* Add EmptyContent Component and revenue error/empty states.
* Move relative image handling to ImageAsset, combine secondary and primary action rendering, add some missing isRequired proptypes, add empty error handling.
* Handle PR Feedback: Clean up button css, set a default for illustration, fix deprecation typo, some code cleanup.
2018-09-05 16:45:49 +00:00
|
|
|
import './style.scss';
|
2018-08-20 21:24:17 +00:00
|
|
|
import OrdersReport from './orders';
|
2018-07-12 01:43:33 +00:00
|
|
|
import ProductsReport from './products';
|
2018-08-20 21:24:17 +00:00
|
|
|
import RevenueReport from './revenue';
|
2018-11-16 13:33:58 +00:00
|
|
|
import CategoriesReport from './categories';
|
2018-09-17 02:26:34 +00:00
|
|
|
import CouponsReport from './coupons';
|
2018-11-14 21:04:59 +00:00
|
|
|
import TaxesReport from './taxes';
|
2018-12-17 20:50:45 +00:00
|
|
|
import DownloadsReport from './downloads';
|
2018-12-14 23:58:08 +00:00
|
|
|
import StockReport from './stock';
|
2018-12-06 22:21:46 +00:00
|
|
|
import CustomersReport from './customers';
|
2019-02-26 09:28:50 +00:00
|
|
|
import ReportError from 'analytics/components/report-error';
|
2019-02-01 09:55:19 +00:00
|
|
|
import { searchItemsByString } from 'wc-api/items/utils';
|
|
|
|
import withSelect from 'wc-api/with-select';
|
2018-08-20 21:24:17 +00:00
|
|
|
|
2019-07-05 08:15:49 +00:00
|
|
|
export const REPORTS_FILTER = 'woocommerce_admin_reports_list';
|
2019-09-23 21:47:08 +00:00
|
|
|
const manageStock = getSetting( 'manageStock', 'no' );
|
2018-08-20 21:24:17 +00:00
|
|
|
|
2019-07-05 08:15:49 +00:00
|
|
|
export const getReports = () => {
|
2019-02-12 20:02:02 +00:00
|
|
|
const reports = [
|
2018-08-20 21:24:17 +00:00
|
|
|
{
|
|
|
|
report: 'revenue',
|
2019-03-13 17:14:02 +00:00
|
|
|
title: __( 'Revenue', 'woocommerce-admin' ),
|
2018-08-20 21:24:17 +00:00
|
|
|
component: RevenueReport,
|
|
|
|
},
|
|
|
|
{
|
|
|
|
report: 'products',
|
2019-03-13 17:14:02 +00:00
|
|
|
title: __( 'Products', 'woocommerce-admin' ),
|
2018-08-20 21:24:17 +00:00
|
|
|
component: ProductsReport,
|
|
|
|
},
|
|
|
|
{
|
|
|
|
report: 'orders',
|
2019-03-13 17:14:02 +00:00
|
|
|
title: __( 'Orders', 'woocommerce-admin' ),
|
2018-08-20 21:24:17 +00:00
|
|
|
component: OrdersReport,
|
|
|
|
},
|
2018-11-16 13:33:58 +00:00
|
|
|
{
|
|
|
|
report: 'categories',
|
2019-03-13 17:14:02 +00:00
|
|
|
title: __( 'Categories', 'woocommerce-admin' ),
|
2018-11-16 13:33:58 +00:00
|
|
|
component: CategoriesReport,
|
|
|
|
},
|
2018-09-17 02:26:34 +00:00
|
|
|
{
|
|
|
|
report: 'coupons',
|
2019-03-13 17:14:02 +00:00
|
|
|
title: __( 'Coupons', 'woocommerce-admin' ),
|
2018-09-17 02:26:34 +00:00
|
|
|
component: CouponsReport,
|
|
|
|
},
|
2018-11-14 21:04:59 +00:00
|
|
|
{
|
|
|
|
report: 'taxes',
|
2019-03-13 17:14:02 +00:00
|
|
|
title: __( 'Taxes', 'woocommerce-admin' ),
|
2018-11-14 21:04:59 +00:00
|
|
|
component: TaxesReport,
|
|
|
|
},
|
2018-12-17 20:50:45 +00:00
|
|
|
{
|
|
|
|
report: 'downloads',
|
2019-03-13 17:14:02 +00:00
|
|
|
title: __( 'Downloads', 'woocommerce-admin' ),
|
2018-12-17 20:50:45 +00:00
|
|
|
component: DownloadsReport,
|
|
|
|
},
|
2019-09-23 21:47:08 +00:00
|
|
|
'yes' === manageStock
|
2019-03-21 05:42:07 +00:00
|
|
|
? {
|
|
|
|
report: 'stock',
|
|
|
|
title: __( 'Stock', 'woocommerce-admin' ),
|
|
|
|
component: StockReport,
|
|
|
|
}
|
|
|
|
: null,
|
2018-12-06 22:21:46 +00:00
|
|
|
{
|
|
|
|
report: 'customers',
|
2019-03-13 17:14:02 +00:00
|
|
|
title: __( 'Customers', 'woocommerce-admin' ),
|
2018-12-06 22:21:46 +00:00
|
|
|
component: CustomersReport,
|
|
|
|
},
|
2018-12-19 11:18:43 +00:00
|
|
|
{
|
|
|
|
report: 'downloads',
|
2019-03-13 17:14:02 +00:00
|
|
|
title: __( 'Downloads', 'woocommerce-admin' ),
|
2018-12-19 11:18:43 +00:00
|
|
|
component: DownloadsReport,
|
|
|
|
},
|
2019-03-21 05:42:07 +00:00
|
|
|
].filter( Boolean );
|
2018-08-20 21:24:17 +00:00
|
|
|
|
2019-02-12 20:02:02 +00:00
|
|
|
return applyFilters( REPORTS_FILTER, reports );
|
2018-08-20 21:24:17 +00:00
|
|
|
};
|
2018-05-15 15:06:15 +00:00
|
|
|
|
2018-06-14 20:15:11 +00:00
|
|
|
class Report extends Component {
|
2018-08-20 21:24:17 +00:00
|
|
|
constructor() {
|
|
|
|
super( ...arguments );
|
|
|
|
|
|
|
|
this.state = {
|
|
|
|
hasError: false,
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
componentDidCatch( error ) {
|
|
|
|
this.setState( {
|
|
|
|
hasError: true,
|
|
|
|
} );
|
|
|
|
/* eslint-disable no-console */
|
|
|
|
console.warn( error );
|
|
|
|
/* eslint-enable no-console */
|
|
|
|
}
|
|
|
|
|
2018-05-15 15:06:15 +00:00
|
|
|
render() {
|
2018-08-20 21:24:17 +00:00
|
|
|
if ( this.state.hasError ) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
2019-02-26 09:28:50 +00:00
|
|
|
const { params, isError } = this.props;
|
|
|
|
|
|
|
|
if ( isError ) {
|
|
|
|
return <ReportError isError />;
|
|
|
|
}
|
|
|
|
|
2018-08-20 21:24:17 +00:00
|
|
|
const report = find( getReports(), { report: params.report } );
|
|
|
|
if ( ! report ) {
|
|
|
|
return null;
|
2018-06-14 20:15:11 +00:00
|
|
|
}
|
2018-08-20 21:24:17 +00:00
|
|
|
const Container = report.component;
|
2019-07-05 08:15:49 +00:00
|
|
|
return <Container { ...this.props } />;
|
2018-05-15 15:06:15 +00:00
|
|
|
}
|
|
|
|
}
|
2018-06-14 20:15:11 +00:00
|
|
|
|
|
|
|
Report.propTypes = {
|
|
|
|
params: PropTypes.object.isRequired,
|
|
|
|
};
|
|
|
|
|
2019-02-01 09:55:19 +00:00
|
|
|
export default compose(
|
|
|
|
useFilters( REPORTS_FILTER ),
|
|
|
|
withSelect( ( select, props ) => {
|
2019-02-26 10:06:37 +00:00
|
|
|
const query = getQuery();
|
|
|
|
const { search } = query;
|
2019-02-01 09:55:19 +00:00
|
|
|
|
|
|
|
if ( ! search ) {
|
|
|
|
return {};
|
|
|
|
}
|
|
|
|
|
|
|
|
const { report } = props.params;
|
2019-02-26 10:06:37 +00:00
|
|
|
const searchWords = getSearchWords( query );
|
2019-03-07 02:57:22 +00:00
|
|
|
// Single Category view in Categories Report uses the products endpoint, so search must also.
|
|
|
|
const mappedReport =
|
|
|
|
'categories' === report && 'single_category' === query.filter ? 'products' : report;
|
|
|
|
const itemsResult = searchItemsByString( select, mappedReport, searchWords );
|
2019-02-26 09:28:50 +00:00
|
|
|
const { isError, isRequesting, items } = itemsResult;
|
2019-02-01 09:55:19 +00:00
|
|
|
const ids = Object.keys( items );
|
|
|
|
if ( ! ids.length ) {
|
2019-02-20 09:21:05 +00:00
|
|
|
return {
|
2019-02-26 09:28:50 +00:00
|
|
|
isError,
|
|
|
|
isRequesting,
|
2019-02-20 09:21:05 +00:00
|
|
|
};
|
2019-02-01 09:55:19 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
return {
|
2019-02-26 09:28:50 +00:00
|
|
|
isError,
|
|
|
|
isRequesting,
|
2019-02-01 09:55:19 +00:00
|
|
|
query: {
|
|
|
|
...props.query,
|
2019-03-07 02:57:22 +00:00
|
|
|
[ mappedReport ]: ids.join( ',' ),
|
2019-02-01 09:55:19 +00:00
|
|
|
},
|
|
|
|
};
|
|
|
|
} )
|
|
|
|
)( Report );
|