2024-04-21 17:43:36 +02:00
|
|
|
use leptos::*;
|
2024-04-24 05:38:09 +02:00
|
|
|
use crate::{prelude::*, URL_SENSITIVE};
|
2024-04-21 17:43:36 +02:00
|
|
|
|
2024-04-29 21:02:13 +02:00
|
|
|
use apb::{target::Addressed, Base, Collection, Object};
|
2024-04-21 17:43:36 +02:00
|
|
|
|
|
|
|
#[component]
|
2024-04-29 02:33:21 +02:00
|
|
|
pub fn Attachment(
|
|
|
|
object: serde_json::Value,
|
|
|
|
#[prop(optional)]
|
|
|
|
sensitive: bool
|
|
|
|
) -> impl IntoView {
|
|
|
|
let (expand, set_expand) = create_signal(false);
|
|
|
|
let href = object.url().id().unwrap_or_default();
|
|
|
|
let media_type = object.media_type()
|
|
|
|
.unwrap_or("image/png") // TODO weird defaulting to png?????
|
|
|
|
.to_string();
|
|
|
|
let kind = media_type
|
|
|
|
.split('/')
|
|
|
|
.next()
|
|
|
|
.unwrap_or("image")
|
|
|
|
.to_string();
|
|
|
|
|
|
|
|
match kind.as_str() {
|
|
|
|
"image" =>
|
2024-04-24 04:58:46 +02:00
|
|
|
view! {
|
|
|
|
<p class="center">
|
|
|
|
<img
|
|
|
|
class="attachment ml-1"
|
|
|
|
class:expand=expand
|
2024-04-24 05:38:09 +02:00
|
|
|
src={move || if sensitive && !expand.get() {
|
|
|
|
URL_SENSITIVE.to_string()
|
|
|
|
} else {
|
|
|
|
href.clone()
|
|
|
|
}}
|
2024-04-29 02:33:21 +02:00
|
|
|
title={object.name().unwrap_or_default().to_string()}
|
2024-04-24 04:58:46 +02:00
|
|
|
on:click=move |_| set_expand.set(!expand.get())
|
|
|
|
/>
|
|
|
|
</p>
|
2024-04-29 02:33:21 +02:00
|
|
|
}.into_view(),
|
|
|
|
|
|
|
|
"video" =>
|
|
|
|
view! {
|
2024-04-29 02:42:59 +02:00
|
|
|
<div class="center cursor box ml-1"
|
2024-04-29 02:33:21 +02:00
|
|
|
on:click=move |_| set_expand.set(!expand.get())
|
|
|
|
title={object.name().unwrap_or_default().to_string()}
|
|
|
|
>
|
|
|
|
<video controls loop class="attachment" class:expand=expand >
|
|
|
|
<source src={href.clone()} type={media_type} />
|
|
|
|
<a href={href} target="_blank">audio clip</a>
|
|
|
|
</video>
|
2024-04-29 02:42:59 +02:00
|
|
|
</div>
|
2024-04-29 02:33:21 +02:00
|
|
|
}.into_view(),
|
|
|
|
|
|
|
|
"audio" =>
|
|
|
|
view! {
|
|
|
|
<p class="center">
|
|
|
|
<audio controls class="w-100">
|
|
|
|
<source src={href.clone()} type={media_type} />
|
|
|
|
<a href={href} target="_blank">audio clip</a>
|
|
|
|
</audio>
|
|
|
|
</p>
|
|
|
|
}.into_view(),
|
|
|
|
|
|
|
|
_ =>
|
|
|
|
view! {
|
|
|
|
<p class="center box">
|
|
|
|
<code class="cw color center">
|
|
|
|
<a href={href} target="_blank">{media_type}</a>
|
|
|
|
</code>
|
|
|
|
<p class="tiny-text">
|
|
|
|
<small>{object.name().unwrap_or_default().to_string()}</small>
|
|
|
|
</p>
|
|
|
|
</p>
|
|
|
|
}.into_view(),
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#[component]
|
|
|
|
pub fn Object(object: serde_json::Value) -> impl IntoView {
|
|
|
|
let uid = object.id().unwrap_or_default().to_string();
|
|
|
|
let content = dissolve::strip_html_tags(object.content().unwrap_or_default());
|
|
|
|
let author_id = object.attributed_to().id().unwrap_or_default();
|
|
|
|
let author = CACHE.get_or(&author_id, serde_json::Value::String(author_id.clone()));
|
|
|
|
let sensitive = object.sensitive().unwrap_or_default();
|
|
|
|
let attachments = object.attachment()
|
|
|
|
.map(|x| view! { <Attachment object=x sensitive=sensitive /> })
|
2024-04-22 01:01:20 +02:00
|
|
|
.collect_view();
|
2024-04-29 21:02:13 +02:00
|
|
|
let comments = object.replies().get()
|
|
|
|
.map(|x| x.total_items().unwrap_or(0))
|
|
|
|
.filter(|x| *x > 0)
|
|
|
|
.map(|x| view! { <small>{x}</small> });
|
|
|
|
let likes = object.audience().get()
|
|
|
|
.map(|x| x.total_items().unwrap_or(0))
|
|
|
|
.filter(|x| *x > 0)
|
|
|
|
.map(|x| view! { <small>{x}</small> });
|
|
|
|
let shares = object.generator().get()
|
|
|
|
.map(|x| x.total_items().unwrap_or(0))
|
|
|
|
.filter(|x| *x > 0)
|
|
|
|
.map(|x| view! { <small>{x}</small> });
|
2024-04-23 23:28:19 +02:00
|
|
|
let attachments_padding = if object.attachment().is_empty() {
|
|
|
|
None
|
|
|
|
} else {
|
|
|
|
Some(view! { <div class="pb-1"></div> })
|
|
|
|
};
|
2024-04-21 17:43:36 +02:00
|
|
|
view! {
|
|
|
|
<table class="align w-100">
|
|
|
|
<tr>
|
|
|
|
<td><ActorBanner object=author /></td>
|
|
|
|
<td class="rev" >
|
2024-04-22 01:01:20 +02:00
|
|
|
{object.in_reply_to().id().map(|reply| view! {
|
2024-04-23 03:31:42 +02:00
|
|
|
<small><i><a class="clean" href={Uri::web(FetchKind::Object, &reply)} title={reply}>reply</a></i></small>
|
2024-04-22 01:01:20 +02:00
|
|
|
})}
|
2024-04-23 03:31:42 +02:00
|
|
|
<PrivacyMarker addressed=object.addressed() />
|
|
|
|
<a class="clean hover ml-s" href={Uri::web(FetchKind::Object, object.id().unwrap_or_default())}>
|
2024-04-21 17:43:36 +02:00
|
|
|
<DateTime t=object.published() />
|
|
|
|
</a>
|
2024-04-23 03:31:42 +02:00
|
|
|
<sup><small><a class="clean ml-s" href={uid} target="_blank">"↗"</a></small></sup>
|
2024-04-21 17:43:36 +02:00
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
<blockquote class="tl">
|
2024-04-24 05:38:09 +02:00
|
|
|
<Summary summary=object.summary().map(|x| x.to_string()) open=!sensitive >
|
2024-04-23 23:28:19 +02:00
|
|
|
{content.into_iter().map(|x| view! { <p>{x}</p> }).collect_view()}
|
|
|
|
{attachments_padding}
|
|
|
|
{attachments}
|
|
|
|
</Summary>
|
2024-04-21 17:43:36 +02:00
|
|
|
</blockquote>
|
2024-04-29 21:02:13 +02:00
|
|
|
<div class="mt-s ml-1 rev">
|
|
|
|
<span class="emoji ml-2">{comments}" 📨"</span>
|
|
|
|
<span class="emoji ml-2">{likes}" ⭐"</span>
|
|
|
|
<span class="emoji ml-2">{shares}" 🚀"</span>
|
|
|
|
</div>
|
2024-04-23 23:28:19 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
#[component]
|
2024-04-24 05:38:09 +02:00
|
|
|
pub fn Summary(summary: Option<String>, open: bool, children: Children) -> impl IntoView {
|
2024-04-23 23:28:19 +02:00
|
|
|
match summary.filter(|x| !x.is_empty()) {
|
|
|
|
None => children().into_view(),
|
|
|
|
Some(summary) => view! {
|
2024-04-24 05:38:09 +02:00
|
|
|
<details class="pa-s" prop:open=open>
|
2024-04-23 23:28:19 +02:00
|
|
|
<summary>
|
2024-04-29 22:01:49 +02:00
|
|
|
<code class="cw center color ml-s w-100">{summary}</code>
|
2024-04-23 23:28:19 +02:00
|
|
|
</summary>
|
|
|
|
{children()}
|
|
|
|
</details>
|
|
|
|
}.into_view(),
|
2024-04-21 17:43:36 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|