update

2025-08-13 21:03:58 +08:00
parent 7d8942e125
commit 41636b5dbc
31 changed files with 907 additions and 91 deletions
@@ -0,0 +1,145 @@
+import {
+  View,
+  Text,
+  StyleSheet,
+  Pressable,
+  ScrollView,
+  Image,
+} from "react-native";
+import React, { useState } from "react";
+import Page from "../../layouts/Page";
+import { background, img } from "../../assets";
+import { gutters, Palette, Style } from "../../styles";
+import SearchBar from "../../components/SearchBar";
+import CreateLyricsHeader from "../Writing/components/CreateLyricsHeader";
+import { FONT_FAMILY } from "../../styles/Fonts";
+import BorderGradient from "../../components/BorderGradient/BorderGradient";
+import { BlurView } from "expo-blur";
+import ResearchHeader from "./components/ResearchHeader";
+import MusicCard from "./components/MusicCard";
+import { size } from "../../styles/Style";
+import { navigate } from "../../navigation/NavigationService";
+import { Routes } from "../../navigation";
+
+const Research = () => {
+  const [selected, setSelected] = useState(null);
+
+  const onPressMenu = (item) => {
+    if (selected === item) {
+      setSelected(null);
+    } else {
+      setSelected(item);
+    }
+  };
+
+  return (
+    <Page
+      headerType="NAVIGATION"
+      backgroundImg={background.libraryBG2}
+      title="Recherche"
+      contentContainerStyle={{
+        paddingBottom: gutters * 2,
+      }}
+    >
+      <View style={{ flex: 1, gap: 10 }}>
+        <ResearchHeader
+          onPress={(item) => onPressMenu(item)}
+          selected={selected}
+        />
+        <View style={{ flex: 1 }}>
+          <ScrollView contentContainerStyle={{ paddingTop: 2 }}>
+            {(!selected || selected === "Musiques") && (
+              <View style={{ paddingHorizontal: 2 }}>
+                <CreateLyricsHeader
+                  gradientProps={{
+                    start: { x: 0, y: 0 },
+                    end: { x: 0, y: 1 },
+                  }}
+                >
+                  <View style={{ gap: 10 }}>
+                    {Array.from({ length: 3 }).map((_, index) => (
+                      <MusicCard
+                        key={index}
+                        onPress={() => navigate(Routes.MusicDetails)}
+                      />
+                    ))}
+                  </View>
+                </CreateLyricsHeader>
+              </View>
+            )}
+            {(!selected || selected === "Clips") && (
+              <View style={{ paddingHorizontal: 2, paddingTop: 10 }}>
+                <CreateLyricsHeader
+                  gradientProps={{
+                    start: { x: 0, y: 0 },
+                    end: { x: 0, y: 1 },
+                  }}
+                >
+                  <View style={{ gap: 6, ...Style.containerRow }}>
+                    {Array.from({ length: 3 }).map((_, index) => (
+                      <View style={{ flex: 1, gap: 6 }} key={index}>
+                        <Image
+                          source={img.placeholder3}
+                          style={{
+                            width: "100%",
+                            height: 147,
+                            borderRadius: 10,
+                          }}
+                        />
+                        <Text
+                          style={{
+                            fontSize: 12,
+                            color: Palette.white,
+                            fontFamily: FONT_FAMILY.InterRegular,
+                          }}
+                        >
+                          Pour Lili
+                        </Text>
+                      </View>
+                    ))}
+                  </View>
+                </CreateLyricsHeader>
+              </View>
+            )}
+            {(!selected || selected === "Profils") && (
+              <View style={{ paddingHorizontal: 2, paddingTop: 10 }}>
+                <CreateLyricsHeader
+                  gradientProps={{
+                    start: { x: 0, y: 0 },
+                    end: { x: 0, y: 1 },
+                  }}
+                >
+                  <View style={{ gap: 8 }}>
+                    {Array.from({ length: 2 }).map((_, index) => (
+                      <Pressable
+                        style={{ gap: 14, ...Style.containerRow }}
+                        key={index}
+                        onPress={() => navigate(Routes.SingerProfile)}
+                      >
+                        <Image
+                          source={img.profile}
+                          style={{ ...size({ size: 60 }), borderRadius: 100 }}
+                        />
+                        <Text
+                          style={{
+                            fontSize: 12,
+                            color: Palette.white,
+                            fontFamily: FONT_FAMILY.InterRegular,
+                          }}
+                        >
+                          ReggaetonLil
+                        </Text>
+                      </Pressable>
+                    ))}
+                  </View>
+                </CreateLyricsHeader>
+              </View>
+            )}
+          </ScrollView>
+        </View>
+      </View>
+    </Page>
+  );
+};
+
+export default Research;