set max zoom on init if bounds are too small

weareinreach · Aug 14, 2023 · 620558b · 620558b
1 parent 8bebced
commit 620558b
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/packages/api/router/location/query.forGoogleMaps.handler.ts b/packages/api/router/location/query.forGoogleMaps.handler.ts
@@ -48,7 +48,7 @@ export const forGoogleMaps = async ({ input }: TRPCHandlerParams<TForGoogleMapsS
 		result.length === 1 && result.at(0)?.latitude && result.at(0)?.longitude
 			? ({ lat: result.at(0)!.latitude, lng: result.at(0)!.longitude } as { lat: number; lng: number })
 			: getCenter(coordsForBounds)
-	const zoom = result.length === 1 ? 11 : null
+	const zoom = result.length === 1 ? 17 : null
 
 	return {
 		locations: result,

diff --git a/packages/ui/components/core/GoogleMap.tsx b/packages/ui/components/core/GoogleMap.tsx
@@ -19,6 +19,7 @@ const MapRenderer = memo(({ height, width }: MapRendererProps) => {
 				isFractionalZoomEnabled: true,
 			})
 			const newInfoWindow = new google.maps.InfoWindow()
+
 			setMap(newMap)
 			setInfoWindow(newInfoWindow)
 			mapEvents.ready.emit(true)
@@ -49,6 +50,9 @@ export const GoogleMap = ({ height, width, locationIds }: GoogleMapProps) => {
 			if (bounds) {
 				map.fitBounds(bounds)
 				map.panToBounds(bounds)
+				if (map.getZoom() ?? 0 > 16) {
+					map.setZoom(16)
+				}
 			}
 			camera.center = center
 			camera.zoom = zoom ?? map.getZoom()

diff --git a/packages/ui/components/sections/LocationCard.tsx b/packages/ui/components/sections/LocationCard.tsx
@@ -105,7 +105,7 @@ export const LocationCard = ({ remoteOnly, locationId }: LocationCardProps) => {
 				const locationCoords = new google.maps.LatLng({ lat: data.latitude, lng: data.longitude })
 				const locationView: google.maps.CameraOptions = {
 					center: locationCoords.toJSON(),
-					zoom: 15,
+					zoom: 17,
 				}
 				const zoomIn = new Tween(camera)
 					.to(locationView, 2000)