use leptos::*;
use crate::components::modal_box::{DialogOpener, ModalDialog, ModalBody, ModalFooter};
use crate::server_fn::*;
use crate::locales::trl;

/// Renders the home page of your application.
#[component]
pub fn HomePage() -> impl IntoView {
    // Creates a reactive value to update the button
    let (count, set_count) = create_signal(0);
    let on_click = move |_| set_count.update(|count| *count += 1);

    let dialog = DialogOpener::new();

    //let (dialog, set_dialog) = create_signal(false);
    //let on_dialog = move |_| dialog.set_visible.update(|dialog| {*dialog = true});

    //let pok = use_context::<Request>();
    //log!("{:?}", pok);


    view! {
        <ModalDialog opener={dialog} title="Titulek">
        <ModalBody>
        <div class="row">
              <div class="col mb-3">
                <label for="nameWithTitle" class="form-label">"Name"</label>
                <input
                  type="text"
                  id="nameWithTitle"
                  class="form-control"
                  placeholder="Enter Name"
                />
              </div>
            </div>
            <div class="row g-2">
              <div class="col mb-0">
                <label for="emailWithTitle" class="form-label">"Email"</label>
                <input
                  type="text"
                  id="emailWithTitle"
                  class="form-control"
                  placeholder="xxxx@xxx.xx"
                />
              </div>
              <div class="col mb-0">
                <label for="dobWithTitle" class="form-label">"DOB"</label>
                <input
                  type="text"
                  id="dobWithTitle"
                  class="form-control"
                  placeholder="DD / MM / YY"
                />
              </div>
            </div>
        </ModalBody>
        <ModalFooter>
            <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal" on:click=move |_| dialog.hide()>
                "Close"
            </button>
            <button type="button" class="btn btn-primary">"Save changes"</button>
        </ModalFooter>
        </ModalDialog>

        <h1>"Welcome to Leptos!"</h1>
        <button on:click=on_click>"Click Me: " {count}</button>
        <button on:click=move |_| dialog.show()>"Dialog"</button>
        <button on:click=move |_| {
            spawn_local(async move {
               set_session().await;
            });
        }>"Session"</button>
        <button on:click=move |_| {
            spawn_local(async move {
               get_session().await;
            });
        }>"Session get"</button>
        <p>{trl("testik!")}</p>
    }
}