AdvancedFilters: Create workable defaults for Reports that don't have them (https://github.com/woocommerce/woocommerce-admin/pull/7186)

* on Filter update, keep all queries

* update _x translator instructions

* fix revenue filters

* better default advFilter

* fix stock filters

* revert readme changelog
This commit is contained in:
Paul Sealock 2021-07-14 10:17:51 +12:00 committed by GitHub
parent db2b227d78
commit 3b2a153580
8 changed files with 286 additions and 176 deletions

View File

@ -1,7 +1,7 @@
/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { __, _x } from '@wordpress/i18n';
import { applyFilters } from '@wordpress/hooks';
import { dispatch } from '@wordpress/data';
@ -44,73 +44,86 @@ export const charts = applyFilters( CATEGORY_REPORT_CHARTS_FILTER, [
},
] );
export const advancedFilters = applyFilters(
CATEGORY_REPORT_ADVANCED_FILTERS_FILTER,
{
filters: {},
title: _x(
'Categories Match {{select /}} Filters',
'A sentence describing filters for Categories. See screen shot for context: https://cloudup.com/cSsUY9VeCVJ',
'woocommerce-admin'
),
}
);
const filterValues = [
{
label: __( 'All Categories', 'woocommerce-admin' ),
value: 'all',
},
{
label: __( 'Single Category', 'woocommerce-admin' ),
value: 'select_category',
chartMode: 'item-comparison',
subFilters: [
{
component: 'Search',
value: 'single_category',
chartMode: 'item-comparison',
path: [ 'select_category' ],
settings: {
type: 'categories',
param: 'categories',
getLabels: getCategoryLabels,
labels: {
placeholder: __(
'Type to search for a category',
'woocommerce-admin'
),
button: __( 'Single Category', 'woocommerce-admin' ),
},
},
},
],
},
{
label: __( 'Comparison', 'woocommerce-admin' ),
value: 'compare-categories',
chartMode: 'item-comparison',
settings: {
type: 'categories',
param: 'categories',
getLabels: getCategoryLabels,
labels: {
helpText: __(
'Check at least two categories below to compare',
'woocommerce-admin'
),
placeholder: __(
'Search for categories to compare',
'woocommerce-admin'
),
title: __( 'Compare Categories', 'woocommerce-admin' ),
update: __( 'Compare', 'woocommerce-admin' ),
},
onClick: addCesSurveyForAnalytics,
},
},
];
if ( Object.keys( advancedFilters.filters ).length ) {
filterValues.push( {
label: __( 'Advanced Filters', 'woocommerce-admin' ),
value: 'advanced',
} );
}
export const filters = applyFilters( CATEGORY_REPORT_FILTERS_FILTER, [
{
label: __( 'Show', 'woocommerce-admin' ),
staticParams: [ 'chartType', 'paged', 'per_page' ],
param: 'filter',
showFilters: () => true,
filters: [
{
label: __( 'All Categories', 'woocommerce-admin' ),
value: 'all',
},
{
label: __( 'Single Category', 'woocommerce-admin' ),
value: 'select_category',
chartMode: 'item-comparison',
subFilters: [
{
component: 'Search',
value: 'single_category',
chartMode: 'item-comparison',
path: [ 'select_category' ],
settings: {
type: 'categories',
param: 'categories',
getLabels: getCategoryLabels,
labels: {
placeholder: __(
'Type to search for a category',
'woocommerce-admin'
),
button: __(
'Single Category',
'woocommerce-admin'
),
},
},
},
],
},
{
label: __( 'Comparison', 'woocommerce-admin' ),
value: 'compare-categories',
chartMode: 'item-comparison',
settings: {
type: 'categories',
param: 'categories',
getLabels: getCategoryLabels,
labels: {
helpText: __(
'Check at least two categories below to compare',
'woocommerce-admin'
),
placeholder: __(
'Search for categories to compare',
'woocommerce-admin'
),
title: __( 'Compare Categories', 'woocommerce-admin' ),
update: __( 'Compare', 'woocommerce-admin' ),
},
onClick: addCesSurveyForAnalytics,
},
},
],
filters: filterValues,
},
] );
export const advancedFilters = applyFilters(
CATEGORY_REPORT_ADVANCED_FILTERS_FILTER,
{}
);

