fix: sort lw15 meetups by city name (#37113)

apps/www/components/LaunchWeek/15/LW15Meetups.tsx

@@ -91,10 +91,9 @@ const LW15Meetups = ({ className, meetups = [] }: PropsWithChildren<Props>) => {
     setShowOverlay(false)
   }
 
-  // Keep this for OG image generation
-  const meetupsFilteredByUniqueCountries = meetups
-    .filter((meetup, index, self) => index === self.findIndex((t) => t.country === meetup.country))
-    .sort((a, b) => a.country.localeCompare(b.country))
+  const meetupsSortedByCity = meetups.sort((a, b) =>
+    getMeetupCity(a).localeCompare(getMeetupCity(b))
+  )
 
   return (
     <>
@@ -127,8 +126,8 @@ const LW15Meetups = ({ className, meetups = [] }: PropsWithChildren<Props>) => {
             activeMeetup && 'text-foreground-muted'
           )}
         >
-          {meetups &&
-            meetups?.map((meetup: LumaEvent, i: number) => {
+          {meetupsSortedByCity &&
+            meetupsSortedByCity?.map((meetup: LumaEvent, i: number) => {
               const startAt = new Date(meetup.start_at)
               const endAt = addHours(new Date(meetup.start_at), 3)
               const after = now > startAt
@@ -160,7 +159,7 @@ const LW15Meetups = ({ className, meetups = [] }: PropsWithChildren<Props>) => {
                   {i !== meetups.length - 1 && (
                     <motion.span
                       variants={meetupVariants}
-                      className="ml-0 mb-0 my-auto flex text-foreground-lighter"
+                      className="ml-0 mb-0 my-auto flex transition-colors"
                     >
                       /
                     </motion.span>
@@ -283,8 +282,8 @@ const getMeetupCity = (meetup: LumaEvent) => {
   if (!meetup) return ''
   return (
     meetup.city ??
-    meetup.name.split(',')[0].split('-')[1] ??
-    meetup.name.split(',')[0].split(' ')[1] ??
+    meetup.name.split(',')[0].split('-')[1].trim() ??
+    meetup.name.split(',')[0].split(' ')[1].trim() ??
     meetup.name
   )
 }