crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-12 12:47:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: simplify logic of price range

Browse Source 
Signed-off-by: Chloe <pinkcloudvnn@gmail.com>
This commit is contained in:
Chloe 2024-05-08 12:20:22 +07:00
parent be494b489c
commit f5a2237d43
No known key found for this signature in database
GPG Key ID: CFD53CE570D42DF5
1 changed files with 23 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
components/layout/search/filters/price-range.tsx
View File

@ -33,8 +33,8 @@ const PriceRange = ({ id, values }: { id: string; values: Filter['values'] }) =>
const [minPrice, setMinPrice] = useState(initialPriceMin || ''); const [minPrice, setMinPrice] = useState(initialPriceMin || '');
const [maxPrice, setMaxPrice] = useState(initialPriceMax || ''); const [maxPrice, setMaxPrice] = useState(initialPriceMax || '');
const debouncedMinPrice = useDebounce(minPrice); const debouncedMinPrice = useDebounce(minPrice, 1000);
const debouncedMaxPrice = useDebounce(maxPrice); const debouncedMaxPrice = useDebounce(maxPrice, 1000);
const minPriceRef = useRef(minPrice); const minPriceRef = useRef(minPrice);
const maxPriceRef = useRef(maxPrice); const maxPriceRef = useRef(maxPrice);
@ -67,44 +67,34 @@ const PriceRange = ({ id, values }: { id: string; values: Filter['values'] }) =>
}; };
useEffect(() => { useEffect(() => {
if (debouncedMinPrice) { if (!debouncedMinPrice) {
let _minPrice = debouncedMinPrice;
const minNum = Number(_minPrice);
if (minNum < 0) {
_minPrice = '0';
}
if (maxPriceRef.current && minNum > Number(maxPriceRef.current)) {
_minPrice = maxPriceRef.current;
}
if (minNum > highestPrice) {
_minPrice = String(highestPrice);
}
if (_minPrice !== debouncedMinPrice) {
handleChangeMinPrice(_minPrice);
}
updateSearchParams({ min: _minPrice, max: maxPriceRef.current });
} else {
updateSearchParams({ min: '', max: maxPriceRef.current }); updateSearchParams({ min: '', max: maxPriceRef.current });
return;
} }
let minNum = Number(debouncedMinPrice);
minNum = Math.max(0, minNum);
if (minNum.toString() !== debouncedMinPrice) {
handleChangeMinPrice(minNum.toString());
}
updateSearchParams({ min: minNum.toString(), max: maxPriceRef.current });
}, [debouncedMinPrice, highestPrice, updateSearchParams]); }, [debouncedMinPrice, highestPrice, updateSearchParams]);
useEffect(() => { useEffect(() => {
if (debouncedMaxPrice) { if (!debouncedMaxPrice) {
let _maxPrice = debouncedMaxPrice;
const maxNum = Number(_maxPrice);
if (minPriceRef.current && maxNum < Number(minPriceRef.current)) {
_maxPrice = minPriceRef.current;
}
if (maxNum > highestPrice) {
_maxPrice = String(highestPrice);
}
if (_maxPrice !== debouncedMaxPrice) {
handleChangeMaxPrice(_maxPrice);
}
updateSearchParams({ min: minPriceRef.current, max: _maxPrice });
} else {
updateSearchParams({ min: minPriceRef.current, max: '' }); updateSearchParams({ min: minPriceRef.current, max: '' });
return;
} }
let maxNum = Number(debouncedMaxPrice);
maxNum = Math.max(0, maxNum);
maxNum = minPriceRef.current ? Math.max(Number(minPriceRef.current), maxNum) : maxNum;
maxNum = Math.min(maxNum, highestPrice);
if (maxNum.toString() !== debouncedMaxPrice) {
handleChangeMaxPrice(maxNum.toString());
}
updateSearchParams({ min: minPriceRef.current, max: maxNum.toString() });
}, [debouncedMaxPrice, highestPrice, updateSearchParams]); }, [debouncedMaxPrice, highestPrice, updateSearchParams]);
return ( return (