View File

@ -1,7 +1,7 @@
/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { __, _x } from '@wordpress/i18n';
import { applyFilters } from '@wordpress/hooks';
import { dispatch } from '@wordpress/data';
@ -35,68 +35,78 @@ export const charts = applyFilters( COUPON_REPORT_CHARTS_FILTER, [
},
] );
export const advancedFilters = applyFilters(
COUPON_REPORT_ADVANCED_FILTERS_FILTER,
{
filters: {},
title: _x(
'Coupons Match {{select /}} Filters',
'A sentence describing filters for Coupons. See screen shot for context: https://cloudup.com/cSsUY9VeCVJ',
'woocommerce-admin'
),
}
);
const filterValues = [
{ label: __( 'All Coupons', 'woocommerce-admin' ), value: 'all' },
{
label: __( 'Single Coupon', 'woocommerce-admin' ),
value: 'select_coupon',
chartMode: 'item-comparison',
subFilters: [
{
component: 'Search',
value: 'single_coupon',
chartMode: 'item-comparison',
path: [ 'select_coupon' ],
settings: {
type: 'coupons',
param: 'coupons',
getLabels: getCouponLabels,
labels: {
placeholder: __(
'Type to search for a coupon',
'woocommerce-admin'
),
button: __( 'Single Coupon', 'woocommerce-admin' ),
},
},
},
],
},
{
label: __( 'Comparison', 'woocommerce-admin' ),
value: 'compare-coupons',
settings: {
type: 'coupons',
param: 'coupons',
getLabels: getCouponLabels,
labels: {
title: __( 'Compare Coupon Codes', 'woocommerce-admin' ),
update: __( 'Compare', 'woocommerce-admin' ),
helpText: __(
'Check at least two coupon codes below to compare',
'woocommerce-admin'
),
},
onClick: addCesSurveyForAnalytics,
},
},
];
if ( Object.keys( advancedFilters.filters ).length ) {
filterValues.push( {
label: __( 'Advanced Filters', 'woocommerce-admin' ),
value: 'advanced',
} );
}
export const filters = applyFilters( COUPON_REPORT_FILTERS_FILTER, [
{
label: __( 'Show', 'woocommerce-admin' ),
staticParams: [ 'chartType', 'paged', 'per_page' ],
param: 'filter',
showFilters: () => true,
filters: [
{ label: __( 'All Coupons', 'woocommerce-admin' ), value: 'all' },
{
label: __( 'Single Coupon', 'woocommerce-admin' ),
value: 'select_coupon',
chartMode: 'item-comparison',
subFilters: [
{
component: 'Search',
value: 'single_coupon',
chartMode: 'item-comparison',
path: [ 'select_coupon' ],
settings: {
type: 'coupons',
param: 'coupons',
getLabels: getCouponLabels,
labels: {
placeholder: __(
'Type to search for a coupon',
'woocommerce-admin'
),
button: __(
'Single Coupon',
'woocommerce-admin'
),
},
},
},
],
},
{
label: __( 'Comparison', 'woocommerce-admin' ),
value: 'compare-coupons',
settings: {
type: 'coupons',
param: 'coupons',
getLabels: getCouponLabels,
labels: {
title: __(
'Compare Coupon Codes',
'woocommerce-admin'
),
update: __( 'Compare', 'woocommerce-admin' ),
helpText: __(
'Check at least two coupon codes below to compare',
'woocommerce-admin'
),
},
onClick: addCesSurveyForAnalytics,
},
},
],
filters: filterValues,
},
] );
export const advancedFilters = applyFilters(
COUPON_REPORT_ADVANCED_FILTERS_FILTER,
{}
);

View File

