wip: external subs and cleanup

app/(auth)/(tabs)/(home,libraries,search)/items/page.tsx

@@ -2,6 +2,10 @@ import { Text } from "@/components/common/Text";
 import { ItemContent } from "@/components/ItemContent";
 import { apiAtom, userAtom } from "@/providers/JellyfinProvider";
 import { getUserItemData } from "@/utils/jellyfin/user-library/getUserItemData";
+import {
+  getMediaInfoApi,
+  getUserLibraryApi,
+} from "@jellyfin/sdk/lib/utils/api";
 import { useQuery } from "@tanstack/react-query";
 import { useLocalSearchParams } from "expo-router";
 import { useAtom } from "jotai";
@@ -22,16 +26,16 @@ const Page: React.FC = () => {
   const { data: item, isError } = useQuery({
     queryKey: ["item", id],
     queryFn: async () => {
-      const res = await getUserItemData({
-        api,
-        userId: user?.Id,
+      if (!api) return;
+      const res = await getUserLibraryApi(api).getItem({
         itemId: id,
+        userId: user?.Id,
       });
 
-      return res;
+      return res.data;
     },
     enabled: !!id && !!api,
-    staleTime: 60 * 1000 * 5, // 5 minutes
+    staleTime: 0,
   });
 
   const opacity = useSharedValue(1);

app/(auth)/play-music.tsx

@@ -52,7 +52,6 @@ export default function page() {
 
   const togglePlay = useCallback(
     async (ticks: number) => {
-      console.log("togglePlay");
       Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
       if (isPlaying) {
         videoRef.current?.pause();

app/(auth)/vlc-player.tsx

@@ -9,7 +9,7 @@ import {
   ProgressUpdatePayload,
   VlcPlayerViewRef,
 } from "@/modules/vlc-player/src/VlcPlayer.types";
-import { apiAtom } from "@/providers/JellyfinProvider";
+import { apiAtom, userAtom } from "@/providers/JellyfinProvider";
 import {
   PlaybackType,
   usePlaySettings,
@@ -17,9 +17,11 @@ import {
 import { useSettings } from "@/utils/atoms/settings";
 import { getBackdropUrl } from "@/utils/jellyfin/image/getBackdropUrl";
 import { getAuthHeaders } from "@/utils/jellyfin/jellyfin";
+import native from "@/utils/profiles/native";
 import { ticksToSeconds } from "@/utils/time";
 import { Api } from "@jellyfin/sdk";
-import { getPlaystateApi } from "@jellyfin/sdk/lib/utils/api";
+import { getMediaInfoApi, getPlaystateApi } from "@jellyfin/sdk/lib/utils/api";
+import { useQuery } from "@tanstack/react-query";
 import * as Haptics from "expo-haptics";
 import { useFocusEffect } from "expo-router";
 import { useAtomValue } from "jotai";
@@ -35,13 +37,13 @@ import { useSharedValue } from "react-native-reanimated";
 import { SelectedTrackType } from "react-native-video";
 
 export default function page() {
-  const { playSettings, playUrl, playSessionId } = usePlaySettings();
+  const { playSettings, playUrl, playSessionId, mediaSource } =
+    usePlaySettings();
   const api = useAtomValue(apiAtom);
   const [settings] = useSettings();
   const videoRef = useRef<VlcPlayerViewRef>(null);
   const poster = usePoster(playSettings, api);
   const videoSource = useVideoSource(playSettings, api, poster, playUrl);
-  const firstTime = useRef(true);
 
   const screenDimensions = Dimensions.get("screen");
 
@@ -54,12 +56,20 @@ export default function page() {
   const progress = useSharedValue(0);
   const isSeeking = useSharedValue(false);
   const cacheProgress = useSharedValue(0);
+  const user = useAtomValue(userAtom);
 
   const [playbackState, setPlaybackState] = useState<
     PlaybackStatePayload["nativeEvent"] | null
   >(null);
 
-  if (!playSettings || !playUrl || !api || !videoSource || !playSettings.item)
+  if (
+    !playSettings ||
+    !playUrl ||
+    !api ||
+    !videoSource ||
+    !playSettings.item ||
+    !mediaSource
+  )
     return null;
 
   const togglePlay = useCallback(
@@ -99,7 +109,7 @@ export default function page() {
         });
       }
     },
-    [isPlaying, api, playSettings?.item?.Id, videoRef, settings]
+    [isPlaying, api, playSettings?.item?.Id, videoRef]
   );
 
   const play = useCallback(() => {
@@ -151,13 +161,6 @@ export default function page() {
 
       setIsBuffering(isBuffering);
 
-      // console.log("onProgress ~", {
-      //   currentTime,
-      //   duration,
-      //   isBuffering,
-      //   isPlaying,
-      // });
-
       progress.value = currentTime;
 
       // cacheProgress.value = secondsToTicks(data.playableDuration);
@@ -204,46 +207,9 @@ export default function page() {
     stopPlayback: stop,
   });
 
-  const selectedSubtitleTrack = useMemo(() => {
-    const a = playSettings?.mediaSource?.MediaStreams?.find(
-      (s) => s.Index === playSettings.subtitleIndex
-    );
-    console.log(a);
-    return a;
-  }, [playSettings]);
-
-  const [hlsSubTracks, setHlsSubTracks] = useState<
-    {
-      index: number;
-      language?: string | undefined;
-      selected?: boolean | undefined;
-      title?: string | undefined;
-      type: any;
-    }[]
-  >([]);
-
-  const selectedTextTrack = useMemo(() => {
-    for (let st of hlsSubTracks) {
-      if (st.title === selectedSubtitleTrack?.DisplayTitle) {
-        return {
-          type: SelectedTrackType.TITLE,
-          value: selectedSubtitleTrack?.DisplayTitle ?? "",
-        };
-      }
-    }
-    return undefined;
-  }, [hlsSubTracks]);
-
   const onPlaybackStateChanged = (e: PlaybackStatePayload) => {
     const { target, state, isBuffering, isPlaying } = e.nativeEvent;
 
-    console.log("onPlaybackStateChanged", {
-      target,
-      state,
-      isBuffering,
-      isPlaying,
-    });
-
     if (state === "Playing") {
       setIsPlaying(true);
       return;
@@ -299,12 +265,9 @@ export default function page() {
           onVideoProgress={onProgress}
           progressUpdateInterval={1000}
           onVideoStateChange={onPlaybackStateChanged}
-          onVideoLoadStart={() => {
-            console.log("onVideoLoadStart");
-          }}
+          onVideoLoadStart={() => {}}
           onVideoLoadEnd={() => {
             setIsVideoLoaded(true);
-            console.log("onVideoLoadEnd");
           }}
         />
       </Pressable>
@@ -325,6 +288,7 @@ export default function page() {
       /> */}
 
       <Controls
+        mediaSource={mediaSource}
         item={playSettings.item}
         videoRef={videoRef}
         togglePlay={togglePlay}

app/_layout.tsx

@@ -103,12 +103,6 @@ TaskManager.defineTask(BACKGROUND_FETCH_TASK, async () => {
   if (!token || !deviceId || !baseDirectory)
     return BackgroundFetch.BackgroundFetchResult.NoData;
 
-  console.log({
-    token,
-    url,
-    deviceId,
-  });
-
   const jobs = await getAllJobsByDeviceId({
     deviceId,
     authHeader: token,
@@ -120,14 +114,6 @@ TaskManager.defineTask(BACKGROUND_FETCH_TASK, async () => {
   for (let job of jobs) {
     if (job.status === "completed") {
       const downloadUrl = url + "download/" + job.id;
-      console.log({
-        token,
-        deviceId,
-        baseDirectory,
-        url,
-        downloadUrl,
-      });
-
       const tasks = await checkForExistingDownloads();
 
       if (tasks.find((task) => task.id === job.id)) {
@@ -137,7 +123,7 @@ TaskManager.defineTask(BACKGROUND_FETCH_TASK, async () => {
 
       download({
         id: job.id,
-        url: url + "download/" + job.id,
+        url: downloadUrl,
         destination: `${baseDirectory}${job.item.Id}.mp4`,
         headers: {
           Authorization: token,

app/login.tsx

@@ -128,9 +128,9 @@ const Login: React.FC = () => {
         } catch (e) {
           const error = e as Error;
           if (error.name === "AbortError") {
-            console.log(`Request to ${protocol}${url} timed out`);
+            console.error(`Request to ${protocol}${url} timed out`);
           } else {
-            console.log(`Error checking ${protocol}${url}:`, error);
+            console.error(`Error checking ${protocol}${url}:`, error);
           }
         }
       }