feat #311 - Add ability to omit specific filters(ServerSide)

src/components/Filters/ServerSideFilters/index.tsx

@@ -8,11 +8,17 @@ export const ServerSideFilters: FC<ServerSideFiltersProps> = ({
 	api,
 	emitter,
 	endpoint,
+	omittedFilterKeys = [],
 	...rest
 }: ServerSideFiltersProps) => {
 	// useFilters is where all the related data will be held.
 	// API calls will also be handled in useFilters.
-	const filterMethods = useFilters(endpoint, api, emitter)
+	const filterMethods = useFilters({
+		api,
+		emitter,
+		endpoint,
+		omittedFilterKeys
+	})
 
 	return (
 		<FiltersCtxProvider

src/components/Filters/ServerSideFilters/utils.ts

@@ -7,14 +7,28 @@ import {
 	mockDynamicFilterOptions,
 	mockFilterOptions
 } from '../fixtures/0_sample_data'
-import { OnSearchWrapper, ProcessedFilters } from '../types'
+import {
+	OnSearchWrapper,
+	ProcessedFilters,
+	ServerSideFiltersProps
+} from '../types'
 import { useEffect, useState } from 'react'
 
-export const useFilters = (
-	endpoint: string,
-	api: AxiosInstance,
+interface UseFiltersParams
+	extends Pick<ServerSideFiltersProps, 'omittedFilterKeys'> {
+	api: AxiosInstance
 	emitter: Emitter
-) => {
+	endpoint: string
+}
+
+export const useFilters = ({
+	api,
+	emitter,
+	endpoint,
+	omittedFilterKeys = []
+}: UseFiltersParams) => {
+	const stringifiedOmittedFilterKeys = JSON.stringify(omittedFilterKeys)
+
 	const [allFilters, setAllFilters] = useState<ProcessedFilters>({})
 
 	const [dynamicOptions, setDynamicOptions] = useState<
@@ -96,7 +110,12 @@ export const useFilters = (
 
 		// TODO: Delete and uncomment above lines when API is working
 		const getFilters = () =>
-			setAllFilters(processFilters(mockFilterOptions))
+			setAllFilters(
+				processFilters(
+					mockFilterOptions,
+					JSON.parse(stringifiedOmittedFilterKeys)
+				)
+			)
 
 		setTimeout(() => {
 			getFilters()
@@ -106,7 +125,7 @@ export const useFilters = (
 		return () => {
 			setAllFilters({})
 		}
-	}, [api, emitter, endpoint])
+	}, [api, emitter, endpoint, stringifiedOmittedFilterKeys])
 
 	useEffect(() => {
 		setLoading(isEmpty(allFilters))

src/components/Filters/types.ts

@@ -53,6 +53,7 @@ export interface ServerSideFiltersProps extends SharedFiltersProps {
 	emitter: Emitter
 	endpoint: string
 	mode: FiltersMode.backend
+	omittedFilterKeys?: string[]
 }
 
 export type FiltersProps = ClientSideFiltersProps | ServerSideFiltersProps

src/components/Filters/utils.ts

@@ -2,7 +2,12 @@
 import { SelectOption } from '../Select'
 import xor from 'lodash/xor'
 import { FilterOptions, Filters, FilterValues } from '../api'
-import { FiltersList, ProcessedFilters, SelectedValsFilters } from './types'
+import {
+	FiltersList,
+	ProcessedFilters,
+	SelectedValsFilters,
+	ServerSideFiltersProps
+} from './types'
 // import { FilterSuggestions } from 'api'
 
 export const filterSelectedFilters: (
@@ -70,17 +75,25 @@ export const getFilterKeysOptions = (
 }
 
 // --------------------------------------
-
-export const processFilters = (filterOptions: FilterOptions) => {
+type ProcessFilters = (
+	filterOptions: FilterOptions,
+	omittedFilterKeys?: ServerSideFiltersProps['omittedFilterKeys']
+) => ProcessedFilters
+export const processFilters: ProcessFilters = (
+	filterOptions,
+	omittedFilterKeys = []
+) => {
 	const processedFilters: ProcessedFilters = {}
 
 	filterOptions.forEach(filterOption => {
 		const { key, staticFilter } = filterOption
 
-		processedFilters[(key as unknown) as string] = {
-			...filterOption,
-			key: (key as unknown) as string,
-			staticFilter: (staticFilter as unknown) as boolean
+		if (!omittedFilterKeys.includes(key)) {
+			processedFilters[key] = {
+				...filterOption,
+				key,
+				staticFilter: (staticFilter as unknown) as boolean
+			}
 		}
 	})