use leptos::{IntoView, component, view};
use rocie_client::models::{Unit, UnitProperty};

use crate::{
    api::{unit_properties_wrapped, units_wrapped},
    components::{async_fetch::AsyncFetch, container::Container, icon_p::IconP},
};

#[component]
pub fn UnitOverview() -> impl IntoView {
    view! {
        <Container
            header="Units"
            buttons=vec![
                (view! { <IconP icon=icondata_io::IoClipboard text="Show" /> }, "units"),
                (
                    view! { <IconP icon=icondata_io::IoClipboard text="Create unit" /> },
                    "create-unit",
                ),
                (
                    view! { <IconP icon=icondata_io::IoPricetags text="Create unit property" /> },
                    "create-unit-property",
                ),
            ]
        >
            {
                AsyncFetch! {
                    @map_error_in_producer
                    fetcher = get_units_and_unit_properties(),
                    producer = |(units, unit_properties)| {
                        view! {
                            <p>{move || format!(
                                "You have {} units and {} unit properties.",
                                units.len(),
                                unit_properties.len()
                            )}</p>
                        }
                    },
                }
            }
        </Container>
    }
}

async fn get_units_and_unit_properties()
-> Result<(Vec<Unit>, Vec<UnitProperty>), leptos::error::Error> {
    Ok((units_wrapped().await?, unit_properties_wrapped().await?))
}