use crate::utils::prop_structs::TitleProps;
use super::super::utils::user_prefs::ThemedComponent;
use dioxus::prelude::*;

pub fn Title(props: TitleProps) -> Element {
    let user_prefs = props.user_prefs.clone();
    let title_classes = user_prefs.get_theme_classes(ThemedComponent::Card);
    let title = props.title.clone();
    let is_html = props.is_html;
    rsx!{
        div { class: "p-4 ring-4 {title_classes}",
            span { class: "flex flex-row mx-auto max-w-full justify-center text-xl text-center",
                TitleHtml { title: title, is_html: is_html, user_prefs: user_prefs }
            }
        }
    }
}

fn TitleHtml(props: TitleProps) -> Element {
    let title = props.title.clone();
    if props.is_html {
        #[cfg(any(target_family = "unix", target_family = "windows"))]
        return rsx! {
            span { class: "flex flex-row align-middle mx-auto max-w-full justify-center",
                dangerous_inner_html: "{title}&nbsp;"
            }
        };
        #[cfg(target_family = "wasm")]
        return rsx! {
            span { class: "flex flex-row align-middle mx-auto max-w-full justify-center",
                div { dangerous_inner_html: "{title}", }
            }
        };
    } else {
        return rsx! {
            span {
                "{title}"
            }
        };
    }
}
