`connectRange` and `RangeInput` not returning values
joepio opened this issue ยท 1 comments
joepio commented
๐ Bug description
I'm trying to show a range component, but for some reason I can't see any values.
- I can see the relevant
facetDistribution
values are present in the responses (I'm interested inbag-pnd-oppervlakte
andbag-pnd-oorspronkelijk-bouwjaar
- I tried both the
RangeInput
component and building a customuseRangeSlider
hook using this guide/canRefine
is false, and there
๐ Bug reproduction
You can try running this:
git clone https://github.com/joepio/gebouwenpaspoort
cd gebouwenpaspoort
git checkout
pnpm i
pnpm dev
In RangeSlider.tsx
:
import { useConnector } from 'react-instantsearch-hooks-web';
import connectRange from 'instantsearch.js/es/connectors/range/connectRange';
import type {
RangeConnectorParams,
RangeWidgetDescription,
} from 'instantsearch.js/es/connectors/range/connectRange';
export type UseRangeSliderProps = RangeConnectorParams;
export function useRangeSlider(props?: UseRangeSliderProps) {
return useConnector<RangeConnectorParams, RangeWidgetDescription>(
connectRange,
props
);
}
export function RangeSlider(props: UseRangeSliderProps) {
const {
start,
range,
canRefine,
refine,
sendEvent,
} = useRangeSlider(props);
return <>{JSON.stringify({
attribute: props.attribute,
start,
range,
canRefine,
refine,
sendEvent,
})}</>;
}
๐ญ Expected behavior
- I expect
rangeInput
to have values, and be selectable connectRange
hook to return amin
andmax
value, and atrue
forcanRefine
Environment
- React InstantSearch Hooks version: tried 6.24.0, 6.36.0 and 6.38.1
- React version: 18.2.0
- Browser: Firefox & chrome
- OS: macOS
FabienMotte commented
We're doing a round of cleanup before migrating this repository to the new InstantSearch monorepo.
This issue might be a duplicate of #3571
You can take a look at the sandbox provided by @dhayab: #3571 (comment)
Feel free to reopen it if you still encounter the issue.