create from library

src/screens/Library/components/BackTracks.js

@@ -37,6 +37,7 @@ const BackTracks = () => {
           liked: false,
         })
       }
+      onPressPlus={() => navigate(Routes.WritingLyrics)}
     >
       <View>
         {items.length > 0 && (

src/screens/Library/components/CardContainer.js

@@ -1,16 +1,22 @@
-import { View, Text, StyleSheet, Pressable } from "react-native";
 import React from "react";
+import { Image, Pressable, StyleSheet, Text, View } from "react-native";
+import { icons } from "../../../assets";
 import { Palette, Style } from "../../../styles";
 import { FONT_FAMILY } from "../../../styles/Fonts";
-
-const CardContainer = ({ children, label = "", onPress }) => {
+const CardContainer = ({ children, label = "", onPress, onPressPlus }) => {
   return (
     <View style={{ gap: 12 }}>
       <View style={{ ...Style.containerSpaceBetween }}>
         <Text style={styles.label}>{label}</Text>
-        <Pressable onPress={onPress}>
-          <Text style={styles.seeAll}>Voir tout</Text>
-        </Pressable>
+
+        <View style={{ flexDirection: "row", alignItems: "center", gap: 20 }}>
+          <Pressable onPress={onPressPlus}>
+            <Image source={icons.add} style={{ width: 15, height: 15 }} />
+          </Pressable>
+          <Pressable onPress={onPress}>
+            <Text style={styles.seeAll}>Voir tout</Text>
+          </Pressable>
+        </View>
       </View>
       {children}
     </View>

src/screens/Library/components/LikedMusic.js

@@ -38,6 +38,7 @@ const LikedMusic = () => {
           liked: true,
         })
       }
+      onPressPlus={() => navigate(Routes.WritingLyrics)}
     >
       <FlatList
         onLayout={(e) => setContainerWidth(e.nativeEvent.layout.width)}

src/screens/Library/components/MyMusic.js

@@ -30,6 +30,7 @@ const MyMusic = () => {
           liked: false,
         })
       }
+      onPressPlus={() => navigate(Routes.WritingLyrics)}
     >
       <View style={{ gap: 10 }}>
         {Array.isArray(projects) &&

src/screens/Library/components/MyPlaylist.js

@@ -1,6 +1,7 @@
 import { BlurView } from "expo-blur";
 import React from "react";
 import { Image, Platform, Pressable, Text, View } from "react-native";
+import { SheetManager } from "react-native-actions-sheet";
 import { icons } from "../../../assets";
 import useLayoutType from "../../../hooks/useLayoutType";
 import { Routes } from "../../../navigation";
@@ -20,6 +21,11 @@ const MyPlaylist = () => {
     <CardContainer
       label="Mes Playlists"
       onPress={() => navigate(Routes.AllMyPlaylist)}
+      onPressPlus={() =>
+        SheetManager.show("Playlist", {
+          payload: { startAtCreate: true },
+        })
+      }
     >
       <View style={{ gap: 8 }}>
         {playlists.map((item) => (

src/screens/Login.js

@@ -178,7 +178,7 @@ export default ({ navigation }) => {
           alignItems: "center",
         }}
       >
-        <ItemContainer height={600} width={800} disableKeyboardHeight>
+        <ItemContainer height={500} width={800} disableKeyboardHeight>
           <View style={{ gap: 30, paddingTop: 5, paddingHorizontal: 5 }}>
             <View style={{ gap: 2 }}>
               <Text