Change main page and modify flows

src/screens/Library/components/LikedMusic.js

@@ -1,5 +1,6 @@
 import React from "react";
-import { FlatList, Image, Pressable, useWindowDimensions } from "react-native";
+import { FlatList, Pressable, useWindowDimensions, Image as RNImage } from "react-native";
+import { Image as ExpoImage } from "expo-image";
 import { img } from "../../../assets";
 import { Routes } from "../../../navigation";
 import { navigate } from "../../../navigation/NavigationService";
@@ -36,15 +37,27 @@ const LikedMusic = () => {
               navigate(Routes.MusicDetails, { projectId: item.id })
             }
           >
-            <Image
-              source={
-                item?.coverUrl ? { uri: item.coverUrl } : img.placeholder3
-              }
-              style={{
-                height: itemWidth - containerGap,
-                borderRadius: 10,
-              }}
-            />
+            {item?.coverUrl ? (
+              <ExpoImage
+                source={{ uri: item.coverUrl }}
+                cachePolicy="memory-disk"
+                priority="high"
+                contentFit="cover"
+                transition={100}
+                style={{
+                  height: itemWidth - containerGap,
+                  borderRadius: 10,
+                }}
+              />
+            ) : (
+              <RNImage
+                source={img.placeholder3}
+                style={{
+                  height: itemWidth - containerGap,
+                  borderRadius: 10,
+                }}
+              />
+            )}
           </Pressable>
         )}
       />