fix - placeholder library

.eslintrc.js

@@ -1,7 +1,12 @@
 module.exports = {
-    extends: ["expo", "prettier"],
-    plugins: ["prettier"],
+  extends: ['expo', 'prettier'],
+  plugins: ['prettier'],
   rules: {
-        "prettier/prettier": "error",
+    'prettier/prettier': [
+      'error',
+      {
+        singleQuote: true,
+      },
+    ],
   },
 };

src/screens/Library/Library.js

@@ -1,24 +1,57 @@
-import { View, Image, ScrollView, Pressable, Platform } from "react-native";
-import React from "react";
-import Page from "../../layouts/Page";
-import { background, icons } from "../../assets";
-import SearchBar from "../../components/SearchBar";
-import MyMusic from "./components/MyMusic";
-import BackTracks from "./components/BackTracks";
-import MyClips from "./components/MyClips";
-import LikedMusic from "./components/LikedMusic";
-import LikedPlayback from "./components/LikedPlayback";
-import LikedClips from "./components/LikedClips";
-import { responsiveHeight } from "react-native-responsive-dimensions";
-import MyPlaylist from "./components/MyPlaylist";
-import { navigate } from "../../navigation/NavigationService";
-import { Routes } from "../../navigation";
+import { View, Image, ScrollView, Pressable, Platform } from 'react-native';
+import React from 'react';
+import Page from '../../layouts/Page';
+import { background, icons } from '../../assets';
+import SearchBar from '../../components/SearchBar';
+import MyMusic from './components/MyMusic';
+import BackTracks from './components/BackTracks';
+import MyClips from './components/MyClips';
+import LikedMusic from './components/LikedMusic';
+import LikedPlayback from './components/LikedPlayback';
+import LikedClips from './components/LikedClips';
+import { responsiveHeight } from 'react-native-responsive-dimensions';
+import MyPlaylist from './components/MyPlaylist';
+import { navigate } from '../../navigation/NavigationService';
+import { Routes } from '../../navigation';
+import { useUser } from '../../providers/UserDataProvider';
+import { Text } from 'react-native';
+import { Palette } from '../../styles';
+import { FONT_FAMILY } from '../../styles/Fonts';
 
 const Library = () => {
+  const {
+    userProjects = [],
+    userPlaybacks = [],
+    userLikedProjects = [],
+    userLikedPlaybacks = [],
+    userPlaylists = [],
+  } = useUser() || {};
+
+  const hasMyMusic = Array.isArray(userProjects) && userProjects.length > 0;
+  const hasBackTracks =
+    Array.isArray(userPlaybacks) && userPlaybacks.length > 0;
+  const hasLikedMusic =
+    Array.isArray(userLikedProjects) && userLikedProjects.length > 0;
+  const hasLikedPlayback =
+    Array.isArray(userLikedPlaybacks) && userLikedPlaybacks.length > 0;
+  const hasPlaylists = Array.isArray(userPlaylists) && userPlaylists.length > 0;
+
+  const hasMyClips = false; // À modifier quand les vraies données seront disponibles
+  const hasLikedClips = false; // À modifier quand les vraies données seront disponibles
+
+  const hasAnySection =
+    hasMyMusic ||
+    hasBackTracks ||
+    hasLikedMusic ||
+    hasLikedPlayback ||
+    hasPlaylists ||
+    hasMyClips ||
+    hasLikedClips;
+
   return (
-    <Page backgroundImg={background.libraryBG} headerType="NONE">
+    <Page backgroundImg={background.libraryBG} headerType='NONE'>
       <View style={{ gap: 17, paddingBottom: 20 }}>
-        <Image source={icons.musicLandLogo} style={{ alignSelf: "center" }} />
+        <Image source={icons.musicLandLogo} style={{ alignSelf: 'center' }} />
         <Pressable onPress={() => navigate(Routes.Research)}>
           <SearchBar
             textInputProps={{
@@ -34,17 +67,37 @@ const Library = () => {
             flexGrow: 1,
             gap: 20,
             paddingBottom: responsiveHeight(20),
-            paddingTop: Platform.OS !== "android" ? 20 : 0,
+            paddingTop: Platform.OS !== 'android' ? 20 : 0,
           }}
-          showsVerticalScrollIndicator={false}
-        >
-          <MyMusic />
-          <BackTracks />
-          <LikedMusic />
-          {/*<MyClips />*/}
-          <MyPlaylist />
-          <LikedPlayback />
-          {/*<LikedClips />*/}
+          showsVerticalScrollIndicator={false}>
+          {hasMyMusic && <MyMusic />}
+          {hasBackTracks && <BackTracks />}
+          {hasLikedMusic && <LikedMusic />}
+          {hasMyClips && <MyClips />}
+          {hasPlaylists && <MyPlaylist />}
+          {hasLikedPlayback && <LikedPlayback />}
+          {hasLikedClips && <LikedClips />}
+
+          {!hasAnySection && (
+            <View
+              style={{
+                flex: 1,
+                alignItems: 'center',
+                justifyContent: 'center',
+                paddingTop: 40,
+              }}>
+              <Text
+                style={{
+                  fontSize: 16,
+                  color: Palette.white,
+                  opacity: 0.8,
+                  fontFamily: FONT_FAMILY.InterRegular,
+                  textAlign: 'center',
+                }}>
+                Rien n'est disponible encore ici
+              </Text>
+            </View>
+          )}
         </ScrollView>
       </View>
     </Page>