fix: simplify changeCover function and handle image loading error

src/components/now-playing.vue

@@ -30,14 +30,8 @@ async function checkNowPlaying(api: string, username: string) {
   }
 }
 
-async function changeCover(artist: string, album: string, mbid: string): Promise<string> {
+function changeCover(artist: string, album: string, mbid: string): string {
-  try {
+  return `${backendUrl}/cover/${artist.replace('/', '')}/${album}/${mbid ? mbid : '0'}`
-    const result = `${backendUrl}/cover/${artist.replace('/', '')}/${album}/${mbid ? mbid : '0'}`
-    return result
-  } catch (err) {
-    console.error('Error while changing track cover:', err)
-    return '/public/default-cover.png'
-  }
 }
 
 let timerId: ReturnType<typeof setTimeout>
@@ -55,7 +49,7 @@ onMounted(() => {
         if (artist.value != trackData[0].artist['#text'])
           ChangeTitle(artist, artist.value, trackData[0].artist['#text'])
         if (track.value != trackData[0].name) {
-          labelurl.value = await changeCover(
+          labelurl.value = changeCover(
             trackData[0].artist['#text'],
             trackData[0].album['#text'],
             trackData[0].album.mbid,
@@ -162,7 +156,7 @@ img {
     </h1>
 
     <div class="cover_name">
-      <img :src="labelurl" />
+      <img :src="labelurl" @error="labelurl = '/public/default-cover.png'" />
       <div class="name">
         <p class="track">{{ track }}</p>
         <p>{{ artist }}</p>