From 3e6ca482f9b8603824429f6bee3210e81a865d54 Mon Sep 17 00:00:00 2001
From: Mounir Dhahri <soussouheros@gmail.com>
Date: Thu, 28 Nov 2024 10:22:19 +0100
Subject: [PATCH] fix: sort & filter issues

---
 .../ArtworkFilter/ArtworkFilterNavigator.tsx   | 18 ++++++------------
 .../Scenes/Search/SearchArtworksGrid.tests.tsx |  4 ++--
 2 files changed, 8 insertions(+), 14 deletions(-)

diff --git a/src/app/Components/ArtworkFilter/ArtworkFilterNavigator.tsx b/src/app/Components/ArtworkFilter/ArtworkFilterNavigator.tsx
index 9cc012d5acc..3be65512206 100644
--- a/src/app/Components/ArtworkFilter/ArtworkFilterNavigator.tsx
+++ b/src/app/Components/ArtworkFilter/ArtworkFilterNavigator.tsx
@@ -1,5 +1,4 @@
 import { ActionType, ContextModule, OwnerType, TappedCreateAlert } from "@artsy/cohesion"
-import { Flex } from "@artsy/palette-mobile"
 import { NavigationContainer } from "@react-navigation/native"
 import { TransitionPresets, createStackNavigator } from "@react-navigation/stack"
 import { CreateSavedSearchModal } from "app/Components/Artist/ArtistArtworks/CreateSavedSearchModal"
@@ -32,12 +31,12 @@ import { TimePeriodOptionsScreen } from "app/Components/ArtworkFilter/Filters/Ti
 import { ViewAsOptionsScreen } from "app/Components/ArtworkFilter/Filters/ViewAsOptions"
 import { WaysToBuyOptionsScreen } from "app/Components/ArtworkFilter/Filters/WaysToBuyOptions"
 import { YearOptionsScreen } from "app/Components/ArtworkFilter/Filters/YearOptions"
-import { FancyModal } from "app/Components/FancyModal/FancyModal"
 import { GlobalStore } from "app/store/GlobalStore"
 import { OwnerEntityTypes, PageNames } from "app/utils/track/schema"
 import { useLocalizedUnit } from "app/utils/useLocalizedUnit"
 import { useEffect, useState } from "react"
-import { ViewProps } from "react-native"
+import { Modal, ViewProps } from "react-native"
+import { SafeAreaView } from "react-native-safe-area-context"
 import { useTracking } from "react-tracking"
 import {
   FilterModalMode as ArtworkFilterMode,
@@ -314,13 +313,8 @@ export const ArtworkFilterNavigator: React.FC<ArtworkFilterProps> = (props) => {
 
   return (
     <NavigationContainer independent>
-      <FancyModal
-        visible={props.visible}
-        onBackgroundPressed={handleClosingModal}
-        fullScreen
-        animationPosition="right"
-      >
-        <Flex flex={1}>
+      <Modal visible={props.visible} onDismiss={handleClosingModal} animationType="slide">
+        <SafeAreaView edges={["top"]} style={{ flex: 1 }}>
           <Stack.Navigator
             // force it to not use react-native-screens, which is broken inside a react-native Modal for some reason
             detachInactiveScreens={false}
@@ -409,8 +403,8 @@ export const ArtworkFilterNavigator: React.FC<ArtworkFilterProps> = (props) => {
             attributes={attributes}
             sizeMetric={filterState.sizeMetric}
           />
-        </Flex>
-      </FancyModal>
+        </SafeAreaView>
+      </Modal>
     </NavigationContainer>
   )
 }
diff --git a/src/app/Scenes/Search/SearchArtworksGrid.tests.tsx b/src/app/Scenes/Search/SearchArtworksGrid.tests.tsx
index 6f924dbc15e..f749312eec5 100644
--- a/src/app/Scenes/Search/SearchArtworksGrid.tests.tsx
+++ b/src/app/Scenes/Search/SearchArtworksGrid.tests.tsx
@@ -1,9 +1,9 @@
 import { fireEvent, screen } from "@testing-library/react-native"
 import { SearchArtworksGridTestsQuery } from "__generated__/SearchArtworksGridTestsQuery.graphql"
 import { ArtworkFiltersStoreProvider } from "app/Components/ArtworkFilter/ArtworkFilterStore"
-import { FancyModal } from "app/Components/FancyModal/FancyModal"
 import { mockTrackEvent } from "app/utils/tests/globallyMockedStuff"
 import { setupTestWrapper } from "app/utils/tests/setupTestWrapper"
+import { Modal } from "react-native"
 import { graphql } from "react-relay"
 import { SearchArtworksGridPaginationContainer } from "./SearchArtworksGrid"
 
@@ -49,7 +49,7 @@ describe("SearchArtworksGrid", () => {
   it("tracks filter modal closing", () => {
     renderWithRelay()
 
-    screen.UNSAFE_getAllByType(FancyModal)[0].props.onBackgroundPressed()
+    screen.UNSAFE_getAllByType(Modal)[0].props.onDismiss()
 
     expect(mockTrackEvent.mock.calls[0]).toMatchInlineSnapshot(`
       [