use leptos::prelude::*;
use orbital_core_components::{Button, ButtonAppearance, ButtonType};
use orbital_macros::component_doc;
use std::sync::Arc;
use crate::preview::fixtures::thread_with_custom_citations;
use crate::{
CitationAffordanceView, CitationMenuExtrasView, CitationRenderContext,
DiscussionCitationAffordance, DiscussionCitationMenuExtras, DiscussionEvents,
DiscussionFeatures, DiscussionFocus, DiscussionMenuItem, DiscussionThread, DiscussionViewMode,
};
#[component_doc(
category = "Discussion",
preview_slug = "discussion-citations",
preview_label = "Discussion Citations",
preview_icon = icondata::AiCommentOutlined,
)]
#[component]
pub fn DiscussionCitationsDoc() -> impl IntoView {
let affordance_view: CitationAffordanceView = Arc::new(|ctx: CitationRenderContext| {
Some(
view! {
<Button
appearance=ButtonAppearance::Subtle
button_type=ButtonType::Button
attr:data-testid=format!("discussion-citation-affordance-btn-{}", ctx.citation.id)
>
"Agree"
</Button>
}
.into_any(),
)
});
let menu_extras: CitationMenuExtrasView = Arc::new(|_ctx: CitationRenderContext| {
vec![
DiscussionMenuItem {
id: "mark_agree".into(),
label: "Mark agree".into(),
disabled: None,
},
DiscussionMenuItem {
id: "mark_dispute".into(),
label: "Mark dispute".into(),
disabled: None,
},
]
});
let (replies, _set_replies) = signal(thread_with_custom_citations());
let (focus, set_focus) = signal(DiscussionFocus::Root);
let (view_mode, set_view_mode) = signal(DiscussionViewMode::Tree);
let (collapsed, set_collapsed) = signal(std::collections::HashSet::<String>::new());
let (log, set_log) = signal(String::new());
let events = DiscussionEvents {
on_citation_action: Some(Callback::new(
move |(citation, action): (crate::DiscussionCitation, String)| {
set_log.set(format!("{}:{}", citation.id, action));
},
)),
..Default::default()
};
let features = DiscussionFeatures::MARKDOWN | DiscussionFeatures::CITATIONS;
view! {
<div data-testid="discussion-citations-preview">
<pre data-testid="discussion-citations-action-log">{move || log.get()}</pre>
<DiscussionThread
replies=Signal::derive(move || replies.get())
focus=Signal::derive(move || focus.get())
set_focus=set_focus
view_mode=Signal::derive(move || view_mode.get())
set_view_mode=set_view_mode
collapsed=Signal::derive(move || collapsed.get())
set_collapsed=set_collapsed
events=events
features=features
>
<DiscussionCitationAffordance slot render=affordance_view />
<DiscussionCitationMenuExtras slot items=menu_extras />
</DiscussionThread>
</div>
}
}