diff --git a/.changeset/sour-onions-appear.md b/.changeset/sour-onions-appear.md new file mode 100644 index 000000000..781fd6edc --- /dev/null +++ b/.changeset/sour-onions-appear.md @@ -0,0 +1,5 @@ +--- +"saleor-dashboard": patch +--- + +Fix null-cheks for filters diff --git a/src/components/ConditionalFilter/FilterElement/FilterElement.ts b/src/components/ConditionalFilter/FilterElement/FilterElement.ts index 0c36700a9..bb0ea6a30 100644 --- a/src/components/ConditionalFilter/FilterElement/FilterElement.ts +++ b/src/components/ConditionalFilter/FilterElement/FilterElement.ts @@ -161,7 +161,7 @@ export class FilterElement { ); } - return null; + return FilterElement.createEmpty(); } } diff --git a/src/components/ConditionalFilter/ValueProvider/TokenArray/fetchingParams.ts b/src/components/ConditionalFilter/ValueProvider/TokenArray/fetchingParams.ts index a075334af..cdf027ca8 100644 --- a/src/components/ConditionalFilter/ValueProvider/TokenArray/fetchingParams.ts +++ b/src/components/ConditionalFilter/ValueProvider/TokenArray/fetchingParams.ts @@ -1,14 +1,15 @@ -// @ts-strict-ignore import { UrlToken } from "../UrlToken"; export interface FetchingParams { category: string[]; collection: string[]; channel: string[]; - producttype: []; + producttype: string[]; attribute: Record; } +type FetchingParamsKeys = keyof Omit + export const emptyFetchingParams: FetchingParams = { category: [], collection: [], @@ -20,8 +21,10 @@ export const emptyFetchingParams: FetchingParams = { const unique = (array: Iterable) => Array.from(new Set(array)); export const toFetchingParams = (p: FetchingParams, c: UrlToken) => { - if (!c.isAttribute() && !p[c.name]) { - p[c.name] = []; + const key = c.name as FetchingParamsKeys + + if (!c.isAttribute() && !p[key]) { + p[key] = [] } if (c.isAttribute() && !p.attribute[c.name]) { @@ -34,7 +37,7 @@ export const toFetchingParams = (p: FetchingParams, c: UrlToken) => { return p; } - p[c.name] = unique(p[c.name].concat(c.value)); + p[key] = unique(p[key].concat(c.value)); return p; }; diff --git a/src/components/ConditionalFilter/ValueProvider/TokenArray/index.ts b/src/components/ConditionalFilter/ValueProvider/TokenArray/index.ts index 7153b64e6..d3581aa00 100644 --- a/src/components/ConditionalFilter/ValueProvider/TokenArray/index.ts +++ b/src/components/ConditionalFilter/ValueProvider/TokenArray/index.ts @@ -1,5 +1,3 @@ -// @ts-strict-ignore - import { parse, ParsedQs } from "qs"; import { useRef } from "react"; @@ -51,7 +49,7 @@ const tokenizeUrl = (urlParams: string) => { const mapUrlTokensToFilterValues = ( urlTokens: TokenArray, response: InitialStateResponse, -) => +): FilterContainer => urlTokens.map(el => { if (typeof el === "string") { return el; @@ -97,7 +95,7 @@ export class TokenArray extends Array { } export const useTokenArray = (url: string) => { - const instance = useRef(null); + const instance = useRef(null); if (!instance.current) { instance.current = new TokenArray(url); diff --git a/src/components/ConditionalFilter/ValueProvider/useUrlValueProvider.ts b/src/components/ConditionalFilter/ValueProvider/useUrlValueProvider.ts index ff100843a..472b13e55 100644 --- a/src/components/ConditionalFilter/ValueProvider/useUrlValueProvider.ts +++ b/src/components/ConditionalFilter/ValueProvider/useUrlValueProvider.ts @@ -1,5 +1,3 @@ -// @ts-strict-ignore - import { stringify } from "qs"; import useRouter from "use-react-router"; @@ -7,8 +5,11 @@ import { useInitialAPIState } from "../API/initialState/useInitalAPIState"; import { FilterContainer } from "../FilterElement"; import { FilterValueProvider } from "../FilterValueProvider"; import { useTokenArray } from "./TokenArray"; +import { UrlEntry } from "./UrlToken"; -const prepareStructure = filterValue => +type Structure = Array + +const prepareStructure = (filterValue: FilterContainer): Structure => filterValue.map(f => { if (typeof f === "string") { return f; @@ -21,9 +22,6 @@ const prepareStructure = filterValue => return f.asUrlEntry(); }); -/* - exampple url: http://localhost:9000/dashboard/products/?0%5Bs2.category%5D%5B0%5D=accessories&0%5Bs2.category%5D%5B1%5D=groceries&1=o&2%5Ba2.abv%5D%5B0%5D=QXR0cmlidXRlVmFsdWU6Njg%3D&3=a&4%5Bs2.collection%5D%5B0%5D=featured-products&5=a&6%5Bs2.producttype%5D%5B0%5D=beer&7=a&8%5B0%5D%5Bs2.category%5D%5B0%5D=apparel&8%5B1%5D=o&8%5B2%5D%5Ba2.bottle-size%5D%5B0%5D=QXR0cmlidXRlVmFsdWU6NDY%3D&8%5B2%5D%5Ba2.bottle-size%5D%5B1%5D=QXR0cmlidXRlVmFsdWU6NDc%3D&asc=true&sort=name -*/ export const useUrlValueProvider = (): FilterValueProvider => { const router = useRouter(); const params = new URLSearchParams(router.location.search); diff --git a/src/components/ConditionalFilter/controlsType.ts b/src/components/ConditionalFilter/controlsType.ts index 76e064197..d7b963ec9 100644 --- a/src/components/ConditionalFilter/controlsType.ts +++ b/src/components/ConditionalFilter/controlsType.ts @@ -1,15 +1,13 @@ -// @ts-strict-ignore - import { ConditionValue } from "./FilterElement/ConditionValue"; export const CONTROL_DEFAULTS = { text: "", number: "", "number.range": [] as unknown as [string, string], - multiselect: [] as ConditionValue[], + multiselect: [] as ConditionValue, select: "", combobox: "", }; export const getDefaultByControlName = (name: string): ConditionValue => - CONTROL_DEFAULTS[name]; + CONTROL_DEFAULTS[name as keyof typeof CONTROL_DEFAULTS];