fix: refactor settings location for notifications

app/(auth)/(tabs)/(home)/settings.tsx

@@ -16,11 +16,21 @@ import { useHaptic } from "@/hooks/useHaptic";
 import { useJellyfin } from "@/providers/JellyfinProvider";
 import { clearLogs } from "@/utils/log";
 import { storage } from "@/utils/mmkv";
+import { RECENTLY_ADDED_SENT_NOTIFICATIONS_ITEM_IDS_KEY } from "@/utils/recently-added-notifications";
 import { useNavigation, useRouter } from "expo-router";
 import { t } from "i18next";
-import React, { useEffect } from "react";
-import { ScrollView, TouchableOpacity, View } from "react-native";
+import React, { useCallback, useEffect, useMemo } from "react";
+import {
+  ScrollView,
+  StyleSheet,
+  Switch,
+  TouchableOpacity,
+  View,
+} from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
+import * as TaskManager from "expo-task-manager";
+import { BACKGROUND_FETCH_TASK_RECENTLY_ADDED } from "@/utils/background-tasks";
+import { RecentlyAddedNotificationsSettings } from "@/components/settings/RecentlyAddedNotifications";
 
 export default function settings() {
   const router = useRouter();
@@ -91,7 +101,7 @@ export default function settings() {
           />
         </ListGroup>
 
-        <View className="mb-4">
+        <View className="">
           <ListGroup title={t("home.settings.logs.logs_title")}>
             <ListItem
               onPress={() => router.push("/settings/logs/page")}
@@ -106,7 +116,21 @@ export default function settings() {
           </ListGroup>
         </View>
 
-        <StorageSettings />
+        <RecentlyAddedNotificationsSettings />
+
+        <View
+          style={{
+            height: StyleSheet.hairlineWidth,
+            backgroundColor: "white",
+            overflow: "hidden",
+            marginVertical: 16,
+            opacity: 0.3,
+          }}
+        ></View>
+
+        <View className="">
+          <StorageSettings />
+        </View>
       </View>
     </ScrollView>
   );

components/settings/OtherSettings.tsx

@@ -22,6 +22,7 @@ import { ListItem } from "../list/ListItem";
 import { useTranslation } from "react-i18next";
 import DisabledSetting from "@/components/settings/DisabledSetting";
 import Dropdown from "@/components/common/Dropdown";
+import { RECENTLY_ADDED_SENT_NOTIFICATIONS_ITEM_IDS_KEY } from "@/utils/recently-added-notifications";
 
 export const OtherSettings: React.FC = () => {
   const router = useRouter();
@@ -202,14 +203,6 @@ export const OtherSettings: React.FC = () => {
             }
           />
         </ListItem>
-        <ListItem title={"Recently added notifications"}>
-          <Switch
-            value={settings.recentlyAddedNotifications}
-            onValueChange={(recentlyAddedNotifications) =>
-              updateSettings({ recentlyAddedNotifications })
-            }
-          />
-        </ListItem>
       </ListGroup>
     </DisabledSetting>
   );

components/settings/RecentlyAddedNotifications.tsx

@@ -0,0 +1,50 @@
+import settings from "@/app/(auth)/(tabs)/(home)/settings";
+import { Switch, View } from "react-native";
+import { ListGroup } from "../list/ListGroup";
+import { ListItem } from "../list/ListItem";
+import { useSettings } from "@/utils/atoms/settings";
+import React, { useCallback, useEffect, useMemo } from "react";
+import { BACKGROUND_FETCH_TASK_RECENTLY_ADDED } from "@/utils/background-tasks";
+import { storage } from "@/utils/mmkv";
+import { RECENTLY_ADDED_SENT_NOTIFICATIONS_ITEM_IDS_KEY } from "@/utils/recently-added-notifications";
+import * as TaskManager from "expo-task-manager";
+import * as BackgroundFetch from "expo-background-fetch";
+
+export const RecentlyAddedNotificationsSettings: React.FC = ({ ...props }) => {
+  const [settings, updateSettings] = useSettings();
+
+  const clearRecentlyAddedNotifications = useCallback(() => {
+    storage.delete(RECENTLY_ADDED_SENT_NOTIFICATIONS_ITEM_IDS_KEY);
+  }, []);
+
+  const recentlyAddedNotificationsItemIds = useMemo(() => {
+    const s = storage.getString(RECENTLY_ADDED_SENT_NOTIFICATIONS_ITEM_IDS_KEY);
+    if (!s) return [] as string[];
+    try {
+      const t: string[] = JSON.parse(s);
+      return t;
+    } catch (e) {
+      throw new Error("Failed to parse recently added notifications item ids");
+    }
+  }, []);
+
+  return (
+    <View className="mb-4" {...props}>
+      <ListGroup title={"Recently Added Notifications"}>
+        <ListItem title={"Recently added notifications"}>
+          <Switch
+            value={settings.recentlyAddedNotifications}
+            onValueChange={(recentlyAddedNotifications) =>
+              updateSettings({ recentlyAddedNotifications })
+            }
+          />
+        </ListItem>
+        <ListItem
+          textColor="red"
+          onPress={clearRecentlyAddedNotifications}
+          title={`Reset recently added notifications (${recentlyAddedNotificationsItemIds.length})`}
+        />
+      </ListGroup>
+    </View>
+  );
+};

components/settings/StorageSettings.tsx

@@ -44,20 +44,6 @@ export const StorageSettings = () => {
     return ((value / total) * 100).toFixed(2);
   };
 
-  const clearRecentlyAddedNotifications = useCallback(() => {
-    storage.delete(RECENTLY_ADDED_SENT_NOTIFICATIONS_ITEM_IDS_KEY);
-  }, []);
-
-  const recentlyAddedNotificationsItemIds = useMemo(() => {
-    const s = storage.getString(RECENTLY_ADDED_SENT_NOTIFICATIONS_ITEM_IDS_KEY);
-    if (!s) return [] as string[];
-    try {
-      const t: string[] = JSON.parse(s);
-      return t;
-    } catch (e) {
-      throw new Error("Failed to parse recently added notifications item ids");
-    }
-  }, []);
 
   return (
     <View>
@@ -127,13 +113,7 @@ export const StorageSettings = () => {
           title={t("home.settings.storage.delete_all_downloaded_files")}
         />
       </ListGroup>
-      <ListGroup>
-        <ListItem
-          textColor="red"
-          onPress={clearRecentlyAddedNotifications}
-          title={`Reset recently added notifications (${recentlyAddedNotificationsItemIds.length})`}
-        />
-      </ListGroup>
+      
     </View>
   );
 };