use leptos::{
    IntoView,
    html::{ElementChild, button, label},
    logging::log,
    prelude::{OnAttribute, Read, Show, ShowProps, ToChildren},
    server::LocalResource,
};

use crate::{media::audio, webrtc::WebRTC};

pub fn app() -> impl IntoView {
    let audio_stream = LocalResource::new(|| audio());

    let props = ShowProps::builder()
        .when(move || audio_stream.read().is_some())
        .children(ToChildren::to_children(move || {
            let audio_stream = audio_stream.read();
            let audio_stream = audio_stream.as_deref().unwrap().clone();

            let webrtc = WebRTC::new(Some(audio_stream), None, None).unwrap();

            let webrtc_offer = webrtc.clone();
            let offer_button = button()
                .on(leptos::ev::click, move |_| {
                    log!("{:#?}", webrtc_offer.get_status());
                })
                .child("Offer");

            let webrtc_answer = webrtc.clone();
            let answer_button = button()
                .on(leptos::ev::click, move |_| {
                    log!("{:#?}", webrtc_answer.get_status());
                })
                .child("Answer");

            (offer_button, answer_button)
        }))
        .fallback(|| label().child("NOOOOOOOOOOOO"))
        .build();

    Show(props)
}