use crate::utils::prop_structs::{ButtonProps, ContentChildren};
use dioxus::prelude::*;

#[cfg(target_family = "wasm")]
use dioxus_router::Link;

pub fn BackToHomePage(cx: Scope) -> Element {
    #[cfg(any(target_family = "windows", target_family = "unix"))]
    return cx.render(rsx!{
        a { class: "flex justify-center p-4 text-xl text-center ring-2",
            href: "/",
            p {
                "Back to the homepage"
            }
        }
    });
    #[cfg(target_family = "wasm")]
    return cx.render(rsx!{
        Link { class: "flex justify-center p-4 text-xl text-center ring-2",
            to: "/",
            p {
                "Back to the homepage"
            }
        }
    });
}

pub fn NavigationButton(cx: Scope<ButtonProps>) -> Element {
    let title = cx.props.title.clone();
    let title_ref = title.as_str();
    let slug = cx.props.slug.clone();
    let slug_ref = slug.as_str();
    #[cfg(any(target_family = "windows", target_family = "unix"))]
    return cx.render(rsx!{
        a { class: "flex mx-auto max-w-full justify-center p-4 ml-2 mr-2 text-xl text-center ring-2",
            href: "{slug_ref}",
            "{title_ref}"
        }
    });
    #[cfg(target_family = "wasm")]
    return cx.render(rsx!{
        Link { class: "flex mx-auto max-w-full justify-center p-4 ml-2 mr-2 text-xl text-center ring-2",
            to: "{slug_ref}",
            div {
                dangerous_inner_html: "{title_ref}",
            }
        }
    });
}

pub fn ButtonGroup<'a>(cx: Scope<'a, ContentChildren<'a>>) -> Element {
    cx.render(rsx! {
        div { class: "grid md:grid-flow-col grid-flow-row gap-y-4",
            &cx.props.children
        }
    })
}