Good to go

Author: malted

src/app/harbor/tavern/map.tsx

@@ -39,7 +39,6 @@ export default function Map({ tavernEvents, tavernPeople, selectedTavern }) {
           url="https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png"
         />
         <TavernMarkers people={tavernPeople} events={tavernEvents} />
-        <UserLocation />
         <MapUpdater selectedTavern={selectedTavern} />
       </MapContainer>
       <Card className="mt-8 p-3 flex flex-row justify-center items-center gap-5 flex-wrap">
@@ -83,22 +82,6 @@ export default function Map({ tavernEvents, tavernPeople, selectedTavern }) {
   )
 }
 
-function UserLocation() {
-  const map = useMap()
-
-  useEffect(() => {
-    if (navigator.geolocation) {
-      navigator.geolocation.getCurrentPosition((loc) => {
-        if (map !== null) {
-          map.setView([loc.coords.latitude, loc.coords.longitude], 11)
-        }
-      })
-    }
-  }, [map])
-
-  return null
-}
-
 function MapUpdater({
   selectedTavern,
 }: {
@@ -107,13 +90,21 @@ function MapUpdater({
   const map = useMap()
 
   useEffect(() => {
-    if (selectedTavern && selectedTavern.geocode && map) {
+    if (!map) return
+
+    if (selectedTavern && selectedTavern.geocode) {
       const geocodeData = JSON.parse(
         atob(selectedTavern.geocode.slice(2).trim()),
       )
       if (geocodeData.o.status === 'OK') {
         map.setView([geocodeData.o.lat, geocodeData.o.lng], 11)
       }
+    } else if (navigator.geolocation) {
+      navigator.geolocation.getCurrentPosition((loc) => {
+        if (map !== null) {
+          map.setView([loc.coords.latitude, loc.coords.longitude], 11)
+        }
+      })
     }
   }, [selectedTavern, map])
 

src/app/harbor/tavern/tavern.tsx

@@ -6,6 +6,7 @@ import {
   setTavernRsvpStatus,
   getTavernRsvpStatus,
   submitMyTavernLocation,
+  getMyTavernLocation,
 } from '@/app/utils/tavern'
 import { Card } from '@/components/ui/card'
 import dynamic from 'next/dynamic'
@@ -104,7 +105,9 @@ const RsvpStatusSwitcher = ({ tavernEvents, onTavernSelect }) => {
               value={whichTavern}
               className="ml-2 text-gray-600 rounded-sm"
             >
-              <option value="">Select</option>
+              <option value="" disabled>
+                Select
+              </option>
               {tavernEvents.map((te, idx) => (
                 <option key={idx} value={te.id}>
                   {te.locality}
@@ -127,11 +130,14 @@ export default function Tavern() {
   )
 
   useEffect(() => {
-    Promise.all([getTavernPeople(), getTavernEvents()]).then(([tp, te]) => {
+    Promise.all([
+      getTavernPeople(),
+      getTavernEvents(),
+      getMyTavernLocation(),
+    ]).then(([tp, te, myTavernLocation]) => {
       setTavernPeople(tp)
       setTavernEvents(te)
-
-      console.log({ te })
+      setSelectedTavern(myTavernLocation)
     })
   }, [])
 

src/app/utils/tavern.ts

@@ -2,6 +2,7 @@
 
 import Airtable from 'airtable'
 import { getSession } from './auth'
+import { TavernEventItem } from '../harbor/tavern/tavern-utils'
 
 Airtable.configure({
   apiKey: process.env.AIRTABLE_API_KEY,
@@ -61,3 +62,33 @@ export const submitMyTavernLocation = async (tavernId: string) => {
     taverns_attendee: tavernId ? [tavernId] : [],
   })
 }
+
+export const getMyTavernLocation: Promise<TavernEventItem> = async () => {
+  // check auth
+  const session = await getSession()
+  if (!session) {
+    return
+  }
+  if (!session.personId) {
+    return
+  }
+
+  // update status
+  const base = Airtable.base(process.env.BASE_ID)
+
+  const foundTavern = await base('taverns')
+    .select({
+      filterByFormula: `FIND('${session.personId}', {attendee_record_ids})`,
+    })
+    .firstPage()
+    .then((r) => r[0])
+
+  return {
+    id: foundTavern.id,
+    city: foundTavern.get('city'),
+    geocode: foundTavern.get('map_geocode'),
+    locality: foundTavern.get('locality'),
+    attendeeCount: foundTavern.get('attendees_count'),
+    organizers: foundTavern.get('organizers'),
+  }
+}