From 2240d3d713c15a93eaad1060afae8238f5963375 Mon Sep 17 00:00:00 2001 From: Paul Sealock Date: Tue, 11 Dec 2018 09:01:22 +1300 Subject: [PATCH] Customers: add one advanced filter --- .../analytics/report/customers/config.js | 55 +++++++++++++++++-- .../analytics/report/customers/index.js | 5 +- .../client/store/reports/utils.js | 12 ++-- plugins/woocommerce-admin/package-lock.json | 18 +++--- 4 files changed, 69 insertions(+), 21 deletions(-) diff --git a/plugins/woocommerce-admin/client/analytics/report/customers/config.js b/plugins/woocommerce-admin/client/analytics/report/customers/config.js index d6c29ab2832..b5f2a848084 100644 --- a/plugins/woocommerce-admin/client/analytics/report/customers/config.js +++ b/plugins/woocommerce-admin/client/analytics/report/customers/config.js @@ -2,9 +2,9 @@ /** * External dependencies */ -import { __ } from '@wordpress/i18n'; - -export const showDatePicker = false; +import { __, _x } from '@wordpress/i18n'; +import { getRequestByIdString } from '../../../lib/async-requests'; +import { NAMESPACE } from '../../../store/constants'; export const filters = [ { @@ -12,6 +12,53 @@ export const filters = [ staticParams: [], param: 'filter', showFilters: () => true, - filters: [ { label: __( 'All Registered Customers', 'wc-admin' ), value: 'all' } ], + filters: [ + { label: __( 'All Registered Customers', 'wc-admin' ), value: 'all' }, + { label: __( 'Advanced Filters', 'wc-admin' ), value: 'advanced' }, + ], }, ]; + +/*eslint-disable max-len*/ +export const advancedFilters = { + title: _x( + 'Customers Match {{select /}} Filters', + 'A sentence describing filters for Customers. See screen shot for context: https://cloudup.com/cCsm3GeXJbE', + 'wc-admin' + ), + filters: { + name: { + labels: { + add: __( 'Name', 'wc-admin' ), + placeholder: __( 'Search customer name', 'wc-admin' ), + remove: __( 'Remove customer name filter', 'wc-admin' ), + rule: __( 'Select a customer name filter match', 'wc-admin' ), + /* translators: A sentence describing a Product filter. See screen shot for context: https://cloudup.com/cSsUY9VeCVJ */ + title: __( 'Name {{rule /}} {{filter /}}', 'wc-admin' ), + filter: __( 'Select customer name', 'wc-admin' ), + }, + rules: [ + { + value: 'includes', + /* translators: Sentence fragment, logical, "Includes" refers to orders including a given product(s). Screenshot for context: https://cloudup.com/cSsUY9VeCVJ */ + label: _x( 'Includes', 'customer names', 'wc-admin' ), + }, + { + value: 'excludes', + /* translators: Sentence fragment, logical, "Excludes" refers to orders excluding a given product(s). Screenshot for context: https://cloudup.com/cSsUY9VeCVJ */ + label: _x( 'Excludes', 'customer names', 'wc-admin' ), + }, + ], + input: { + // Use products autocompleter for now, see https://github.com/woocommerce/wc-admin/issues/1029 for progress + component: 'Search', + type: 'products', + getLabels: getRequestByIdString( NAMESPACE + 'products', product => ( { + id: product.id, + label: product.name, + } ) ), + }, + }, + }, +}; +/*eslint-enable max-len*/ diff --git a/plugins/woocommerce-admin/client/analytics/report/customers/index.js b/plugins/woocommerce-admin/client/analytics/report/customers/index.js index a861aa6ac32..43faa037f02 100644 --- a/plugins/woocommerce-admin/client/analytics/report/customers/index.js +++ b/plugins/woocommerce-admin/client/analytics/report/customers/index.js @@ -13,7 +13,7 @@ import { ReportFilters } from '@woocommerce/components'; /** * Internal dependencies */ -import { filters, showDatePicker } from './config'; +import { filters, advancedFilters } from './config'; import CustomersReportTable from './table'; export default class CustomersReport extends Component { @@ -26,7 +26,8 @@ export default class CustomersReport extends Component { query={ query } path={ path } filters={ filters } - showDatePicker={ showDatePicker } + showDatePicker={ false } + advancedFilters={ advancedFilters } /> diff --git a/plugins/woocommerce-admin/client/store/reports/utils.js b/plugins/woocommerce-admin/client/store/reports/utils.js index a9641791385..c50fa32dfa1 100644 --- a/plugins/woocommerce-admin/client/store/reports/utils.js +++ b/plugins/woocommerce-admin/client/store/reports/utils.js @@ -21,6 +21,7 @@ import * as couponsConfig from 'analytics/report/coupons/config'; import * as ordersConfig from 'analytics/report/orders/config'; import * as productsConfig from 'analytics/report/products/config'; import * as taxesConfig from 'analytics/report/taxes/config'; +import * as customersConfig from 'analytics/report/customers/config'; import * as reportsUtils from './utils'; const reportConfigs = { @@ -29,6 +30,7 @@ const reportConfigs = { orders: ordersConfig, products: productsConfig, taxes: taxesConfig, + customers: customersConfig, }; export function getFilterQuery( endpoint, query ) { @@ -270,8 +272,8 @@ export function getTooltipValueFormat( type ) { } } -export function getReportTableQuery( urlQuery, query ) { - const filterQuery = getFilterQuery( 'products', urlQuery ); +export function getReportTableQuery( endpoint, urlQuery, query ) { + const filterQuery = getFilterQuery( endpoint, urlQuery ); const datesFromQuery = getCurrentDates( urlQuery ); return { @@ -296,11 +298,9 @@ export function getReportTableQuery( urlQuery, query ) { * @return {Object} Object Table data response */ export function getReportTableData( endpoint, urlQuery, select, query = {} ) { - const { getReportItems, isReportItemsRequesting, isReportItemsError } = select( - 'wc-api' - ); + const { getReportItems, isReportItemsRequesting, isReportItemsError } = select( 'wc-api' ); - const tableQuery = reportsUtils.getReportTableQuery( urlQuery, query ); + const tableQuery = reportsUtils.getReportTableQuery( endpoint, urlQuery, query ); const response = { query: tableQuery, isRequesting: false, diff --git a/plugins/woocommerce-admin/package-lock.json b/plugins/woocommerce-admin/package-lock.json index a3cd449e3eb..21013192bf8 100644 --- a/plugins/woocommerce-admin/package-lock.json +++ b/plugins/woocommerce-admin/package-lock.json @@ -6209,7 +6209,7 @@ "dependencies": { "jsesc": { "version": "0.5.0", - "resolved": "http://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz", + "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz", "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0=", "dev": true }, @@ -6226,13 +6226,13 @@ }, "regjsgen": { "version": "0.2.0", - "resolved": "http://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz", + "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz", "integrity": "sha1-bAFq3qxVT3WCP+N6wFuS1aTtsfc=", "dev": true }, "regjsparser": { "version": "0.1.5", - "resolved": "http://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz", + "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz", "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw=", "dev": true, "requires": { @@ -7684,7 +7684,7 @@ }, "espree": { "version": "3.5.4", - "resolved": "http://registry.npmjs.org/espree/-/espree-3.5.4.tgz", + "resolved": "https://registry.npmjs.org/espree/-/espree-3.5.4.tgz", "integrity": "sha512-yAcIQxtmMiB/jL32dzEp2enBeidsB7xWPLNiw3IIkpVds1P+h7qF9YwJq1yUNzp2OKXgAprs4F61ih66UsoD1A==", "requires": { "acorn": "^5.5.0", @@ -14082,7 +14082,7 @@ "dependencies": { "ansi-escapes": { "version": "1.4.0", - "resolved": "http://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz", + "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz", "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4=", "dev": true }, @@ -14144,7 +14144,7 @@ }, "opn": { "version": "4.0.2", - "resolved": "http://registry.npmjs.org/opn/-/opn-4.0.2.tgz", + "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz", "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU=", "dev": true, "requires": { @@ -14817,7 +14817,7 @@ }, "chalk": { "version": "1.1.3", - "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", "dev": true, "requires": { @@ -15319,7 +15319,7 @@ }, "minimist": { "version": "1.2.0", - "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true }, @@ -20823,7 +20823,7 @@ }, "yargs": { "version": "11.1.0", - "resolved": "http://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", "integrity": "sha512-NwW69J42EsCSanF8kyn5upxvjp5ds+t3+udGBeTbFnERA+lF541DDpMawzo4z6W/QrzNM18D+BPMiOBibnFV5A==", "requires": { "cliui": "^4.0.0",