fix: redirect when intro modal first time

components/IntroSheet.tsx

@@ -6,7 +6,7 @@ import {
   BottomSheetScrollView,
 } from "@gorhom/bottom-sheet";
 import { Image } from "expo-image";
-import { useRouter } from "expo-router";
+import { router } from "expo-router";
 import { forwardRef, useCallback, useImperativeHandle, useRef } from "react";
 import { useTranslation } from "react-i18next";
 import { Linking, Platform, TouchableOpacity, View } from "react-native";
@@ -22,7 +22,6 @@ export interface IntroSheetRef {
 
 export const IntroSheet = forwardRef<IntroSheetRef>((_, ref) => {
   const bottomSheetRef = useRef<BottomSheetModal>(null);
-  const router = useRouter();
   const { t } = useTranslation();
   const insets = useSafeAreaInsets();
 
@@ -54,7 +53,7 @@ export const IntroSheet = forwardRef<IntroSheetRef>((_, ref) => {
   const handleGoToSettings = useCallback(() => {
     bottomSheetRef.current?.dismiss();
     router.push("/settings");
-  }, [router]);
+  }, []);
 
   return (
     <BottomSheetModal

components/home/Home.tsx

@@ -36,9 +36,11 @@ import { Colors } from "@/constants/Colors";
 import { useNetworkStatus } from "@/hooks/useNetworkStatus";
 import { useInvalidatePlaybackProgressCache } from "@/hooks/useRevalidatePlaybackProgressCache";
 import { useDownload } from "@/providers/DownloadProvider";
+import { useIntroSheet } from "@/providers/IntroSheetProvider";
 import { apiAtom, userAtom } from "@/providers/JellyfinProvider";
 import { useSettings } from "@/utils/atoms/settings";
 import { eventBus } from "@/utils/eventBus";
+import { storage } from "@/utils/mmkv";
 
 type InfiniteScrollingCollectionListSection = {
   type: "InfiniteScrollingCollectionList";
@@ -79,6 +81,21 @@ export const Home = () => {
   } = useNetworkStatus();
   const invalidateCache = useInvalidatePlaybackProgressCache();
   const [loadedSections, setLoadedSections] = useState<Set<string>>(new Set());
+  const { showIntro } = useIntroSheet();
+
+  // Show intro modal on first launch
+  useEffect(() => {
+    const hasShownIntro = storage.getBoolean("hasShownIntro");
+    if (!hasShownIntro) {
+      const timer = setTimeout(() => {
+        showIntro();
+      }, 1000);
+
+      return () => {
+        clearTimeout(timer);
+      };
+    }
+  }, [showIntro]);
 
   useEffect(() => {
     if (isConnected && !prevIsConnected.current) {