wip

app/(auth)/player.tsx

@@ -22,7 +22,7 @@ import { useQuery } from "@tanstack/react-query";
 import * as Haptics from "expo-haptics";
 import { useFocusEffect, useLocalSearchParams } from "expo-router";
 import { useAtomValue } from "jotai";
-import React, { useCallback, useMemo, useRef, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Pressable, StatusBar, useWindowDimensions, View } from "react-native";
 import { SystemBars } from "react-native-edge-to-edge";
 import { useSharedValue } from "react-native-reanimated";
@@ -324,10 +324,23 @@ export default function page() {
     }[]
   >([]);
 
+  const [audioTracks, setAudioTracks] = useState<TrackInfo[]>([]);
+  const [selectedAudioTrack, setSelectedAudioTrack] = useState<
+    SelectedTrack | undefined
+  >(undefined);
+
+  const getAudioTracks = (): TrackInfo[] => {
+    return audioTracks.map((t) => ({
+      name: t.name,
+      index: t.index,
+    }));
+  };
+
   const getSubtitleTracks = (): TrackInfo[] => {
     return embededTextTracks.map((t) => ({
       name: t.title ?? "",
       index: t.index,
+      language: t.language,
     }));
   };
 
@@ -405,7 +418,18 @@ export default function page() {
             onBuffer={(e) => {
               setIsBuffering(e.isBuffering);
             }}
+            onAudioTracks={(e) => {
+              console.log("onAudioTracks: ", e.audioTracks);
+              setAudioTracks(
+                e.audioTracks.map((t) => ({
+                  index: t.index,
+                  name: t.title ?? "",
+                  language: t.language,
+                }))
+              );
+            }}
             selectedTextTrack={selectedTextTrack}
+            selectedAudioTrack={selectedAudioTrack}
           />
         ) : (
           <Text>No video source...</Text>
@@ -437,6 +461,14 @@ export default function page() {
               value: i,
             })
           }
+          getAudioTracks={getAudioTracks}
+          setAudioTrack={(i) => {
+            console.log("setAudioTrack ~", i);
+            setSelectedAudioTrack({
+              type: SelectedTrackType.INDEX,
+              value: 10,
+            });
+          }}
         />
       )}
     </View>

app/_layout.tsx

@@ -34,7 +34,7 @@ import * as SplashScreen from "expo-splash-screen";
 import * as TaskManager from "expo-task-manager";
 import { Provider as JotaiProvider, useAtom } from "jotai";
 import { useEffect, useRef } from "react";
-import { AppState } from "react-native";
+import { Appearance, AppState } from "react-native";
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 import "react-native-reanimated";
 import { Toaster } from "sonner-native";
@@ -217,6 +217,8 @@ export default function RootLayout() {
     }
   }, [loaded]);
 
+  Appearance.setColorScheme("dark");
+
   if (!loaded) {
     return null;
   }

app/login.tsx

@@ -286,7 +286,7 @@ const Login: React.FC = () => {
     <SafeAreaView style={{ flex: 1 }}>
       <KeyboardAvoidingView
         behavior={Platform.OS === "ios" ? "padding" : "height"}
-        style={{ flex: 1 }}
+        style={{ flex: 1, height: "100%" }}
       >
         <View className="flex flex-col h-full relative items-center justify-center w-full">
           <View className="flex flex-col gap-y-2 px-4 w-full -mt-36">