fix: location icon doesn't change according to theme (#11504)

* Pass icon from eventmeta parent component

* Update readme

* fix: use dark:invert on map pin

Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>

* chore: remove log

Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>

* fix: change svg name

Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>

* Update packages/features/bookings/components/event-meta/AvailableEventLocations.tsx

---------

Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>
Co-authored-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>
Co-authored-by: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com>
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>

apps/web/components/eventtype/EventSetupTab.tsx

@@ -294,7 +294,6 @@ export const EventSetupTab = (
 
               const eventLabel =
                 location[eventLocationType.defaultValueVariable] || t(eventLocationType.label);
-
               return (
                 <li
                   key={`${location.type}${index}`}

packages/app-store/locations.ts

@@ -91,7 +91,7 @@ export const defaultLocations: DefaultEventLocationType[] = [
     attendeeInputType: "attendeeAddress",
     attendeeInputPlaceholder: "enter_address",
     defaultValueVariable: "attendeeAddress",
-    iconUrl: "/map-pin.svg",
+    iconUrl: "/map-pin-dark.svg",
     category: "in person",
   },
   {
@@ -103,7 +103,7 @@ export const defaultLocations: DefaultEventLocationType[] = [
     // HACK:
     variable: "locationAddress",
     defaultValueVariable: "address",
-    iconUrl: "/map-pin.svg",
+    iconUrl: "/map-pin-dark.svg",
     category: "in person",
   },
   {

packages/features/bookings/components/event-meta/AvailableEventLocations.tsx

@@ -96,7 +96,7 @@ export function AvailableEventLocations({ locations }: { locations: LocationObje
   return filteredLocations.length > 1 ? (
     <div className="flex flex-row items-center text-sm font-medium">
       <img
-        src="/map-pin.svg"
+        src="/map-pin-dark.svg"
         className={classNames("me-[10px] h-4 w-4 opacity-70 dark:invert")}
         alt="map-pin"
       />