refactor(map): switch reverse geocoding from Bing to Mapbox

Reuse the existing Mapbox token instead of maintaining a separate Bing
Maps key. Note the coordinate order flips to lon,lat for the Mapbox
geocoding endpoint.

.env

@@ -1,3 +1,2 @@
 VITE_COUCHDB=https://couch.apoena.dev
-VITE_MAP_KEY=AnLDo_m_IGvMsQPLuBak9igWj3gNYvqBodj0esZZ7VfI1OkqVWvg04eTZ4U9R0Y2
 VITE_MAPBOX_KEY=pk.eyJ1IjoiamNhbGl4dGUiLCJhIjoiY2s3cmo1aHhlMDZ3dDNtc2Z0OXl3M3c5dSJ9.rkkIAZ4lKSJZssoFvH7Fpw

README.md

@@ -36,5 +36,4 @@ Create `.env` (gitignored) with:
 ```
 VITE_COUCHDB=https://your-couchdb-host
 VITE_MAPBOX_KEY=pk.your-mapbox-token
-VITE_MAP_KEY=your-bing-maps-key
 ```

src/models/ILocationQuery.ts

@@ -1,44 +1,11 @@
 export default interface ILocationQuery {
-  authenticationResultCode: string
-  brandLogoUri: string
-  copyright: string
-  resourceSets: [
-    {
-      estimatedTotal: number
-      resources: [
-        {
-          __type: string
-          bbox: number[]
-          name: string
-          point: {
-            type: string
-            coordinates: number[]
-          }
-          address: {
-            addressLine: string
-            adminDistrict: string
-            adminDistrict2: string
-            countryRegion: string
-            formattedAddress: string
-            locality: string
-            postalCode: string
-          }
-          confidence: string
-          entityType: string
-          geocodePoints: [
-            {
-              type: string
-              coordinates: number[]
-              calculationMethod: string
-              usageTypes: string[]
-            }
-          ]
-          matchCodes: string[]
-        }
-      ]
-    }
-  ]
-  statusCode: number
-  statusDescription: string
-  traceId: string
+  type: string
+  features: Array<{
+    id: string
+    type: string
+    place_type: string[]
+    text: string
+    place_name: string
+    center: number[]
+  }>
 }

src/services/MapService.ts

@@ -2,7 +2,7 @@ import ILocation from '@/models/ILocation'
 import ILocationQuery from '@/models/ILocationQuery'
 
 class MapService {
-  private key: string = import.meta.env.VITE_MAP_KEY || ''
+  private token: string = import.meta.env.VITE_MAPBOX_KEY || ''
 
   public async getPosition(): Promise<ILocation | null> {
     const position = await this.getCurrentPosition()
@@ -28,20 +28,11 @@ class MapService {
       return ''
     }
     const json: ILocationQuery = await result.json()
-    if (
-      !json ||
-      !json.resourceSets ||
-      !json.resourceSets.length ||
-      !json.resourceSets[0].resources.length
-    ) {
-      return ''
-    }
-    const address = json.resourceSets[0].resources[0].address
-    return address ? address.locality : ''
+    return json?.features?.[0]?.text ?? ''
   }
 
   private url(latitude: number, longitude: number) {
-    return `https://dev.virtualearth.net/REST/v1/Locations/${latitude},${longitude}?key=${this.key}`
+    return `https://api.mapbox.com/geocoding/v5/mapbox.places/${longitude},${latitude}.json?types=place&limit=1&access_token=${this.token}`
   }
 
   private getCurrentPosition(): Promise<GeolocationPosition | null> {