displayed all songs of playlist

Author: ankitk26

src/components/Header.tsx

@@ -45,16 +45,16 @@ export default function Header() {
 
       <div className="flex items-center gap-6">
         <div className="flex items-center gap-3 py-2 pl-2 pr-4 rounded-full bg-background-secondary bg-opacity-70">
-          {session?.user.image !== undefined ? (
-            <User2 className="p-1 rounded-full bg-paper-400" />
-          ) : (
+          {session?.user.image ? (
             <Image
               src={session?.user.picture as string}
               className="object-contain w-8 h-8 rounded-full"
               alt={session?.user?.name}
               height={32}
               width={32}
             />
+          ) : (
+            <User2 className="p-1 rounded-full bg-paper-400" />
           )}
           <span className="text-sm font-bold tracking-wide">
             {session?.user.name}

src/lib/actions.ts

@@ -120,13 +120,27 @@ export const getUserLikedArtists = async (
   return data.artists.items;
 };
 
+type LikedSongs = { total: number; items: Track[] };
+
 export const getUserLikedSongs = async (
   session: AuthSession
-): Promise<{ total: number; items: Track[] }> => {
+): Promise<LikedSongs> => {
   const data = await customGet(
     `https://api.spotify.com/v1/me/tracks?limit=50`,
     session
   );
+
+  const finalData = { total: data.total, items: data.items };
+  let limit = 50;
+  let currUrl = data.next;
+
+  while (currUrl !== null) {
+    const nextData = await customGet(currUrl, session);
+    finalData.items.push(...nextData.items);
+    limit += 50;
+    currUrl = nextData.next;
+  }
+
   return {
     total: data.total,
     items: data.items.map((item: any) => item.track),
@@ -147,10 +161,23 @@ export const getPlaylistById = async (
   session: AuthSession,
   playlistId: string
 ): Promise<Playlist> => {
-  return customGet(
+  const data = await customGet(
     `https://api.spotify.com/v1/playlists/${playlistId}`,
     session
   );
+  const playlist = data;
+
+  let limit = 50;
+  let currUrl = data.tracks.next;
+
+  while (currUrl !== null) {
+    const nextData = await customGet(currUrl, session);
+    playlist.tracks.items.push(...nextData.items);
+    limit += 50;
+    currUrl = nextData.next;
+  }
+
+  return playlist;
 };
 
 export const getCategories = async (