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

Merge pull request woocommerce/woocommerce-admin#425 from woocommerce/add/advanced-filters-match-param 

Advanced Filters: add match param to url
This commit is contained in:
Paul Sealock 2018-09-19 10:03:06 +12:00 committed by GitHub
parent cd58cc78ac d0dc5f2f88
commit cb85f4878f
1 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
plugins/woocommerce-admin/client/components/filters/advanced/index.js
View File

@ -5,7 +5,7 @@
import { __, sprintf } from '@wordpress/i18n'; import { __, sprintf } from '@wordpress/i18n';
import { Component, Fragment, createRef } from '@wordpress/element'; import { Component, Fragment, createRef } from '@wordpress/element';
import { SelectControl, Button, Dropdown, IconButton } from '@wordpress/components'; import { SelectControl, Button, Dropdown, IconButton } from '@wordpress/components';
import { partial, findIndex, find, difference } from 'lodash'; import { partial, findIndex, difference } from 'lodash';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import Gridicon from 'gridicons'; import Gridicon from 'gridicons';
@ -29,11 +29,11 @@ const matches = [
* Displays a configurable set of filters which can modify query parameters. * Displays a configurable set of filters which can modify query parameters.
*/ */
class AdvancedFilters extends Component { class AdvancedFilters extends Component {
constructor( props ) { constructor( { query, config } ) {
super( props ); super( ...arguments );
this.state = { this.state = {
match: matches[ 0 ], match: query.match || 'all',
activeFilters: getActiveFiltersFromQuery( props.query, props.config ), activeFilters: getActiveFiltersFromQuery( query, config ),
}; };
this.filterListRef = createRef(); this.filterListRef = createRef();
@ -47,10 +47,8 @@ class AdvancedFilters extends Component {
this.getUpdateHref = this.getUpdateHref.bind( this ); this.getUpdateHref = this.getUpdateHref.bind( this );
} }
onMatchChange( value ) { onMatchChange( match ) {
this.setState( { this.setState( { match } );
match: find( matches, match => value === match.value ),
} );
} }
onFilterChange( key, property, value ) { onFilterChange( key, property, value ) {
@ -80,7 +78,7 @@ class AdvancedFilters extends Component {
<SelectControl <SelectControl
className="woocommerce-filters-advanced__title-select" className="woocommerce-filters-advanced__title-select"
options={ matches } options={ matches }
value={ match.value } value={ match }
onChange={ this.onMatchChange } onChange={ this.onMatchChange }
aria-label={ __( 'Match any or all filters', 'wc-admin' ) } aria-label={ __( 'Match any or all filters', 'wc-admin' ) }
/> />
@ -123,20 +121,22 @@ class AdvancedFilters extends Component {
clearFilters() { clearFilters() {
this.setState( { this.setState( {
activeFilters: [], activeFilters: [],
match: 'all',
} ); } );
} }
getUpdateHref( activeFilters ) { getUpdateHref( activeFilters, matchValue ) {
const { path, query, config } = this.props; const { path, query, config } = this.props;
const updatedQuery = getQueryFromActiveFilters( activeFilters, query, config ); const updatedQuery = getQueryFromActiveFilters( activeFilters, query, config );
return getNewPath( updatedQuery, path, query ); const match = matchValue === 'all' ? undefined : matchValue;
return getNewPath( { ...updatedQuery, match }, path, query );
} }
render() { render() {
const { config } = this.props; const { config } = this.props;
const { activeFilters } = this.state; const { activeFilters, match } = this.state;
const availableFilterKeys = this.getAvailableFilterKeys(); const availableFilterKeys = this.getAvailableFilterKeys();
const updateHref = this.getUpdateHref( activeFilters ); const updateHref = this.getUpdateHref( activeFilters, match );
const updateDisabled = window.location.hash && window.location.hash.substr( 1 ) === updateHref; const updateDisabled = window.location.hash && window.location.hash.substr( 1 ) === updateHref;
return ( return (
<Card className="woocommerce-filters-advanced" title={ this.getTitle() }> <Card className="woocommerce-filters-advanced" title={ this.getTitle() }>