refactor: clear areaId if nothing under click

src/app/(maps)/components/FullScreenMap.tsx

@@ -94,11 +94,7 @@ export const FullScreenMap: React.FC = () => {
 
   const handleMapClick = useCallback(
     (e: MapLayerMouseEvent) => {
-      const areaId = e.features?.[0]?.properties?.id
-      if (areaId === '') {
-        return
-      }
-
+      const areaId = e.features?.[0]?.properties?.id ?? null
       const { camera } = urlParams.fromUrl()
       const url = urlParams.toUrl({ camera: camera ?? null, areaId })
       router.replace(url, { scroll: false })

src/components/maps/GlobalMap.tsx

@@ -108,11 +108,11 @@ export const GlobalMap: React.FC<GlobalMapProps> = ({
   const onClick = (event: MapLayerMouseEvent): void => {
     if (mapInstance === null) return
     const feature = event?.features?.[0]
+    handleOnClick?.(event)
     if (feature === undefined) {
       setClickInfo(null)
     } else {
       const { layer, geometry, properties } = feature
-      handleOnClick?.(event)
       setClickInfo(prev => {
         setActiveFeatureVisual(prev, { selected: false, hover: false })
         const activeFeature = tileToFeature(layer.id, event.point, geometry, properties as TileProps, mapInstance)

src/js/hooks/useUrlParams.tsx

@@ -20,18 +20,14 @@ const useUrlParams = (): UseUrlParamsReturn => {
     }
 
     const baseUrl = `${pathname}?`
-    const cameraParam = (camera != null) ? `camera=${cameraInfoToQuery(camera)}` : ''
+    const cameraParam = camera != null ? `camera=${cameraInfoToQuery(camera)}` : ''
     const otherParams = params.toString()
 
-    if (cameraParam != null && otherParams != null) {
-      return `${baseUrl}${cameraParam}&${otherParams}`
-    } else if (cameraParam != null) {
-      return `${baseUrl}${cameraParam}`
-    } else if (otherParams != null) {
-      return `${baseUrl}${otherParams}`
-    }
+    const query = [cameraParam, otherParams]
+      .filter(param => param !== '') // Remove empty params
+      .join('&') // Join non-empty params with `&`
 
-    return pathname
+    return query !== '' ? `${baseUrl}${query}` : pathname // Return base URL if query is empty
   }
 
   const fromUrl = (): UrlProps => {