From 61fdfd1f4af0183952084abfd8a72ecdd76ee6ee Mon Sep 17 00:00:00 2001 From: anna condal Date: Thu, 26 Oct 2023 16:04:37 +0200 Subject: [PATCH] fix(history-queries): map selected filters correctly when coming from Query Preview (#1325) --------- Co-authored-by: Guillermo Cacheda --- .../store/__tests__/actions.spec.ts | 64 ++++++++++++++++++- ...ory-queries-with-search-response.action.ts | 38 ++++++++--- 2 files changed, 91 insertions(+), 11 deletions(-) diff --git a/packages/x-components/src/x-modules/history-queries/store/__tests__/actions.spec.ts b/packages/x-components/src/x-modules/history-queries/store/__tests__/actions.spec.ts index 5a31795317..a6fa9aec93 100644 --- a/packages/x-components/src/x-modules/history-queries/store/__tests__/actions.spec.ts +++ b/packages/x-components/src/x-modules/history-queries/store/__tests__/actions.spec.ts @@ -16,6 +16,7 @@ import { HistoryQueriesMutations, HistoryQueriesState } from '../types'; +import { InternalSearchResponse } from '../../../search/index'; import { resetHistoryQueriesStateWith } from './utils'; describe('testing history queries module actions', () => { @@ -279,12 +280,43 @@ describe('testing history queries module actions', () => { const requestFilters: Record = { categoryPaths: [ { - id: 'categoryIds:c018019b6', + id: 'categoryIds:66dd06d9f', selected: true, modelName: 'HierarchicalFilter' } ] }; + const selectedFilters: Filter[] = [ + { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + facetId: 'categoryPaths', + id: 'categoryIds:66dd06d9f', + label: 'suede', + modelName: 'HierarchicalFilter', + selected: true, + totalResults: 2 + } + ]; + const responseFacets: InternalSearchResponse['facets'] = [ + { + filters: [ + { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + facetId: 'categoryPaths', + id: 'categoryIds:66dd06d9f', + label: 'suede', + modelName: 'HierarchicalFilter', + selected: true, + totalResults: 2 + } + ], + id: 'categoryPaths', + label: 'categoryPaths', + modelName: 'HierarchicalFacet' + } + ]; let gato: HistoryQuery, perro: HistoryQuery; beforeEach(() => { @@ -369,9 +401,8 @@ describe('testing history queries module actions', () => { }); // eslint-disable-next-line max-len - it('updates a history query if search response change because a filter is selected', async () => { + it('updates a history query when the search response changes because a filter is selected', async () => { gato.totalResults = 50; - const selectedFilters = Object.values(requestFilters)[0]; resetStateWith({ historyQueries: [gato, perro] }); await store.dispatch('updateHistoryQueriesWithSearchResponse', { request: { @@ -380,6 +411,33 @@ describe('testing history queries module actions', () => { filters: requestFilters }, status: 'success', + facets: responseFacets, + results, + totalResults + }); + expectHistoryQueriesToEqual([{ ...gato, totalResults, selectedFilters }, perro]); + }); + + // eslint-disable-next-line max-len + it('updates a history query when the search response changes although the facet id is unknown', async () => { + gato.totalResults = 50; + resetStateWith({ historyQueries: [gato, perro] }); + await store.dispatch('updateHistoryQueriesWithSearchResponse', { + request: { + query: 'gato', + page: 1, + filters: { + __unknown__: [ + { + id: 'categoryIds:66dd06d9f', + selected: true, + modelName: 'RawFilter' + } + ] + } + }, + status: 'success', + facets: responseFacets, results, totalResults }); diff --git a/packages/x-components/src/x-modules/history-queries/store/actions/update-history-queries-with-search-response.action.ts b/packages/x-components/src/x-modules/history-queries/store/actions/update-history-queries-with-search-response.action.ts index 1e7968525e..f8e6800e23 100644 --- a/packages/x-components/src/x-modules/history-queries/store/actions/update-history-queries-with-search-response.action.ts +++ b/packages/x-components/src/x-modules/history-queries/store/actions/update-history-queries-with-search-response.action.ts @@ -31,7 +31,10 @@ export const updateHistoryQueriesWithSearchResponse: HistoryQueriesXStoreModule[ const historyQuery = state.historyQueries[indexOfHistoryQuery]; const isCurrentSessionHistoryQuery = historyQuery.timestamp > state.sessionTimeStampInMs; if (!isCurrentSessionHistoryQuery || historyQuery.totalResults == null || searchResponse) { - const filters = createHistoryQueriesFiltersList(searchResponse.request.filters); + const filters = getHistoryQueriesFiltersList( + searchResponse.facets, + searchResponse.request.filters + ); const newHistoryQueries = state.historyQueries.slice(); newHistoryQueries[indexOfHistoryQuery] = { @@ -46,20 +49,39 @@ export const updateHistoryQueriesWithSearchResponse: HistoryQueriesXStoreModule[ }; /** - * Take filters from the request and push them into a list. + * Creates a selected filters list by comparing request filters and response facets. + * Uses the 'filter.id' to match and merge the objects in a single one with all the keys. * + * @param responseFacets - Facets from the response. * @param requestFilters - Filters from the request. * * @returns A list of selected filters in the history query. * */ -function createHistoryQueriesFiltersList( +function getHistoryQueriesFiltersList( + responseFacets: InternalSearchResponse['facets'], requestFilters: InternalSearchResponse['request']['filters'] ): Filter[] { - return requestFilters - ? Object.values(requestFilters).reduce((accFilters, filters) => { - accFilters.push(...filters); + if (!requestFilters || !responseFacets) { + return []; + } else { + return Object.entries(requestFilters).flatMap(([facetId, facetFilters]) => { + const matchingFacet = + facetId !== '__unknown__' ? responseFacets.find(facet => facet.id === facetId) : null; + + return facetFilters.reduce((accFilters, requestFilter) => { + const matchingFilter = matchingFacet + ? matchingFacet.filters.find(filter => filter.id === requestFilter.id) + : responseFacets + .flatMap(facet => facet.filters) + .find(filter => filter.id === requestFilter.id); + + if (matchingFilter) { + accFilters.push({ ...matchingFilter, selected: requestFilter.selected }); + } + return accFilters; - }, []) - : []; + }, []); + }); + } }