Added better artist bio/pics/lyrics

This commit is contained in:
Connor Johnstone
2026-03-19 14:53:39 -04:00
parent f6b363c40f
commit 51bcf26482
9 changed files with 580 additions and 23 deletions

View File

@@ -1,6 +1,6 @@
use std::rc::Rc;
use std::cell::Cell;
use gloo_timers::callback::Interval;
use std::cell::Cell;
use std::rc::Rc;
use yew::prelude::*;
use yew_router::prelude::*;
@@ -152,9 +152,53 @@ pub fn artist_page(props: &Props) -> Html {
<div>
<div class="page-header">
<div class="flex items-center justify-between">
<h2>{ &d.artist.name }</h2>
<div class="flex gap-2 items-center">
if let Some(ref photo) = d.artist_photo {
<img class="artist-photo" src={photo.clone()} loading="lazy" />
}
<div>
<h2>{ &d.artist.name }</h2>
if let Some(ref info) = d.artist_info {
<div class="artist-meta">
if let Some(ref country) = info.country {
<span class="tag">{ country }</span>
}
if let Some(ref atype) = info.artist_type {
<span class="tag">{ atype }</span>
}
if let Some(ref year) = info.begin_year {
<span class="text-sm text-muted">{ format!("est. {year}") }</span>
}
if let Some(ref dis) = info.disambiguation {
<span class="text-sm text-muted">{ format!("({dis})") }</span>
}
</div>
if !info.urls.is_empty() {
<div class="artist-links">
{ for info.urls.iter().filter(|u|
["wikipedia", "official homepage", "discogs", "wikidata"].contains(&u.link_type.as_str())
).map(|u| {
let label = match u.link_type.as_str() {
"wikipedia" => "Wikipedia",
"official homepage" => "Official Site",
"discogs" => "Discogs",
"wikidata" => "Wikidata",
other => other,
};
html! {
<a href={u.url.clone()} target="_blank" rel="noopener">{ label }</a>
}
})}
</div>
}
}
</div>
</div>
{ watch_all_btn }
</div>
if let Some(ref bio) = d.artist_bio {
<p class="artist-bio text-sm">{ bio }</p>
}
if d.enriched {
<p class="text-sm">
<span style="color: var(--accent);">
@@ -194,6 +238,7 @@ pub fn artist_page(props: &Props) -> Html {
<table>
<thead>
<tr>
<th style="width: 60px;"></th>
<th>{ "Title" }</th>
<th>{ "Date" }</th>
<th>{ "Owned" }</th>
@@ -206,6 +251,7 @@ pub fn artist_page(props: &Props) -> Html {
let is_unwatched = album.status == "unwatched";
let row_style = if is_unwatched { "opacity: 0.6;" } else { "" };
let cover_url = format!("https://coverartarchive.org/release/{}/front-250", album.mbid);
let album_link = html! {
<Link<Route> to={Route::Album { mbid: album.mbid.clone() }}>
{ &album.title }
@@ -255,6 +301,15 @@ pub fn artist_page(props: &Props) -> Html {
html! {
<tr style={row_style}>
<td>
<img class="album-art" src={cover_url}
loading="lazy"
onerror={Callback::from(|e: web_sys::Event| {
if let Some(el) = e.target_dyn_into::<web_sys::HtmlElement>() {
el.set_attribute("style", "display:none").ok();
}
})} />
</td>
<td>{ album_link }</td>
<td class="text-muted">{ album.date.as_deref().unwrap_or("") }</td>
<td>