@ -1,7 +1,7 @@
/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { __, _x } from '@wordpress/i18n';
import { applyFilters } from '@wordpress/hooks';
import { dispatch } from '@wordpress/data';
@ -169,12 +169,30 @@ const variationsConfig = {
],
};
export const advancedFilters = applyFilters(
PRODUCTS_REPORT_ADVANCED_FILTERS_FILTER,
{
filters: {},
title: _x(
'Products Match {{select /}} Filters',
'A sentence describing filters for Products. See screen shot for context: https://cloudup.com/cSsUY9VeCVJ',
'woocommerce-admin'
),
}
);
if ( Object.keys( advancedFilters.filters ).length ) {
filterConfig.filters.push( {
label: __( 'Advanced Filters', 'woocommerce-admin' ),
value: 'advanced',
} );
variationsConfig.filters.push( {
label: __( 'Advanced Filters', 'woocommerce-admin' ),
value: 'advanced',
} );
}
export const filters = applyFilters( PRODUCTS_REPORT_FILTERS_FILTER, [
filterConfig,
variationsConfig,
] );
export const advancedFilters = applyFilters(
PRODUCTS_REPORT_ADVANCED_FILTERS_FILTER,
{}
);

View File

@ -1,7 +1,7 @@
/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { __, _x } from '@wordpress/i18n';
import { applyFilters } from '@wordpress/hooks';
const REVENUE_REPORT_CHARTS_FILTER = 'woocommerce_admin_revenue_report_charts';
@ -60,8 +60,37 @@ export const charts = applyFilters( REVENUE_REPORT_CHARTS_FILTER, [
},
] );
export const filters = applyFilters( REVENUE_REPORT_FILTERS_FILTER, [] );
export const advancedFilters = applyFilters(
REVENUE_REPORT_ADVANCED_FILTERS_FILTER,
{}
{
filters: {},
title: _x(
'Revenue Matches {{select /}} Filters',
'A sentence describing filters for Revenue. See screen shot for context: https://cloudup.com/cSsUY9VeCVJ',
'woocommerce-admin'
),
}
);
const filterValues = [];
if ( Object.keys( advancedFilters.filters ).length ) {
filterValues.push( {
label: __( 'All Revenue', 'woocommerce-admin' ),
value: 'all',
} );
filterValues.push( {
label: __( 'Advanced Filters', 'woocommerce-admin' ),
value: 'advanced',
} );
}
export const filters = applyFilters( REVENUE_REPORT_FILTERS_FILTER, [
{
label: __( 'Show', 'woocommerce-admin' ),
staticParams: [ 'chartType', 'paged', 'per_page' ],
param: 'filter',
showFilters: () => filterValues.length > 0,
filters: filterValues,
},
] );

View File

@ -1,7 +1,7 @@
/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { __, _x } from '@wordpress/i18n';
import { applyFilters } from '@wordpress/hooks';
const STOCK_REPORT_FILTERS_FILTER = 'woocommerce_admin_stock_report_filters';
@ -10,6 +10,18 @@ const STOCK_REPORT_ADVANCED_FILTERS_FILTER =
export const showDatePicker = false;
export const advancedFilters = applyFilters(
STOCK_REPORT_ADVANCED_FILTERS_FILTER,
{
filters: {},
title: _x(
'Products Match {{select /}} Filters',
'A sentence describing filters for Products. See screen shot for context: https://cloudup.com/cSsUY9VeCVJ',
'woocommerce-admin'
),
}
);
export const filters = applyFilters( STOCK_REPORT_FILTERS_FILTER, [
{
label: __( 'Show', 'woocommerce-admin' ),
@ -33,9 +45,17 @@ export const filters = applyFilters( STOCK_REPORT_FILTERS_FILTER, [
},
],
},
{
label: __( 'Filter by', 'woocommerce-admin' ),
staticParams: [ 'paged', 'per_page' ],
param: 'filter',
showFilters: () => Object.keys( advancedFilters.filters ).length,
filters: [
{ label: __( 'All Products', 'woocommerce-admin' ), value: 'all' },
{
label: __( 'Advanced Filters', 'woocommerce-admin' ),
value: 'advanced',
},
],
},
] );
export const advancedFilters = applyFilters(
STOCK_REPORT_ADVANCED_FILTERS_FILTER,
{}
);

