use crate::utils::prop_structs::PoemDatabase;

use super::super::utils::{
    prop_structs::{ButtonProps, ContentChildren, VoidProps},
    user_prefs::{ThemedComponent, UserPrefs},
};
use dioxus::prelude::*;
use dioxus_router::prelude::*;

pub fn BackToHomePage(props: UserPrefs) -> Element {
    let (user_theme, user_font) = props.clone().get_pref_classes(ThemedComponent::Button);
    #[cfg(any(target_family = "windows", target_family = "unix"))]
    return rsx! {
        a { class: "flex justify-center p-4 text-xl text-center ring-2 hover:animate-yip transition {user_theme} {user_font}",
            href: "/",
            p {
                "Back to the homepage"
            }
        }
    };
    let mut poem_database = PoemDatabase::new();
    poem_database.build_poem_database();
    #[cfg(target_family = "wasm")]
    return render! {
        Link { class: "flex justify-center p-4 text-xl text-center ring-2 hover:animate-yip transition {user_theme} {user_font}",
            to: crate::void_app::Route::HomePage { props:VoidProps{slug: Some("/".to_string()), poem_database: poem_database.clone(), user_prefs: props.clone(),}},
            p {
                "Back to the homepage"
            }
        }
    };
}

pub fn NavigationButton(props: ButtonProps) -> Element {
    let (user_theme, mut user_font) = props
        .user_prefs
        .clone()
        .get_pref_classes(ThemedComponent::Button);
    let title = props.title.clone();
    let title_ref = title.as_str();
    let slug = props.slug.clone();
    let slug_ref = slug.as_str();

    match props.override_font {
        Some(font) => user_font = font.clone(),
        None => (),
    }

    #[cfg(any(target_family = "windows", target_family = "unix"))]
    return rsx! {
        a { class: "flex basis-full justify-center p-4 ml-2 mr-2 text-xl text-center ring-2 hover:animate-yip transition {user_theme} {user_font}",
            href: "{slug_ref}",
            dangerous_inner_html: "{title_ref}",
        }
    };
    #[cfg(target_family = "wasm")]
    return rsx! {
        Link { class: "flex basis-full justify-center p-4 ml-2 mr-2 text-xl text-center ring-2 hover:animate-yip transition {user_theme} {user_font}",
            to: "{slug_ref}",
            div {
                dangerous_inner_html: "{title_ref}",
            }
        }
    };
}

pub fn ButtonGroup(props: ContentChildren) -> Element {
    rsx! {
        div { class: "flex md:flex-row md:space-y-0 flex-col space-y-4",
            {props.children}
        }
    }
}
