feat: Add responsive map rendering with window resize handling

- Implemented dynamic map key update on window width change
- Added window resize event listener to track viewport width
- Ensures map re-renders correctly on different screen sizes
This commit is contained in:
RustamRu 2025-03-11 23:24:19 +03:00
parent 3f4e077f7c
commit d0dc2ded1b

View File

@ -31,8 +31,22 @@ export const MapComponent: FC<{
}
}, [selectedLocation]);
const [windowWidth, setWindowWidth] = useState(window.innerWidth);
useEffect(() => {
const handleResize = () => {
setWindowWidth(window.innerWidth);
};
window.addEventListener('resize', handleResize);
return () => {
window.removeEventListener('resize', handleResize);
};
}, []);
return (
<Map
key={windowWidth}
state={{
center: mapCenter,
zoom: