Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Refactor to remove products chart.js (https://github.com/woocommerce/woocommerce-admin/pull/799) 

* Refactor to remove products chartjs

* Delete chartjs

* Fix copy pasta error
This commit is contained in:
Jonathan Belcher 2018-11-12 11:28:03 -05:00 committed by GitHub
parent e49997381b
commit bccae052ae
3 changed files with 35 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
plugins/woocommerce-admin/client/analytics/report/products/chart.js
View File

@ -1,75 +0,0 @@
/** @format */
/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { Component, Fragment } from '@wordpress/element';
import { find } from 'lodash';
import PropTypes from 'prop-types';
/**
* Internal dependencies
*/
import ReportChart from 'analytics/components/report-chart';
import ReportSummary from 'analytics/components/report-summary';
class ProductsReportChart extends Component {
getCharts() {
return [
{
key: 'items_sold',
label: __( 'Items Sold', 'wc-admin' ),
type: 'number',
},
{
key: 'gross_revenue',
label: __( 'Gross Revenue', 'wc-admin' ),
type: 'currency',
},
{
key: 'orders_count',
label: __( 'Orders Count', 'wc-admin' ),
type: 'number',
},
];
}
getSelectedChart() {
const { query } = this.props;
const charts = this.getCharts();
const chart = find( charts, { key: query.chart } );
if ( chart ) {
return chart;
}
return charts[ 0 ];
}
render() {
const { path, query } = this.props;
return (
<Fragment>
<ReportSummary
charts={ this.getCharts() }
endpoint="products"
query={ query }
selectedChart={ this.getSelectedChart() }
/>
<ReportChart
charts={ this.getCharts() }
endpoint="products"
path={ path }
query={ query }
selectedChart={ this.getSelectedChart() }
/>
</Fragment>
);
}
}
ProductsReportChart.propTypes = {
path: PropTypes.string.isRequired,
query: PropTypes.object.isRequired,
};
export default ProductsReportChart;

18
plugins/woocommerce-admin/client/analytics/report/products/config.js
View File

@ -10,6 +10,24 @@ import { __ } from '@wordpress/i18n';
import { getRequestByIdString } from 'lib/async-requests';
import { NAMESPACE } from 'store/constants';
export const charts = [
{
key: 'items_sold',
label: __( 'Items Sold', 'wc-admin' ),
type: 'number',
},
{
key: 'gross_revenue',
label: __( 'Gross Revenue', 'wc-admin' ),
type: 'currency',
},
{
key: 'orders_count',
label: __( 'Orders Count', 'wc-admin' ),
type: 'number',
},
];
const filterConfig = {
label: __( 'Show', 'wc-admin' ),
staticParams: [ 'chart' ],

20
plugins/woocommerce-admin/client/analytics/report/products/index.js
View File

@ -13,9 +13,11 @@ import { ReportFilters } from '@woocommerce/components';
/**
* Internal dependencies
*/
import { filters } from './config';
import ProductsReportChart from './chart';
import { charts, filters } from './config';
import getSelectedChart from 'lib/get-selected-chart';
import ProductsReportTable from './table';
import ReportChart from 'analytics/components/report-chart';
import ReportSummary from 'analytics/components/report-summary';
export default class ProductsReport extends Component {
render() {
@ -24,7 +26,19 @@ export default class ProductsReport extends Component {
return (
<Fragment>
<ReportFilters query={ query } path={ path } filters={ filters } />
<ProductsReportChart query={ query } path={ path } />
<ReportSummary
charts={ charts }
endpoint="products"
query={ query }
selectedChart={ getSelectedChart( query.chart, charts ) }
/>
<ReportChart
charts={ charts }
endpoint="products"
path={ path }
query={ query }
selectedChart={ getSelectedChart( query.chart, charts ) }
/>
<ProductsReportTable query={ query } />
</Fragment>
);