Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Display post types on facets with duplicate labels. #2541

Merged
merged 2 commits into from
Jan 12, 2022
Merged

Display post types on facets with duplicate labels. #2541

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2ff0e6a
Expose plural and singular post type labels on front end.
JakePT Jan 5, 2022
446699a
Display post types on facets with duplicate labels. Addresses #2497.
JakePT Jan 5, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 8 additions & 2 deletions assets/js/instant-results/components/facets/facet.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,10 +17,11 @@ import TaxonomyTermsFacet from './taxonomy-terms-facet';
* @param {number} props.index Facet index.
* @param {string} props.name Facet name.
* @param {string} props.label Facet label.
* @param {string} props.postTypes Facet post types.
* @param {'post_type'|'price_range'|'taxonomy'} props.type Facet type.
* @return {WPElement} Component element.
*/
export default ({ index, label, name, type }) => {
export default ({ index, label, name, postTypes, type }) => {
const defaultIsOpen = index < 2;

switch (type) {
Expand All @@ -30,7 +31,12 @@ export default ({ index, label, name, type }) => {
return <PriceRangeFacet defaultIsOpen={defaultIsOpen} label={label} />;
case 'taxonomy':
return (
<TaxonomyTermsFacet defaultIsOpen={defaultIsOpen} label={label} taxonomy={name} />
<TaxonomyTermsFacet
defaultIsOpen={defaultIsOpen}
label={label}
postTypes={postTypes}
taxonomy={name}
/>
);
default:
return <></>;
Expand Down
4 changes: 2 additions & 2 deletions assets/js/instant-results/components/facets/post-type-facet.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ export default ({ defaultIsOpen, label }) => {
options.push({
checked: selectedPostTypes.includes(key),
id: `ep-search-post-type-${key}`,
label: postTypeLabels[key],
label: postTypeLabels[key].singular,
order: index,
value: key,
});
Expand Down Expand Up @@ -102,7 +102,7 @@ export default ({ defaultIsOpen, label }) => {
{selectedPostTypes.map((value) => (
<ActiveContraint
key={value}
label={postTypeLabels[value]}
label={postTypeLabels[value].singular}
onClick={() => onClear(value)}
/>
))}
Expand Down
28 changes: 26 additions & 2 deletions assets/js/instant-results/components/facets/taxonomy-terms-facet.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import { __, sprintf } from '@wordpress/i18n';
/**
* Internal dependencies.
*/
import { facets, postTypeLabels } from '../../config';
import Context from '../../context';
import Panel from '../common/panel';
import CheckboxList from '../common/checkbox-list';
Expand All @@ -18,10 +19,11 @@ import { ActiveContraint } from '../tools/active-constraints';
* @param {Object} props Components props.
* @param {boolean} props.defaultIsOpen Whether the panel is open by default.
* @param {string} props.label Facet label.
* @param {Array} props.postTypes Facet post types.
* @param {string} props.taxonomy Facet taxonomy.
* @return {WPElement} Component element.
*/
export default ({ defaultIsOpen, label, taxonomy }) => {
export default ({ defaultIsOpen, label, postTypes, taxonomy }) => {
const {
state: {
isLoading,
Expand All @@ -33,6 +35,28 @@ export default ({ defaultIsOpen, label, taxonomy }) => {
dispatch,
} = useContext(Context);

/**
* A unique label for the facet. Adds additional context to the label if
* another taxonomy with the same label is being used as a facet.
*/
const uniqueLabel = useMemo(() => {
const isNotUnique = facets.some(
(facet) => facet.label === label && facet.name !== taxonomy,
);

const typeLabels = postTypes.map((postType) => postTypeLabels[postType].plural);
const typeSeparator = __(', ', 'elasticpress');

return isNotUnique
? sprintf(
/* translators: %1$s: Facet label. $2$s: Facet post types. */
__('%1$s (%2$s)', 'elasticpress'),
label,
typeLabels.join(typeSeparator),
)
: label;
}, [label, postTypes, taxonomy]);

/**
* Create list of filter options from aggregation buckets.
*
Expand Down Expand Up @@ -107,7 +131,7 @@ export default ({ defaultIsOpen, label, taxonomy }) => {

return (
options.length > 0 && (
<Panel defaultIsOpen={defaultIsOpen} label={label}>
<Panel defaultIsOpen={defaultIsOpen} label={uniqueLabel}>
{(isOpen) => (
<>
{isOpen && (
Expand Down
4 changes: 2 additions & 2 deletions assets/js/instant-results/components/layout.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,8 +43,8 @@ export default () => {
<div className="ep-search-page__body">
<Sidebar isOpen={isSidebarOpen}>
<Sort />
{facets.map(({ name, label, type }, index) => (
<Facet index={index} key={name} label={label} name={name} type={type} />
{facets.map((facet, index) => (
<Facet {...facet} index={index} />
))}
</Sidebar>

Expand Down
2 changes: 1 addition & 1 deletion assets/js/instant-results/components/results/result.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ export default ({ hit }) => {
},
} = hit;

const postTypeLabel = postTypeLabels?.[resultPostType];
const postTypeLabel = postTypeLabels[resultPostType]?.singular;

return (
<article
Expand Down
35 changes: 21 additions & 14 deletions includes/classes/Feature/InstantResults/InstantResults.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -623,9 +623,12 @@ public function get_post_type_labels() {

foreach ( $post_types as $post_type ) {
$post_type_object = get_post_type_object( $post_type );
$post_type_label = get_post_type_labels( $post_type_object )->singular_name;
$post_type_labels = get_post_type_labels( $post_type_object );

$labels[ $post_type ] = $post_type_label;
$labels[ $post_type ] = array(
'plural' => $post_type_labels->name,
'singular' => $post_type_labels->singular_name,
);
}

return $labels;
Expand All @@ -643,12 +646,13 @@ public function get_facets() {
* Post type facet.
*/
$facets['post_type'] = array(
'type' => 'post_type',
'labels' => array(
'type' => 'post_type',
'post_types' => [],
'labels' => array(
'admin' => __( 'Post type', 'elasticpress' ),
'frontend' => __( 'Type', 'elasticpress' ),
),
'aggs' => array(
'aggs' => array(
'post_types' => array(
'terms' => array(
'field' => 'post_type.raw',
Expand All @@ -674,12 +678,13 @@ public function get_facets() {
);

$facets[ $slug ] = array(
'type' => 'taxonomy',
'labels' => array(
'type' => 'taxonomy',
'post_types' => $taxonomy->object_type,
'labels' => array(
'admin' => $admin_label,
'frontend' => $labels->singular_name,
),
'aggs' => array(
'aggs' => array(
'taxonomy_terms' => array(
'terms' => array(
'field' => 'terms.' . $slug . '.facet',
Expand All @@ -695,12 +700,13 @@ public function get_facets() {
*/
if ( $this->is_woocommerce ) {
$facets['price_range'] = array(
'type' => 'price_range',
'labels' => array(
'type' => 'price_range',
'post_types' => [ 'product' ],
'labels' => array(
'admin' => __( 'Price range', 'elasticpress' ),
'frontend' => __( 'Price', 'elasticpress' ),
),
'aggs' => array(
'aggs' => array(
'max_price' => array(
'max' => array(
'field' => 'meta._price.double',
Expand Down Expand Up @@ -734,9 +740,10 @@ public function get_facets_for_frontend() {
$facet = $available_facets[ $key ];

$facets[] = array(
'name' => $key,
'label' => $facet['labels']['frontend'],
'type' => $facet['type'],
'name' => $key,
'label' => $facet['labels']['frontend'],
'type' => $facet['type'],
'postTypes' => $facet['post_types'],
);
}
}
Expand Down