Hide POIs, show overlay state, remove zoom button, rotate vpn

This commit is contained in:
Andras Schmelczer 2026-07-15 21:58:05 +01:00
parent 35276d34fa
commit bce34b73de
32 changed files with 1137 additions and 186 deletions

View file

@ -21,6 +21,7 @@ import { HouseIcon } from '../../ui/icons/HouseIcon';
import { SpinnerIcon } from '../../ui/icons/SpinnerIcon';
import { IndeterminateProgressBar } from '../../ui/IndeterminateProgressBar';
import type { MapFlyTo } from './types';
import { MapControlButton, type MapControlState } from './MapControlButton';
import { MapFallback, PaneFallback } from './Fallbacks';
import { MapErrorBoundary } from '../MapErrorBoundary';
import { LoadingOverlay } from './LoadingOverlay';
@ -72,9 +73,11 @@ interface MobileMapPageProps {
onTogglePoiPane: () => void;
poiButtonLabel: string;
poiPane: ReactNode;
poiControl: MapControlState;
overlayPaneOpen: boolean;
onToggleOverlayPane: () => void;
overlayPane: ReactNode;
overlayControl: MapControlState;
filtersPane: ReactNode;
mobileLegend: ReactNode;
renderAreaPane: () => ReactNode;
@ -127,9 +130,11 @@ export function MobileMapPage({
onTogglePoiPane,
poiButtonLabel,
poiPane,
poiControl,
overlayPaneOpen,
onToggleOverlayPane,
overlayPane,
overlayControl,
filtersPane,
mobileLegend,
renderAreaPane,
@ -220,20 +225,22 @@ export function MobileMapPage({
)}
</button>
)}
<button
<MapControlButton
{...overlayControl}
label={t('overlays.heading')}
paneOpen={overlayPaneOpen}
showLabel={false}
onClick={onToggleOverlayPane}
className={`rounded-lg bg-white p-2 shadow-lg dark:bg-warm-800 ${overlayPaneOpen ? 'text-teal-600 dark:text-teal-400' : 'text-warm-500 hover:text-teal-600 dark:text-warm-400 dark:hover:text-teal-400'}`}
aria-label={t('overlays.heading')}
>
<EyeIcon className="h-5 w-5" filled={overlayPaneOpen} />
</button>
<button
icon={(highlighted) => <EyeIcon className="h-5 w-5" filled={highlighted} />}
/>
<MapControlButton
{...poiControl}
label={poiButtonLabel}
paneOpen={poiPaneOpen}
showLabel={false}
onClick={onTogglePoiPane}
className={`rounded-lg bg-white p-2 shadow-lg dark:bg-warm-800 ${poiPaneOpen ? 'text-teal-600 dark:text-teal-400' : 'text-warm-500 hover:text-teal-600 dark:text-warm-400 dark:hover:text-teal-400'}`}
aria-label={poiButtonLabel}
>
<MapPinIcon className="h-5 w-5" />
</button>
icon={() => <MapPinIcon className="h-5 w-5" />}
/>
</div>
{listingsPaneOpen && (