feat(web): replace broken user avatars on error

This commit is contained in:
əlemi 2024-07-17 23:01:00 +02:00
parent c811eb25bd
commit 0d70f6d3a6
Signed by: alemi
GPG key ID: A4895B84D311642C
3 changed files with 9 additions and 9 deletions

View file

@ -1,6 +1,6 @@
use leptos::*; use leptos::*;
use leptos_router::*; use leptos_router::*;
use crate::{getters::Getter, prelude::*, DEFAULT_AVATAR_URL}; use crate::{getters::Getter, prelude::*, FALLBACK_IMAGE_URL};
use apb::{field::OptionalString, ActivityMut, Actor, Base, Object, ObjectMut}; use apb::{field::OptionalString, ActivityMut, Actor, Base, Object, ObjectMut};
@ -34,8 +34,8 @@ pub fn ActorHeader() -> impl IntoView {
None => view! { <Loader /> }.into_view(), None => view! { <Loader /> }.into_view(),
Some(Err(e)) => view! { <code class="center cw color">"could not resolve user: "{e}</code> }.into_view(), Some(Err(e)) => view! { <code class="center cw color">"could not resolve user: "{e}</code> }.into_view(),
Some(Ok(actor)) => { Some(Ok(actor)) => {
let avatar_url = actor.icon().get().map(|x| x.url().id().str().unwrap_or(DEFAULT_AVATAR_URL.into())).unwrap_or(DEFAULT_AVATAR_URL.into()); let avatar_url = actor.icon().get().map(|x| x.url().id().str().unwrap_or(FALLBACK_IMAGE_URL.into())).unwrap_or(FALLBACK_IMAGE_URL.into());
let background_url = actor.image().get().map(|x| x.url().id().str().unwrap_or(DEFAULT_AVATAR_URL.into())).unwrap_or(DEFAULT_AVATAR_URL.into()); let background_url = actor.image().get().map(|x| x.url().id().str().unwrap_or(FALLBACK_IMAGE_URL.into())).unwrap_or(FALLBACK_IMAGE_URL.into());
let username = actor.preferred_username().unwrap_or_default().to_string(); let username = actor.preferred_username().unwrap_or_default().to_string();
let name = actor.name().str().unwrap_or(username.clone()); let name = actor.name().str().unwrap_or(username.clone());
let created = actor.published().ok(); let created = actor.published().ok();

View file

@ -1,5 +1,5 @@
use leptos::*; use leptos::*;
use crate::{prelude::*, DEFAULT_AVATAR_URL}; use crate::{prelude::*, FALLBACK_IMAGE_URL};
use apb::{field::OptionalString, Activity, ActivityMut, Actor, Base, Object, ObjectMut}; use apb::{field::OptionalString, Activity, ActivityMut, Actor, Base, Object, ObjectMut};
@ -12,10 +12,10 @@ pub fn ActorStrip(object: crate::Object) -> impl IntoView {
let actor_id = object.id().unwrap_or_default().to_string(); let actor_id = object.id().unwrap_or_default().to_string();
let username = object.preferred_username().unwrap_or_default().to_string(); let username = object.preferred_username().unwrap_or_default().to_string();
let domain = object.id().unwrap_or_default().replace("https://", "").split('/').next().unwrap_or_default().to_string(); let domain = object.id().unwrap_or_default().replace("https://", "").split('/').next().unwrap_or_default().to_string();
let avatar = object.icon().get().map(|x| x.url().id().str().unwrap_or(DEFAULT_AVATAR_URL.into())).unwrap_or(DEFAULT_AVATAR_URL.into()); let avatar = object.icon().get().map(|x| x.url().id().str().unwrap_or(FALLBACK_IMAGE_URL.into())).unwrap_or(FALLBACK_IMAGE_URL.into());
view! { view! {
<a href={Uri::web(U::Actor, &actor_id)} class="clean hover"> <a href={Uri::web(U::Actor, &actor_id)} class="clean hover">
<img src={avatar} class="avatar inline mr-s" /><b>{username}</b><small>@{domain}</small> <img src={avatar} class="avatar inline mr-s" onerror={format!("this.onerror=null; this.src='{FALLBACK_IMAGE_URL}';")} /><b>{username}</b><small>@{domain}</small>
</a> </a>
} }
} }
@ -29,7 +29,7 @@ pub fn ActorBanner(object: crate::Object) -> impl IntoView {
serde_json::Value::Object(_) => { serde_json::Value::Object(_) => {
let uid = object.id().unwrap_or_default().to_string(); let uid = object.id().unwrap_or_default().to_string();
let uri = Uri::web(U::Actor, &uid); let uri = Uri::web(U::Actor, &uid);
let avatar_url = object.icon().get().map(|x| x.url().id().str().unwrap_or(DEFAULT_AVATAR_URL.into())).unwrap_or(DEFAULT_AVATAR_URL.into()); let avatar_url = object.icon().get().map(|x| x.url().id().str().unwrap_or(FALLBACK_IMAGE_URL.into())).unwrap_or(FALLBACK_IMAGE_URL.into());
let username = object.preferred_username().unwrap_or_default().to_string(); let username = object.preferred_username().unwrap_or_default().to_string();
let domain = object.id().unwrap_or_default().replace("https://", "").split('/').next().unwrap_or_default().to_string(); let domain = object.id().unwrap_or_default().replace("https://", "").split('/').next().unwrap_or_default().to_string();
let display_name = object.name().unwrap_or_default().to_string(); let display_name = object.name().unwrap_or_default().to_string();
@ -37,7 +37,7 @@ pub fn ActorBanner(object: crate::Object) -> impl IntoView {
<div> <div>
<table class="align" > <table class="align" >
<tr> <tr>
<td rowspan="2" ><a href={uri.clone()} ><img class="avatar avatar-actor" src={avatar_url} /></a></td> <td rowspan="2" ><a href={uri.clone()} ><img class="avatar avatar-actor" src={avatar_url} onerror={format!("this.onerror=null; this.src='{FALLBACK_IMAGE_URL}';")} /></a></td>
<td><b class="displayname"><DisplayName name=display_name /></b></td> <td><b class="displayname"><DisplayName name=display_name /></b></td>
</tr> </tr>
<tr> <tr>

View file

@ -21,7 +21,7 @@ pub const URL_BASE: &str = "https://dev.upub.social";
pub const URL_PREFIX: &str = "/web"; pub const URL_PREFIX: &str = "/web";
pub const CONTACT: &str = "abuse@alemi.dev"; pub const CONTACT: &str = "abuse@alemi.dev";
pub const URL_SENSITIVE: &str = "https://cdn.alemi.dev/social/nsfw.png"; pub const URL_SENSITIVE: &str = "https://cdn.alemi.dev/social/nsfw.png";
pub const DEFAULT_AVATAR_URL: &str = "https://cdn.alemi.dev/social/gradient.png"; pub const FALLBACK_IMAGE_URL: &str = "https://cdn.alemi.dev/social/gradient.png";
pub const NAME: &str = "μ"; pub const NAME: &str = "μ";
pub const DEFAULT_COLOR: &str = "#BF616A"; pub const DEFAULT_COLOR: &str = "#BF616A";
pub const VERSION: &str = env!("CARGO_PKG_VERSION"); pub const VERSION: &str = env!("CARGO_PKG_VERSION");