wip

components/AudioTrackSelector.tsx

@@ -1,56 +1,60 @@
-import { TouchableOpacity, View } from "react-native";
+import { useSettings } from "@/utils/atoms/settings";
+import { useAtom } from "jotai";
+import { useEffect, useMemo } from "react";
+import { TouchableOpacity, View, ViewProps } from "react-native";
 import * as DropdownMenu from "zeego/dropdown-menu";
 import { Text } from "./common/Text";
-import { atom, useAtom } from "jotai";
-import {
-  BaseItemDto,
-  MediaSourceInfo,
-} from "@jellyfin/sdk/lib/generated-client/models";
-import { useEffect, useMemo } from "react";
-import { MediaStream } from "@jellyfin/sdk/lib/generated-client/models";
-import { tc } from "@/utils/textTools";
-import { useSettings } from "@/utils/atoms/settings";
+import { usePlaySettings } from "@/providers/PlaySettingsProvider";
 
-interface Props extends React.ComponentProps<typeof View> {
-  source: MediaSourceInfo;
-  onChange: (value: number) => void;
-  selected: number;
-}
+interface Props extends ViewProps {}
 
-export const AudioTrackSelector: React.FC<Props> = ({
-  source,
-  onChange,
-  selected,
-  ...props
-}) => {
+export const AudioTrackSelector: React.FC<Props> = ({ ...props }) => {
+  const { playSettings, setPlaySettings, playUrl } = usePlaySettings();
   const [settings] = useSettings();
 
+  const selectedIndex = useMemo(() => {
+    return playSettings?.audioIndex;
+  }, [playSettings?.audioIndex]);
+
   const audioStreams = useMemo(
-    () => source.MediaStreams?.filter((x) => x.Type === "Audio"),
-    [source]
+    () =>
+      playSettings?.mediaSource?.MediaStreams?.filter(
+        (x) => x.Type === "Audio"
+      ),
+    [playSettings?.mediaSource]
   );
 
-  const selectedAudioSteam = useMemo(
-    () => audioStreams?.find((x) => x.Index === selected),
-    [audioStreams, selected]
+  const selectedAudioStream = useMemo(
+    () => audioStreams?.find((x) => x.Index === selectedIndex),
+    [audioStreams, selectedIndex]
   );
 
+  // Set default audio stream only if none is selected and we have audio streams
   useEffect(() => {
-    const defaultAudioIndex = audioStreams?.find(
+    if (playSettings?.audioIndex !== undefined || !audioStreams?.length) return;
+
+    const defaultAudioIndex = audioStreams.find(
       (x) => x.Language === settings?.defaultAudioLanguage
     )?.Index;
-    if (defaultAudioIndex !== undefined && defaultAudioIndex !== null) {
-      onChange(defaultAudioIndex);
-      return;
-    }
-    const index = source.DefaultAudioStreamIndex;
-    if (index !== undefined && index !== null) {
-      onChange(index);
-      return;
-    }
 
-    onChange(0);
-  }, [audioStreams, settings]);
+    if (defaultAudioIndex !== undefined) {
+      setPlaySettings((prev) => ({
+        ...prev,
+        audioIndex: defaultAudioIndex,
+      }));
+    } else {
+      const index = playSettings?.mediaSource?.DefaultAudioStreamIndex ?? 0;
+      setPlaySettings((prev) => ({
+        ...prev,
+        audioIndex: index,
+      }));
+    }
+  }, [
+    audioStreams,
+    settings?.defaultAudioLanguage,
+    playSettings?.mediaSource,
+    setPlaySettings,
+  ]);
 
   return (
     <View
@@ -65,7 +69,7 @@ export const AudioTrackSelector: React.FC<Props> = ({
             <Text className="opacity-50 mb-1 text-xs">Audio</Text>
             <TouchableOpacity className="bg-neutral-900  h-10 rounded-xl border-neutral-800 border px-3 py-2 flex flex-row items-center justify-between">
               <Text className="" numberOfLines={1}>
-                {selectedAudioSteam?.DisplayTitle}
+                {selectedAudioStream?.DisplayTitle}
               </Text>
             </TouchableOpacity>
           </View>
@@ -85,7 +89,10 @@ export const AudioTrackSelector: React.FC<Props> = ({
               key={idx.toString()}
               onSelect={() => {
                 if (audio.Index !== null && audio.Index !== undefined)
-                  onChange(audio.Index);
+                  setPlaySettings((prev) => ({
+                    ...prev,
+                    audioIndex: audio.Index,
+                  }));
               }}
             >
               <DropdownMenu.ItemTitle>