update

2025-08-11 21:10:08 +08:00
parent 7bcc2e9779
commit 643e8054ac
27 changed files with 912 additions and 23 deletions
@@ -0,0 +1,162 @@
+import { View, Text, Image } from "react-native";
+import React, { useState } from "react";
+import Page from "../../layouts/Page";
+import MusicLandHeader from "../../components/MusicLandHeader";
+import { background, img } from "../../assets";
+import { goBack, navigate } from "../../navigation/NavigationService";
+import CreateLyricsHeader from "../Writing/components/CreateLyricsHeader";
+import { responsiveHeight } from "react-native-responsive-dimensions";
+import Style, { size } from "../../styles/Style";
+import { Palette } from "../../styles";
+import { FONT_FAMILY } from "../../styles/Fonts";
+import { Routes } from "../../navigation";
+
+const STREAM_PRICES = [
+  {
+    title: "Je diffuse ma chanson",
+    description: "Ce morceau uniquement",
+    price: "1,99€ / mois",
+  },
+  {
+    title: "Je diffuse 3 chansons",
+    description: "Ce morceau et les 2 prochains que tu crées",
+    price: "3,99€ / mois",
+  },
+  {
+    title: "Illimité",
+    price: "14,99€ / mois",
+    recommended: true,
+  },
+];
+
+const StreamSong = () => {
+  const [selectedIndex, setSelectedIndex] = useState(null);
+
+  return (
+    <Page backgroundImg={background.productionBG2} headerType="NONE">
+      <MusicLandHeader onPressBack={goBack} progress={75} />
+      <View style={{ flex: 1, paddingTop: responsiveHeight(5) }}>
+        <CreateLyricsHeader
+          gradientProps={{
+            start: { x: 0, y: 0 },
+            end: { x: 0, y: 1 },
+          }}
+        >
+          <Image
+            source={img.placeholder2}
+            style={{
+              ...size({ size: 158 }),
+              borderRadius: 13,
+              alignSelf: "center",
+            }}
+          />
+          <View style={{ gap: 12 }}>
+            <View style={{ gap: 2, marginTop: 12 }}>
+              <Text
+                style={{
+                  fontSize: 22,
+                  color: Palette.white,
+                  fontFamily: FONT_FAMILY.InterSemiBold,
+                  textAlign: "center",
+                }}
+              >
+                Diffuser ta chanson{"\n"}
+                Tarifs
+              </Text>
+              <Text
+                style={{
+                  fontSize: 16,
+                  color: Palette.white,
+                  fontFamily: FONT_FAMILY.InterMedium,
+                  textAlign: "center",
+                }}
+              >
+                Si tu désires diffuser ta chanson ou tes chansons sur la
+                plateforme de MusicLand et participer au concours et être dans
+                le top 3 voici le tarif.
+              </Text>
+            </View>
+            <View style={{ gap: 10 }}>
+              {STREAM_PRICES.map((item, index) => (
+                <CreateLyricsHeader
+                  key={index}
+                  colors={
+                    selectedIndex === index
+                      ? ["#F94697", "#7023F7"]
+                      : [Palette.tran, Palette.tran]
+                  }
+                  tint={!item.recommended ? "dark" : "light"}
+                  onPress={() => {
+                    setSelectedIndex(index);
+                    navigate(Routes.SongRelease);
+                  }}
+                >
+                  <View style={{ paddingTop: 5 }}>
+                    <Text
+                      style={{
+                        fontSize: 16,
+                        color: Palette.white,
+                        fontFamily: FONT_FAMILY.HelveticaNeueBold,
+                      }}
+                    >
+                      {item.title}
+                    </Text>
+                    {item.description && (
+                      <Text
+                        style={{
+                          fontSize: 12,
+                          color: Palette.white,
+                          fontFamily: FONT_FAMILY.InterRegular,
+                        }}
+                      >
+                        {item.description}
+                      </Text>
+                    )}
+                  </View>
+                  <View style={{ alignSelf: "flex-end", marginTop: 5 }}>
+                    <Text
+                      style={{
+                        fontSize: 12,
+                        color: Palette.white,
+                        fontFamily: FONT_FAMILY.InterRegular,
+                      }}
+                    >
+                      {item.price}
+                    </Text>
+                  </View>
+                  {item.recommended && (
+                    <View
+                      style={{
+                        paddingHorizontal: 10,
+                        height: 26,
+                        ...Style.containerCenter,
+                        borderRadius: 100,
+                        position: "absolute",
+                        backgroundColor: "#FFFFFF33",
+                        bottom: 8,
+                        left: 10,
+                      }}
+                    >
+                      <Text
+                        style={{
+                          fontSize: 14,
+                          color: Palette.white,
+                          fontFamily: FONT_FAMILY.HelveticaNeueRegular,
+                          bottom: -1,
+                        }}
+                      >
+                        Recommandé
+                      </Text>
+                    </View>
+                  )}
+                </CreateLyricsHeader>
+              ))}
+            </View>
+          </View>
+        </CreateLyricsHeader>
+      </View>
+    </Page>
+  );
+};
+
+export default StreamSong;