ui(mobile): Replace bottom sheet with native screens (#690)

* Remove bottom sheet from bookmark info page

* Remove bottom sheet from manage lists page

* Remove bottom sheet from new list page

* Remove bottom sheet from new bookmark page

* Drop bottom-sheets

* Improve the look of the modals

* Make the search page fade from bottom

1 files changed, 8 insertions, 12 deletions

diff --git a/apps/mobile/app/sharing.tsx b/apps/mobile/app/sharing.tsx
index ee7bd609..e41535b7 100644
--- a/apps/mobile/app/sharing.tsx
+++ b/apps/mobile/app/sharing.tsx
@@ -1,13 +1,11 @@
-import { useEffect, useRef, useState } from "react";
-import { ActivityIndicator, Text, View } from "react-native";
+import { useEffect, useState } from "react";
+import { ActivityIndicator, Pressable, Text, View } from "react-native";
 import { useRouter } from "expo-router";
 import { useShareIntentContext } from "expo-share-intent";
-import ListPickerModal from "@/components/bookmarks/ListPickerModal";
 import { Button } from "@/components/ui/Button";
 import useAppSettings from "@/lib/settings";
 import { api } from "@/lib/trpc";
 import { useUploadAsset } from "@/lib/upload";
-import { BottomSheetModal } from "@gorhom/bottom-sheet";
 import { z } from "zod";
 
 import { BookmarkTypes, ZBookmark } from "@hoarder/shared/types/bookmarks";
@@ -84,7 +82,6 @@ export default function Sharing() {
   const [mode, setMode] = useState<Mode>({ type: "idle" });
 
   let autoCloseTimeoutId: NodeJS.Timeout | null = null;
-  const addToListSheetRef = useRef<BottomSheetModal>(null);
 
   let comp;
   switch (mode.type) {
@@ -96,24 +93,23 @@ export default function Sharing() {
     case "success": {
       comp = (
         <View className="items-center gap-4">
-          <ListPickerModal
-            ref={addToListSheetRef}
-            snapPoints={["90%"]}
-            bookmarkId={mode.bookmarkId}
-            onDismiss={() => router.replace("dashboard")}
-          />
           <Text className="text-4xl text-foreground">
             {mode.type === "alreadyExists" ? "Already Hoarded!" : "Hoarded!"}
           </Text>
           <Button
             label="Add to List"
             onPress={() => {
-              addToListSheetRef.current?.present();
+              router.push(
+                `/dashboard/bookmarks/${mode.bookmarkId}/manage_lists`,
+              );
               if (autoCloseTimeoutId) {
                 clearTimeout(autoCloseTimeoutId);
               }
             }}
           />
+          <Pressable onPress={() => router.replace("dashboard")}>
+            <Text className="text-muted-foreground">Dismiss</Text>
+          </Pressable>
         </View>
       );
       break;