Changeset f5bc95e for frontend/src/pages

Timestamp:

02/12/26 22:27:24 (5 months ago)

Author:

Filip Gavrilovski <filipgavrilovski28@…>

Branches:

main

Children:

85512ff

Parents:

d85e8e3

Message:

fix music cover ui bug

Location:

frontend/src/pages

Files:

• LandingPage.tsx (modified) (2 diffs)
• MusicalCollection.tsx (modified) (2 diffs)
• SongDetail.tsx (modified) (2 diffs)

frontend/src/pages/LandingPage.tsx

@@ -1 +1 @@
 import { useEffect, useRef, useState } from "react";
 import { useNavigate } from "react-router-dom";
-import axiosInstance from "../api/axiosInstance";
+import axiosInstance, { baseURL } from "../api/axiosInstance";
 import AlbumResult from "../components/search/AlbumResult";
 import SongResult from "../components/search/SongResult";
@@ -337 +337 @@
                                                                                                 <div className="relative w-full pt-[100%] overflow-hidden bg-[#181818]">
                                                                                                         <img
-                                                                                                                src={song.cover || "/favicon.png"}
+                                                                                                                src={
+                                                                                                                        song.cover
+                                                                                                                                ? `${baseURL}/${song.cover}`
+                                                                                                                                : "/favicon.png"
+                                                                                                                }
                                                                                                                 alt={song.title}
                                                                                                                 className="absolute top-0 left-0 w-full h-full object-cover"

frontend/src/pages/MusicalCollection.tsx

@@ -1 +1 @@
 import { useEffect, useState } from "react";
 import { Link, useParams } from "react-router-dom";
-import axiosInstance from "../api/axiosInstance";
+import axiosInstance, { baseURL } from "../api/axiosInstance";
 import SongItem from "../components/SongItem";
 import { handleError } from "../utils/error";
@@ -161 +161 @@
                                                 <div className="relative w-full pt-[100%] rounded-xl overflow-hidden shadow-2xl bg-[#181818]">
                                                         <img
-                                                                src={collection.cover || "/favicon.png"}
+                                                                src={
+                                                                        collection.cover
+                                                                                ? `${baseURL}/${collection.cover}`
+                                                                                : "/favicon.png"
+                                                                }
                                                                 alt={collection.title}
                                                                 className="absolute inset-0 w-full h-full object-cover"

frontend/src/pages/SongDetail.tsx

@@ -2 +2 @@
 import { Link, useParams } from "react-router-dom";
 import { toast } from "react-toastify";
-import axiosInstance from "../api/axiosInstance";
+import axiosInstance, { baseURL } from "../api/axiosInstance";
 import { useAuth } from "../context/authContext";
 import { usePlayer } from "../context/playerContext";
@@ -216 +216 @@
                                                 <div className="relative w-full pt-[100%] rounded-xl overflow-hidden shadow-2xl bg-[#181818]">
                                                         <img
-                                                                src={song.cover || "/favicon.png"}
+                                                                src={song.cover ? `${baseURL}/${song.cover}` : "/favicon.png"}
                                                                 alt={song.title}
                                                                 className="absolute inset-0 w-full h-full object-cover"