feat: add/remove bookmarks

apps/expo/src/app/(tabs)/index.tsx

@@ -1,18 +1,17 @@
 import React from "react";
 import { View } from "tamagui";
 
-import {
-  bookmarks,
-  ItemListSection,
-  watching,
-} from "~/components/item/ItemListSection";
+import { ItemListSection, watching } from "~/components/item/ItemListSection";
 import ScreenLayout from "~/components/layout/ScreenLayout";
+import { useBookmarkStore } from "~/stores/settings";
 
 export default function HomeScreen() {
+  const { bookmarks } = useBookmarkStore();
+
   return (
     <View style={{ flex: 1 }} flex={1}>
       <ScreenLayout title="Home">
-        <ItemListSection title="Bookmarks" items={bookmarks.concat(watching)} />
+        <ItemListSection title="Bookmarks" items={bookmarks} />
         <ItemListSection
           title="Continue Watching"
           items={watching.concat(bookmarks)}

apps/expo/src/app/(tabs)/settings.tsx

@@ -62,12 +62,14 @@ export default function SettingsScreen() {
       toastController.show("Update available", {
         burntOptions: { preset: "none" },
         native: true,
+        duration: 500,
       });
       await Linking.openURL(url);
     } else {
       toastController.show("No updates available", {
         burntOptions: { preset: "none" },
         native: true,
+        duration: 500,
       });
     }
   };

apps/expo/src/components/item/item.tsx

@@ -7,6 +7,7 @@ import { useToastController } from "@tamagui/toast";
 import { Image, Text, View } from "tamagui";
 
 import { usePlayerStore } from "~/stores/player/store";
+import { useBookmarkStore } from "~/stores/settings";
 
 export interface ItemData {
   id: string;
@@ -20,6 +21,7 @@ export default function Item({ data }: { data: ItemData }) {
   const resetVideo = usePlayerStore((state) => state.resetVideo);
   const router = useRouter();
   const toastController = useToastController();
+  const { isBookmarked, addBookmark, removeBookmark } = useBookmarkStore();
 
   const { title, type, year, posterUrl } = data;
 
@@ -32,20 +34,39 @@ export default function Item({ data }: { data: ItemData }) {
     });
   };
 
+  enum ContextMenuActions {
+    Bookmark = "Bookmark",
+    RemoveBookmark = "Remove Bookmark",
+    Download = "Download",
+  }
+
   const contextMenuActions = [
-    { title: "Bookmark" },
-    ...(type === "movie" ? [{ title: "Download" }] : []),
+    {
+      title: isBookmarked(data)
+        ? ContextMenuActions.RemoveBookmark
+        : ContextMenuActions.Bookmark,
+    },
+    ...(type === "movie" ? [{ title: ContextMenuActions.Download }] : []),
   ];
 
   const onContextMenuPress = (
     e: NativeSyntheticEvent<ContextMenuOnPressNativeEvent>,
   ) => {
-    if (e.nativeEvent.name === "Bookmark") {
+    if (e.nativeEvent.name === ContextMenuActions.Bookmark) {
+      addBookmark(data);
       toastController.show("Added to bookmarks", {
         burntOptions: { preset: "done" },
         native: true,
+        duration: 500,
       });
-    } else if (e.nativeEvent.name === "Download") {
+    } else if (e.nativeEvent.name === ContextMenuActions.RemoveBookmark) {
+      removeBookmark(data);
+      toastController.show("Removed from bookmarks", {
+        burntOptions: { preset: "done" },
+        native: true,
+        duration: 500,
+      });
+    } else if (e.nativeEvent.name === ContextMenuActions.Download) {
       router.push({
         pathname: "/videoPlayer",
         params: { data: JSON.stringify(data), download: "true" },

apps/expo/src/hooks/DownloadManagerContext.tsx

@@ -70,6 +70,7 @@ export const DownloadManagerProvider: React.FC<{ children: ReactNode }> = ({
     toastController.show("Download started", {
       burntOptions: { preset: "none" },
       native: true,
+      duration: 500,
     });
 
     const newDownload: DownloadItem = {
@@ -187,6 +188,7 @@ export const DownloadManagerProvider: React.FC<{ children: ReactNode }> = ({
       toastController.show("Download finished", {
         burntOptions: { preset: "done" },
         native: true,
+        duration: 500,
       });
       return asset;
     } catch (error) {
@@ -194,6 +196,7 @@ export const DownloadManagerProvider: React.FC<{ children: ReactNode }> = ({
       toastController.show("Download failed", {
         burntOptions: { preset: "error" },
         native: true,
+        duration: 500,
       });
     }
   };