From 972665053565d43d68da1bf72861193695907bd5 Mon Sep 17 00:00:00 2001 From: Yen Truong Date: Fri, 22 Oct 2021 11:20:44 -0400 Subject: [PATCH] refactor filterutils --- .../src/utils/createdisplayablefilter.tsx | 80 +++++++++++++++++ sample-app/src/utils/filterutils.tsx | 88 ++----------------- 2 files changed, 88 insertions(+), 80 deletions(-) create mode 100644 sample-app/src/utils/createdisplayablefilter.tsx diff --git a/sample-app/src/utils/createdisplayablefilter.tsx b/sample-app/src/utils/createdisplayablefilter.tsx new file mode 100644 index 00000000..5c27c2e5 --- /dev/null +++ b/sample-app/src/utils/createdisplayablefilter.tsx @@ -0,0 +1,80 @@ +import { AppliedQueryFilter, Filter, DisplayableFacet, NearFilterValue } from '@yext/answers-core'; +import { DisplayableFilter } from '../models/displayableFilter'; + +/** + * Check if the object follows NearFilterValue interface + */ +function isNearFilterValue(obj: Object): obj is NearFilterValue { + return 'radius' in obj && 'lat' in obj && 'long' in obj; +} + +/** + * get a filter's display value or label in string format + */ +function getFilterDisplayValue(filter: Filter): string { + const value = filter.value; + if (typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean') { + return value.toString(); + } + if (isNearFilterValue(value)) { + return `within ${value.radius}m radius`; + } + throw Error('unrecognized filter value type'); +} + + +/** + * convert a list of facets to DisplayableFilter format with only selected facets returned. + */ +export function getDisplayableAppliedFacets(facets: DisplayableFacet[] | undefined): DisplayableFilter[] { + let appliedFacets: DisplayableFilter[] = []; + facets?.forEach(facet => { + facet.options.forEach(option => { + if(option.selected) { + appliedFacets.push({ + filterType: 'FACET', + filter: { + fieldId: facet.fieldId, + matcher: option.matcher, + value: option.value + }, + groupLabel: facet.displayName, + label: option.displayName + }); + } + }); + }); + return appliedFacets; +} + +/** + * convert a list of static filters to DisplayableFilter format. + */ +export function getDisplayableStaticFilters(filters: Filter[]): DisplayableFilter[] { + let appliedStaticFilters: DisplayableFilter[] = []; + filters?.forEach(filter => { + appliedStaticFilters.push({ + filterType: 'STATIC_FILTER', + filter: filter, + groupLabel: filter.fieldId, + label: getFilterDisplayValue(filter), + }); + }); + return appliedStaticFilters; +} + +/** + * convert a list of nlp filters to DisplayableFilter format. + */ +export function getDisplayableNlpFilters(filters: AppliedQueryFilter[]): DisplayableFilter[] { + let appliedNlpFilters: DisplayableFilter[] = []; + filters?.forEach(filter => { + appliedNlpFilters.push({ + filterType: 'NLP_FILTER', + filter: filter.filter, + groupLabel: filter.displayKey, + label: filter.displayValue, + }); + }); + return appliedNlpFilters; +} \ No newline at end of file diff --git a/sample-app/src/utils/filterutils.tsx b/sample-app/src/utils/filterutils.tsx index 79408cc0..ee09cff9 100644 --- a/sample-app/src/utils/filterutils.tsx +++ b/sample-app/src/utils/filterutils.tsx @@ -1,8 +1,13 @@ -import { AppliedQueryFilter, CombinedFilter, Filter, DisplayableFacet, NearFilterValue } from '@yext/answers-core'; +import { AppliedQueryFilter, CombinedFilter, Filter } from '@yext/answers-core'; import { FiltersState } from '@yext/answers-headless/lib/esm/models/slices/filters'; -import { mapArrayToObject } from '../utils/arrayutils'; +import { mapArrayToObject } from './arrayutils'; import { GroupedFilters } from '../models/groupedFilters'; import { DisplayableFilter } from '../models/displayableFilter'; +import { + getDisplayableAppliedFacets, + getDisplayableStaticFilters, + getDisplayableNlpFilters +} from './createdisplayablefilter'; /** * Check if the object follows CombinedFilter interface @@ -11,13 +16,6 @@ function isCombinedFilter(obj: Filter | CombinedFilter): obj is CombinedFilter { return 'filters' in obj && 'combinator' in obj; } -/** - * Check if the object follows NearFilterValue interface - */ -function isNearFilterValue(obj: Object): obj is NearFilterValue { - return 'radius' in obj && 'lat' in obj && 'long' in obj; -} - /** * Flatten the given filter, such as if the given filter is of type CombinedFilter * with possible nested layers of Filter objects, into a 1-dimension array of Filter objects @@ -38,7 +36,7 @@ function flattenFilters(filter: Filter | CombinedFilter | null | undefined): Arr /** * Returns true if the two given filters are the same */ -export function isDuplicateFilter(thisFilter: Filter, otherFilter: Filter): boolean { +function isDuplicateFilter(thisFilter: Filter, otherFilter: Filter): boolean { if (thisFilter.fieldId !== otherFilter.fieldId) { return false; } @@ -97,76 +95,6 @@ function createGroupedFilters( })); } -/** - * get a filter's display value or label in string format - */ -function getFilterDisplayValue(filter: Filter): string { - const value = filter.value; - if (typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean') { - return value.toString(); - } - if (isNearFilterValue(value)) { - return `within ${value.radius}m radius`; - } - throw Error('unrecognized filter value type'); -} - -/** - * convert a list of facets to DisplayableFilter format with only selected facets returned. - */ -function getDisplayableAppliedFacets(facets: DisplayableFacet[] | undefined): DisplayableFilter[] { - let appliedFacets: DisplayableFilter[] = []; - facets?.forEach(facet => { - facet.options.forEach(option => { - if(option.selected) { - appliedFacets.push({ - filterType: 'FACET', - filter: { - fieldId: facet.fieldId, - matcher: option.matcher, - value: option.value - }, - groupLabel: facet.displayName, - label: option.displayName - }); - } - }); - }); - return appliedFacets; -} - -/** - * convert a list of static filters to DisplayableFilter format. - */ -function getDisplayableStaticFilters(filters: Filter[]): DisplayableFilter[] { - let appliedStaticFilters: DisplayableFilter[] = []; - filters?.forEach(filter => { - appliedStaticFilters.push({ - filterType: 'STATIC_FILTER', - filter: filter, - groupLabel: filter.fieldId, - label: getFilterDisplayValue(filter), - }); - }); - return appliedStaticFilters; -} - -/** - * convert a list of nlp filters to DisplayableFilter format. - */ -function getDisplayableNlpFilters(filters: AppliedQueryFilter[]): DisplayableFilter[] { - let appliedNlpFilters: DisplayableFilter[] = []; - filters?.forEach(filter => { - appliedNlpFilters.push({ - filterType: 'NLP_FILTER', - filter: filter.filter, - groupLabel: filter.displayKey, - label: filter.displayValue, - }); - }); - return appliedNlpFilters; -} - /** * Process all applied filter types (facets, static filters, and nlp filters) by removing * duplicates and specified hidden fields, and grouped the applied filters into categories.