From d21144fd8d879cc7d9141bb869e5c5509aee7b8e Mon Sep 17 00:00:00 2001
From: Mounir Dhahri <soussouheros@gmail.com>
Date: Thu, 23 Jan 2025 12:33:53 +0100
Subject: [PATCH] chore: city guide fixes

---
 src/app/Scenes/City/CityPicker.tsx                  |  2 +-
 .../City/Components/FairEventSection/index.tsx      |  2 +-
 .../Scenes/Map/Components/CitySwitcherButton.tsx    | 13 ++++---------
 src/app/Scenes/Map/GlobalMap.tsx                    | 11 +++++------
 4 files changed, 11 insertions(+), 17 deletions(-)

diff --git a/src/app/Scenes/City/CityPicker.tsx b/src/app/Scenes/City/CityPicker.tsx
index 5e8a6bcc72d..503e87fc63a 100644
--- a/src/app/Scenes/City/CityPicker.tsx
+++ b/src/app/Scenes/City/CityPicker.tsx
@@ -82,7 +82,7 @@ export const CityPicker: React.FC<Props> = (props) => {
 
 const Overlay = styled.ScrollView`
   flex: 1;
-  background-color: ${themeGet("colors.white100")};
+  background-color: ${themeGet("colors.background")};
   margin-top: ${themeGet("space.2")};
   margin-left: ${themeGet("space.2")};
   margin-right: ${themeGet("space.2")};
diff --git a/src/app/Scenes/City/Components/FairEventSection/index.tsx b/src/app/Scenes/City/Components/FairEventSection/index.tsx
index d00b45d1e3c..6438be33d05 100644
--- a/src/app/Scenes/City/Components/FairEventSection/index.tsx
+++ b/src/app/Scenes/City/Components/FairEventSection/index.tsx
@@ -9,7 +9,7 @@ import styled from "styled-components/native"
 import { FairEventSectionCard } from "./Components/FairEventSectionCard"
 
 const FairSectionBackground = styled(Box)`
-  background: black;
+  background: ${themeGet("colors.black100")};
   margin-bottom: ${themeGet("space.1")};
 `
 
diff --git a/src/app/Scenes/Map/Components/CitySwitcherButton.tsx b/src/app/Scenes/Map/Components/CitySwitcherButton.tsx
index 2f53a836c9d..46e3ba912e9 100644
--- a/src/app/Scenes/Map/Components/CitySwitcherButton.tsx
+++ b/src/app/Scenes/Map/Components/CitySwitcherButton.tsx
@@ -1,4 +1,5 @@
 import { Box, Flex, Text } from "@artsy/palette-mobile"
+import themeGet from "@styled-system/theme-get"
 import { ThemeAwareClassTheme } from "app/Components/DarkModeClassTheme"
 import ChevronIcon from "app/Components/Icons/ChevronIcon"
 import Spinner from "app/Components/Spinner"
@@ -16,7 +17,7 @@ shadow-opacity: 0.3;
 `
 
 const Background = styled(Flex)`
-  background: white;
+  background: ${themeGet("colors.background")};
   height: 40px;
   border-radius: 20px;
   ${shadowProps};
@@ -33,7 +34,7 @@ export class CitySwitcherButton extends Component<Props> {
     const { city, isLoading } = this.props
     return isLoading || city ? (
       <ThemeAwareClassTheme>
-        {({ color }) => (
+        {({}) => (
           <TouchableWithoutFeedback
             onPress={() => {
               if (this.props.onPress) {
@@ -61,13 +62,7 @@ export class CitySwitcherButton extends Component<Props> {
                     {city.name}
                   </Text>
                   <Box ml={2} mr={4}>
-                    <ChevronIcon
-                      initialDirection="down"
-                      // @ts-ignore
-                      color={color("black100")}
-                      width={20}
-                      height={20}
-                    />
+                    <ChevronIcon initialDirection="down" color="black100" width={20} height={20} />
                   </Box>
                 </>
               ) : (
diff --git a/src/app/Scenes/Map/GlobalMap.tsx b/src/app/Scenes/Map/GlobalMap.tsx
index eaa71e5ac95..c6fb224e574 100644
--- a/src/app/Scenes/Map/GlobalMap.tsx
+++ b/src/app/Scenes/Map/GlobalMap.tsx
@@ -1,8 +1,7 @@
-import { Box, Flex, Text } from "@artsy/palette-mobile"
+import { Box, ClassTheme, Flex, Text } from "@artsy/palette-mobile"
 import MapboxGL from "@rnmapbox/maps"
 import { themeGet } from "@styled-system/theme-get"
 import { GlobalMap_viewer$data } from "__generated__/GlobalMap_viewer.graphql"
-import { ThemeAwareClassTheme } from "app/Components/DarkModeClassTheme"
 import { Pin } from "app/Components/Icons/Pin"
 import PinFairSelected from "app/Components/Icons/PinFairSelected"
 import PinSavedSelected from "app/Components/Icons/PinSavedSelected"
@@ -355,7 +354,7 @@ export class GlobalMap extends React.Component<Props, State> {
         clusterLat &&
         clusterLng &&
         pointCount && (
-          <ThemeAwareClassTheme>
+          <ClassTheme>
             {({ color }) => (
               <MapboxGL.PointAnnotation
                 key={clusterId}
@@ -370,7 +369,7 @@ export class GlobalMap extends React.Component<Props, State> {
                 </SelectedCluster>
               </MapboxGL.PointAnnotation>
             )}
-          </ThemeAwareClassTheme>
+          </ClassTheme>
         )
       )
     }
@@ -542,7 +541,7 @@ export class GlobalMap extends React.Component<Props, State> {
     }
 
     return (
-      <ThemeAwareClassTheme>
+      <ClassTheme>
         {({ color }) => (
           <Flex mb={0.5} flexDirection="column" style={{ backgroundColor: color("black5") }}>
             <LoadingScreen
@@ -622,7 +621,7 @@ export class GlobalMap extends React.Component<Props, State> {
             </Flex>
           </Flex>
         )}
-      </ThemeAwareClassTheme>
+      </ClassTheme>
     )
   }