diff --git a/src/components/Filters/FilterBetweenRange.tsx b/src/components/Filters/FilterBetweenRange.tsx index a2401a38b..ac36ea1a0 100644 --- a/src/components/Filters/FilterBetweenRange.tsx +++ b/src/components/Filters/FilterBetweenRange.tsx @@ -1,8 +1,10 @@ -import { FormEventHandler, ReactNode } from 'react' +import { FormEventHandler, ReactNode, useState } from 'react' +import { useRouter } from 'next/router' import * as Ariakit from '@ariakit/react' import { NestedMenu } from '~/components/NestedMenu' import { cn } from '~/utils/cn' import { Icon } from '../Icon' +import { TagGroup } from '../TagGroup' interface IFilterBetweenRange { name: string @@ -15,6 +17,7 @@ interface IFilterBetweenRange { variant?: 'primary' | 'secondary' triggerClassName?: string placement?: Ariakit.PopoverStoreProps['placement'] + presets?: object } const getVariantClasses = (variant: string) => { @@ -36,20 +39,21 @@ export function FilterBetweenRange({ max, variant = 'primary', triggerClassName, - placement = 'bottom-end' + placement = 'bottom-end', + presets }: IFilterBetweenRange) { const popover = Ariakit.usePopoverStore({ placement }) + const router = useRouter() if (nestedMenu) { return ( -
+ ) } - return ( @@ -72,7 +76,7 @@ export function FilterBetweenRange({
- +
@@ -83,13 +87,17 @@ function Form({ onSubmit, onClear, min, - max + max, + presets }: { onSubmit: FormEventHandler onClear: () => void min: number | string | null max: number | string | null + presets?: object }) { + const [minValue, setMinValue] = useState(min || '') + const [maxValue, setMaxValue] = useState(max || '') return ( + {presets && ( + setMinValue(presets[key])} /> + )} - + {presets && ( + setMaxValue(presets[key])} /> + )}