Added audioSlider.tsx

components/video-player/controls/AudioSlider.tsx

@@ -0,0 +1,49 @@
+import React, { useEffect } from "react";
+import { View, StyleSheet } from "react-native";
+import { useSharedValue } from "react-native-reanimated";
+import { Slider } from "react-native-awesome-slider";
+import VolumeManager from "react-native-volume-manager";
+import { Ionicons } from "@expo/vector-icons";
+
+const AudioSlider = () => {
+  const volume = useSharedValue<number>(50); // Explicitly type as number
+  const min = useSharedValue<number>(0); // Explicitly type as number
+  const max = useSharedValue<number>(100); // Explicitly type as number
+
+  useEffect(() => {
+    const fetchInitialVolume = async () => {
+      const initialVolume: number = await VolumeManager.getVolume();
+      console.log("initialVolume", initialVolume);
+      volume.value = initialVolume * 100;
+    };
+    fetchInitialVolume();
+  }, []);
+
+  const handleValueChange = async (value: number) => {
+    volume.value = value;
+    await VolumeManager.setVolume(value / 100);
+  };
+
+  return (
+    <View style={styles.sliderContainer}>
+      <Slider
+        progress={volume}
+        minimumValue={min}
+        maximumValue={max}
+        onValueChange={handleValueChange}
+      />
+      <Ionicons name="volume-high" size={24} color="black" />
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  sliderContainer: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center",
+    padding: 10,
+  },
+});
+
+export default AudioSlider;

package.json

@@ -71,7 +71,7 @@
     "react-dom": "18.2.0",
     "react-native": "0.74.5",
     "react-native-awesome-slider": "^2.5.6",
-    "react-native-bottom-tabs": "^0.7.3",
+    "react-native-bottom-tabs": "^0.7.1",
     "react-native-circular-progress": "^1.4.1",
     "react-native-compressor": "^1.9.0",
     "react-native-device-info": "^14.0.1",
@@ -95,6 +95,7 @@
     "react-native-url-polyfill": "^2.0.0",
     "react-native-uuid": "^2.0.2",
     "react-native-video": "^6.7.0",
+    "react-native-volume-manager": "^1.10.0",
     "react-native-web": "~0.19.13",
     "sonner-native": "^0.14.2",
     "tailwindcss": "3.3.2",