fix(artist): Prefer name search, handle homonyms

src/components/artist/ArtistProfile.vue

@@ -1,14 +1,26 @@
 <template>
   <div class="profile-container">
     <div class="profile-wrapper" :class="{ visible: artistMetas }">
-      <span v-if="artistTags && artistTags.length > 0" class="tag-list">
-        <span v-for="(value, index) in artistTags.slice(0, 5)" :key="index" class="tag">
-          {{ typeof value === "string" ? value : value.name }}
+      <template v-if="artistTags && artistTags.length > 0">
+        <span class="tag-list">
+          <span
+            v-for="(value, index) in artistTags.slice(0, 5)"
+            :key="index"
+            class="tag"
+          >
+            {{ typeof value === "string" ? value : value.name }}
+          </span>
         </span>
-      </span>
-      <!-- {{ artistMetas }} -->
+      </template>
+      <template v-else-if="artistMetas?.disambiguation">
+        <span class="disambiguation">{{ artistMetas.disambiguation }}</span>
+      </template>
       <template v-if="artistMetas?.country">
-        <span class="dot desktop-only">·</span>
+        <span
+          v-if="artistTags.length > 0 || artistMetas?.disambiguation"
+          class="dot desktop-only"
+          >·
+        </span>
         <Tooltip :text="getCountry" placement="bottom">
           <img
             :src="getCountryFlagUrl(artistMetas.country)"
@@ -20,9 +32,11 @@
           </strong>
         </Tooltip>
       </template>
-      <template v-else>
+      <template
+        v-else-if="artistMetas?.['begin-area']?.name || artistMetas?.area?.name"
+      >
         <span class="dot desktop-only">·</span>
-        {{ artistMetas?.["begin-area"]?.name ||artistMetas?.["begin-area"]?.id || artistMetas?.area?.name }}
+        {{ artistMetas?.["begin-area"]?.name || artistMetas?.area?.name }}
       </template>
       <template v-if="artistMetas?.['life-span']?.begin">
         <span class="dot">·</span>
@@ -34,7 +48,9 @@
           <template v-else>
             <span>{{ artistMetas?.["life-span"]?.begin.split("-")[0] }}</span>
             <span v-if="!artistMetas['life-span'].end">
-              {{ artistMetas?.["life-span"]?.ended ? " / Inactive" : " / Active" }}
+              {{
+                artistMetas?.["life-span"]?.ended ? " / Inactive" : " / Active"
+              }}
             </span>
             <span v-else>&nbsp;/ {{ artistMetas["life-span"].end?.split("-")[0] }}</span>
           </template>
@@ -54,13 +70,15 @@ import { useArtist } from "@/views/artist/ArtistStore";
 
 const artistStore = useArtist();
 const artistMetas = computed(() => artistStore.musicbrainzArtist);
-const artistTags = computed(() => artistMetas.value?.tags || artistStore.artist.genres);
+const artistTags = computed(
+  () => artistMetas.value?.tags || artistStore.artist.genres,
+);
 const getCountry = computed(() => {
   const countryName = getCountryName(artistMetas.value?.country);
-  const artistCountry = artistMetas.value?.["begin-area"]?.name || artistMetas.value?.area?.name;
+  const artistCountry
+    = artistMetas.value?.["begin-area"]?.name || artistMetas.value?.area?.name;
   return countryName !== artistCountry ? countryName : "";
 });
-
 </script>
 
 <style lang="scss" scoped>
@@ -101,6 +119,10 @@ $transition-duration: 0.2s;
   }
 }
 
+.disambiguation {
+  opacity: 0.6;
+}
+
 .dot {
   margin: 0 1rem;
 

src/helpers/musicbrainz.ts

@@ -168,27 +168,26 @@ export async function getIdsFromMusicBrainz(
 }
 
 /**
- * Search for an artist by name in MusicBrainz (fallback when Spotify URL lookup fails)
+ * Search for artists by name in MusicBrainz
  * @param artistName - The name of the artist to search for
- * @returns Promise resolving to the first matching MusicBrainzArtist or null
+ * @returns Promise resolving to all matching MusicBrainzArtist with the same name, or empty array
  */
 export async function searchMusicBrainzArtistId(
   artistName: string,
-): Promise<MusicBrainzArtist | null> {
+): Promise<MusicBrainzArtist[]> {
   const data = await fetchFromMusicBrainz<MusicBrainzArtistSearch>("artist", {
     limit: 10,
     query: `artist:"${artistName}"`,
   });
 
   if (data && data.artists && data.artists.length > 0) {
     const normalizedSearchName = normalizeName(artistName);
-    const filtered = data.artists.filter(
+    return data.artists.filter(
       (artist) => normalizeName(artist.name) === normalizedSearchName,
     );
-    return filtered[0];
   }
 
-  return null;
+  return [];
 }
 
 /**

src/views/artist/ArtistStore.ts

@@ -139,11 +139,15 @@ export const useArtist = defineStore("artist", {
       this.wikidataArtist = null;
       this.wikipediaExtract = null;
       try {
-        // Try exact match via Spotify URL, fallback to name search
-        const artist = spotifyId
-          ? ((await searchMusicBrainzBySpotifyId(spotifyId))
-            ?? (await searchMusicBrainzArtistId(artistName)))
-          : await searchMusicBrainzArtistId(artistName);
+        // Search by name first; if multiple homonyms found and Spotify ID available,
+        // use Spotify URL lookup for exact match
+        const nameResults = await searchMusicBrainzArtistId(artistName);
+        const artist
+          = nameResults.length === 1
+            ? nameResults[0]
+            : nameResults.length > 1 && spotifyId
+              ? ((await searchMusicBrainzBySpotifyId(spotifyId)) ?? nameResults[0])
+              : nameResults[0] ?? null;
 
         if (!artist?.id) return;