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

Jump to bottom

fix(headless commerce): correctly determine hasBreadcrumbs value for category facets #4175

Merged
merged 3 commits into from
Jul 11, 2024
Merged

fix(headless commerce): correctly determine hasBreadcrumbs value for category facets #4175

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
7ecfe20
Correctly account for category facet value state in commerceFacetSele…
fbeaudoincoveo Jul 10, 2024
a039262
Simplify commerceFacetSelector
fbeaudoincoveo Jul 11, 2024
45c5c2c
Merge branch 'master' into KIT-3385
fbeaudoincoveo Jul 11, 2024
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
51 changes: 48 additions & 3 deletions ...src/controllers/commerce/core/breadcrumb-manager/headless-core-breadcrumb-manager.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,10 @@ import {
buildMockCommerceNumericFacetResponse,
buildMockCommerceRegularFacetResponse,
} from '../../../../test/mock-commerce-facet-response';
import {buildMockCommerceRegularFacetValue} from '../../../../test/mock-commerce-facet-value';
import {
buildMockCategoryFacetValue,
buildMockCommerceRegularFacetValue,
} from '../../../../test/mock-commerce-facet-value';
import {buildMockCommerceState} from '../../../../test/mock-commerce-state';
import {
buildMockCommerceEngine,
Expand Down Expand Up @@ -121,7 +124,7 @@ describe('core breadcrumb manager', () => {
expect(breadcrumbManager.state.hasBreadcrumbs).toEqual(false);
});

it('#hasBreadcrumbs is false when all facet values are idle', () => {
it('#hasBreadcrumbs is false when all values in a non-category facet are idle', () => {
setFacetsState(
buildMockCommerceRegularFacetResponse({
facetId,
Expand All @@ -132,7 +135,18 @@ describe('core breadcrumb manager', () => {
expect(breadcrumbManager.state.hasBreadcrumbs).toEqual(false);
});

it('#hasBreadcrumbs is true when there is a selected facet value', () => {
it('#hasBreadcrumb is false when all values in a category facet are idle', () => {
setFacetsState(
buildMockCategoryFacetResponse({
facetId: 'category_facet',
values: [buildMockCategoryFacetValue({state: 'idle'})],
})
);

expect(breadcrumbManager.state.hasBreadcrumbs).toEqual(false);
});

it('#hasBreadcrumbs is true when there is a selected value in a non-category facet', () => {
setFacetsState(
buildMockCommerceRegularFacetResponse({
facetId,
Expand All @@ -143,6 +157,37 @@ describe('core breadcrumb manager', () => {
expect(breadcrumbManager.state.hasBreadcrumbs).toEqual(true);
});

it('#hasBreadcrumbs is true when the top parent value is selected in a category facet', () => {
setFacetsState(
buildMockCategoryFacetResponse({
facetId: 'category_facet',
values: [buildMockCategoryFacetValue({state: 'selected'})],
})
);

expect(breadcrumbManager.state.hasBreadcrumbs).toEqual(true);
});

it('#hasBreadcrumbs is true when a child value is selected in a category facet', () => {
setFacetsState(
buildMockCategoryFacetResponse({
facetId: 'category_facet',
values: [
buildMockCategoryFacetValue({
state: 'idle',
children: [
buildMockCategoryFacetValue({
state: 'selected',
}),
],
}),
],
})
);

expect(breadcrumbManager.state.hasBreadcrumbs).toEqual(true);
});

it('#hasBreadcrumbs is true when there is an excluded facet value', () => {
setFacetsState(
buildMockCommerceRegularFacetResponse({
Expand Down
35 changes: 23 additions & 12 deletions ...less/src/controllers/commerce/core/breadcrumb-manager/headless-core-breadcrumb-manager.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -232,21 +232,32 @@ export function buildCoreBreadcrumbManager(
];
};

const hasActiveValue = (
facet: AnyFacetResponse | undefined
): facet is AnyFacetResponse => {
if (!facet) {
return false;
}
if (facet.values.length === 0) {
return false;
}
if (facet.type === 'hierarchical') {
return findActiveValueAncestry(facet.values).length > 0;
}

return facet.values.some((value) => value.state !== 'idle');
};

const commerceFacetSelector = createSelector(
(state: CommerceEngineState) => state.facetOrder,
(facetOrder): BreadcrumbManagerState => {
const breadcrumbs =
facetOrder
.map((facetId) =>
options.facetResponseSelector(engine[stateKey], facetId)
)
.filter(
(facet): facet is AnyFacetResponse =>
facet !== undefined &&
facet.values.length > 0 &&
facet.values.some((value) => value.state !== 'idle')
)
.map(createBreadcrumb) ?? [];
const breadcrumbs = facetOrder.flatMap((facetId) => {
const facet = options.facetResponseSelector(engine[stateKey], facetId);
if (hasActiveValue(facet)) {
return [createBreadcrumb(facet)];
}
return [];
});

return {
facetBreadcrumbs: breadcrumbs,
Expand Down
Loading