View File

@ -1,7 +1,7 @@
/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { __, _x } from '@wordpress/i18n';
import { applyFilters } from '@wordpress/hooks';
import { NAMESPACE } from '@woocommerce/data';
import { dispatch } from '@wordpress/data';
@ -51,49 +51,65 @@ export const charts = applyFilters( TAXES_REPORT_CHARTS_FILTER, [
},
] );
export const advancedFilters = applyFilters(
TAXES_REPORT_ADVANCED_FILTERS_FILTER,
{
filters: {},
title: _x(
'Taxes Match {{select /}} Filters',
'A sentence describing filters for Taxes. See screen shot for context: https://cloudup.com/cSsUY9VeCVJ',
'woocommerce-admin'
),
}
);
const filterValues = [
{ label: __( 'All Taxes', 'woocommerce-admin' ), value: 'all' },
{
label: __( 'Comparison', 'woocommerce-admin' ),
value: 'compare-taxes',
chartMode: 'item-comparison',
settings: {
type: 'taxes',
param: 'taxes',
getLabels: getRequestByIdString(
NAMESPACE + '/taxes',
( tax ) => ( {
id: tax.id,
key: tax.id,
label: getTaxCode( tax ),
} )
),
labels: {
helpText: __(
'Check at least two tax codes below to compare',
'woocommerce-admin'
),
placeholder: __(
'Search for tax codes to compare',
'woocommerce-admin'
),
title: __( 'Compare Tax Codes', 'woocommerce-admin' ),
update: __( 'Compare', 'woocommerce-admin' ),
},
onClick: addCesSurveyForAnalytics,
},
},
];
if ( Object.keys( advancedFilters.filters ).length ) {
filterValues.push( {
label: __( 'Advanced Filters', 'woocommerce-admin' ),
value: 'advanced',
} );
}
export const filters = applyFilters( TAXES_REPORT_FILTERS_FILTER, [
{
label: __( 'Show', 'woocommerce-admin' ),
staticParams: [ 'chartType', 'paged', 'per_page' ],
param: 'filter',
showFilters: () => true,
filters: [
{ label: __( 'All Taxes', 'woocommerce-admin' ), value: 'all' },
{
label: __( 'Comparison', 'woocommerce-admin' ),
value: 'compare-taxes',
chartMode: 'item-comparison',
settings: {
type: 'taxes',
param: 'taxes',
getLabels: getRequestByIdString(
NAMESPACE + '/taxes',
( tax ) => ( {
id: tax.id,
key: tax.id,
label: getTaxCode( tax ),
} )
),
labels: {
helpText: __(
'Check at least two tax codes below to compare',
'woocommerce-admin'
),
placeholder: __(
'Search for tax codes to compare',
'woocommerce-admin'
),
title: __( 'Compare Tax Codes', 'woocommerce-admin' ),
update: __( 'Compare', 'woocommerce-admin' ),
},
onClick: addCesSurveyForAnalytics,
},
},
],
filters: filterValues,
},
] );
export const advancedFilters = applyFilters(
TAXES_REPORT_ADVANCED_FILTERS_FILTER,
{}
);

View File

@ -1,6 +1,7 @@
# 7.1.0
- Add rowKey prop to Table and TableCard component. #7196
- AdvancedFilters: Create workable defaults for Reports that don't have them #7186
- Filters: On update respect all other queries, not just persistedQueries #7155
- Fix non-string query prop warning in SelectControl component. #7046
- Fix WordPress 5.8 compatibility UI fixes #7255

View File

@ -224,7 +224,10 @@ ReportFilters.propTypes = {
ReportFilters.defaultProps = {
siteLocale: 'en_US',
advancedFilters: {},
advancedFilters: {
title: '',
filters: {},
},
filters: [],
query: {},
showDatePicker: true,