Refactor getAlbumArtFromReleaseMBID

Fetch the RG caover art as a fallback by default, and don't require passing an instance of APIService as an argument (create a global instance on load).

Author: MonkeyDo

frontend/js/src/common/brainzplayer/MusicPlayer.tsx

@@ -221,11 +221,7 @@ function MusicPlayer(props: MusicPlayerProps) {
       track: BrainzPlayerQueueItem,
       setCoverArt: React.Dispatch<React.SetStateAction<string>>
     ) => {
-      const coverArt = await getAlbumArtFromListenMetadata(
-        track,
-        spotifyAuth,
-        APIService
-      );
+      const coverArt = await getAlbumArtFromListenMetadata(track, spotifyAuth);
       setCoverArt(coverArt ?? "");
     };
 

frontend/js/src/common/listens/ListenCard.tsx

@@ -774,8 +774,7 @@ export default function ListenCardWrapper(props: ListenCardProps) {
       try {
         const albumArtURL = await getAlbumArtFromListenMetadata(
           listen,
-          spotifyAuth,
-          APIService
+          spotifyAuth
         );
         return albumArtURL ?? "";
       } catch (error) {

frontend/js/src/explore/fresh-releases/components/ReleaseCard.tsx

@@ -122,13 +122,11 @@ export default function ReleaseCard(props: ReleaseCardProps) {
   React.useEffect(() => {
     async function getCoverArt() {
       let coverartURL;
-      if (releaseMBID) {
+      if (releaseMBID || releaseGroupMBID) {
         coverartURL = await getAlbumArtFromReleaseMBID(
           releaseMBID,
-          releaseGroupMBID ?? true
+          releaseGroupMBID
         );
-      } else if (releaseGroupMBID) {
-        coverartURL = await getAlbumArtFromReleaseGroupMBID(releaseGroupMBID);
       }
       if (coverartURL) {
         setCoverartSrc(coverartURL);

frontend/js/src/utils/utils.tsx

@@ -19,6 +19,8 @@ import { getCoverArtCache, setCoverArtCache } from "./coverArtCache";
 const originalFetch = window.fetch;
 const fetchWithRetry = require("fetch-retry")(originalFetch);
 
+let APIServiceInstance = new APIServiceClass(`${window.location.origin}/1`);
+
 const searchForSpotifyTrack = async (
   spotifyToken?: string,
   trackName?: string,
@@ -611,6 +613,7 @@ const getPageProps = async (): Promise<{
     const apiService = new APIServiceClass(
       api_url || `${window.location.origin}/1`
     );
+    APIServiceInstance = apiService;
     globalAppContext = {
       APIService: apiService,
       websocketsUrl: websockets_url,
@@ -800,14 +803,13 @@ const getAlbumArtFromReleaseGroupMBID = async (
 
 const getAlbumArtFromReleaseMBID = async (
   userSubmittedReleaseMBID: string | undefined | null,
-  useReleaseGroupFallback: boolean | string = false,
-  APIService?: APIServiceClass,
+  userSubmittedReleaseGroupMBID: string | undefined | null,
   optionalSize?: CAAThumbnailSizes,
   frontOnly?: boolean
 ): Promise<string | undefined> => {
   try {
     // Check cache first
-    const cacheKey = `ca:${userSubmittedReleaseMBID}-${optionalSize}-${useReleaseGroupFallback}`;
+    const cacheKey = `ca:${userSubmittedReleaseMBID}-${optionalSize}-${userSubmittedReleaseGroupMBID}`;
     const cachedCoverArt = await getCoverArtCache(cacheKey);
     if (cachedCoverArt) {
       return cachedCoverArt;
@@ -833,15 +835,20 @@ const getAlbumArtFromReleaseMBID = async (
       }
     }
 
-    if (useReleaseGroupFallback) {
-      let releaseGroupMBID = useReleaseGroupFallback;
+    /*
+      Fallback to fetching cover art for the Release Group.
+      If no RG MBID is available, first hit the MusicBrainz API
+      with the release MBID to get the RG MBID
+    */
+    if (userSubmittedReleaseMBID || userSubmittedReleaseGroupMBID) {
+      let releaseGroupMBID = userSubmittedReleaseGroupMBID;
       if (
-        _.isString(userSubmittedReleaseMBID) &&
-        !_.isString(useReleaseGroupFallback) &&
-        APIService
+        !_.isString(userSubmittedReleaseGroupMBID) &&
+        _.isString(userSubmittedReleaseMBID)
       ) {
-        const releaseGroupResponse = (await APIService.lookupMBRelease(
-          userSubmittedReleaseMBID
+        const releaseGroupResponse = (await APIServiceInstance.lookupMBRelease(
+          userSubmittedReleaseMBID,
+          "release-groups"
         )) as MusicBrainzRelease & WithReleaseGroup;
         releaseGroupMBID = releaseGroupResponse["release-group"].id;
       }
@@ -919,8 +926,7 @@ const getAlbumArtFromListenMetadataKey = (
 
 const getAlbumArtFromListenMetadata = async (
   listen: BaseListenFormat,
-  spotifyUser?: SpotifyUser,
-  APIService?: APIServiceClass
+  spotifyUser?: SpotifyUser
 ): Promise<string | undefined> => {
   if (!listen) {
     return undefined;
@@ -954,8 +960,7 @@ const getAlbumArtFromListenMetadata = async (
     // release group cover art of the user submitted release mbid next
     const userSubmittedReleaseAlbumArt = await getAlbumArtFromReleaseMBID(
       userSubmittedReleaseMBID,
-      userSubmittedReleaseGroupMBID ?? true,
-      APIService,
+      userSubmittedReleaseGroupMBID,
       undefined,
       true // we only want front images, otherwise skip
     );