progress && remove video

src/components/MusicLandHeader.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { Image, Pressable, Text, View } from "react-native";
+import { Image, Platform, Pressable, Text, View } from "react-native";
 import { icons } from "../assets";
 import { Palette, Style } from "../styles";
 import { FONT_FAMILY } from "../styles/Fonts";
@@ -12,6 +12,30 @@ const MusicLandHeader = ({
   progress = 1,
   logo = null,
 }) => {
+  const isWeb = Platform.OS === "web";
+  const backButtonStyle = isWeb
+    ? {
+        ...Style.containerRow,
+        gap: 8,
+        paddingHorizontal: 12,
+        paddingVertical: 8,
+        // backgroundColor: Palette.transparentWhite,
+        // borderRadius: mainBorderRadius,
+      }
+    : { width: 24, height: 24, ...Style.containerCenter };
+  const backIconSource = isWeb ? icons.arrowRight : icons.chevronDown;
+  const backIconStyle = isWeb
+    ? {
+        width: 16,
+        height: 16,
+        transform: [{ rotate: "180deg" }],
+      }
+    : {
+        width: 15,
+        height: 15,
+        transform: [{ rotate: "90deg" }],
+      };
+
   return (
     <View style={{ alignItems: "center", gap: 16 }}>
       <Image
@@ -19,15 +43,23 @@ const MusicLandHeader = ({
         style={{ alignSelf: "center", height: 150, resizeMode: "contain" }}
       />
       <View style={{ width: "100%", ...Style.containerRow, gap: 16 }}>
-        <Pressable
-          style={{ width: 24, height: 24, ...Style.containerCenter }}
-          onPress={onPressBack}
-        >
+        <Pressable style={backButtonStyle} onPress={onPressBack}>
           <Image
-            source={icons.chevronDown}
-            style={{ width: 15, height: 15, transform: [{ rotate: "90deg" }] }}
+            source={backIconSource}
+            style={backIconStyle}
             resizeMode="contain"
           />
+          {isWeb && (
+            <Text
+              style={{
+                fontSize: 14,
+                color: Palette.white,
+                fontFamily: FONT_FAMILY.InterSemiBold,
+              }}
+            >
+              Retour
+            </Text>
+          )}
         </Pressable>
         <View style={{ flex: 1 }}>
           <ProgressBar progress={progress} />