use std::sync::Arc;

use leptos::{
    IntoView, component,
    prelude::{ElementChild, Set, signal},
    task::spawn_local,
    view,
};
use rocie_client::apis::{api_get_product_api::products, configuration::Configuration};

use crate::components::container::Container;

#[component]
pub fn ProductOverview(config: Arc<Configuration>) -> impl IntoView {
    let (read_status, write_status) = signal("Loading..".to_owned());

    {
        let local_config = Arc::clone(&config);

        spawn_local(async move {
            let products = products(&local_config).await;

            write_status.set(
                products
                    .as_ref()
                    .map(move |products| {
                        let products_num = products.len();
                        let plural_s = if products_num == 1 { "" } else { "s" };
                        let products_value = 2;
                        let products_currency = "EUR";
                        format!(
                            "You have {products_num} product{plural_s} \
                         in stock with a value \
                         of {products_value} {products_currency}.",
                        )
                    })
                    .unwrap(),
            );
        });
    }

    view! {
        <Container header="Inventory">
            <p>{read_status}</p>
        </Container>
    }
}