use leptos::*;
use crate::backend::data::ApiResponse;
use crate::backend::reservation::get_next_reservations;
use crate::components::modal_box::DialogOpener;
use crate::locales::{loc_date, show_day, trl};
use chrono::Datelike;

#[component]
pub fn next_reservations(app_opener: DialogOpener, cancel_opener: DialogOpener) -> impl IntoView {
    let res = create_blocking_resource(  move || app_opener.visible() || cancel_opener.visible(), move |_| get_next_reservations());

    view! {
    <div class="card mb-3">
        <div class="card-body">
            <h5 class="card-title"><i class="bx bx-basket"></i>" "{trl("Next approved bookings")}</h5>
            <Transition fallback=move || view! {<p>{trl("Loading...")}</p> }>
        {move || {
            res.get().map(|r| match r {
                Err(e) => {
                    view! {<div>{trl("Something went wrong")}<br/>{e.to_string()}</div>}}
                Ok(r) => { match r {
                    ApiResponse::Data(r) => {
                        view! {
                            <div>
                            <For each=move || r.clone()
                                key=|res| res.summary.id()
                                let:data>
                            {move || {
                                let data = data.clone();
                                view! {
                                    <b>{show_day(&data.summary.date.weekday())}" - "{loc_date(data.summary.date)}</b><br/>
                                    <For each=move || data.reservations.clone()
                                        key=|item| item.reservation.id()
                                        let:item>
                                        {item.property.name}": "{item.reservation.from.to_string()}" - "{item.reservation.to.to_string()}<br/>
                                    </For>
                                    {trl("Customer: ")}{data.customer.full_name}", "<a href={format!("mailto:{}", data.customer.email)}>{data.customer.email}</a>", "{data.customer.phone}<br/>
                                    {move || {
                                        let note = data.summary.note.clone();
                                        let show = note.is_some() && !note.clone().unwrap().is_empty();
                                        view! {
                                            <Show when=move || show>
                                                {trl("Note: ")}{note.clone()}<br/>
                                            </Show>
                                        }
                                    }}
                                    {trl("Price: ")}{data.summary.price.to_string()}<br/>
                                    <hr/>
                                }
                            }}
                            </For>
                            </div>
                        }
                    }
                    ApiResponse::Error(e) => {view! {<div>{trl(&e)}</div>}}}
                }
            })
        }}
            </Transition>
        </div>
        </div>
    }
}