cards/client/src/components/debug.rs

55 lines
1.8 KiB
Rust

use crate::components::websocket::WebSocketContext;
use leptos::*;
use leptos_use::core::ConnectionReadyState;
use lib::*;
#[component]
pub fn Debug() -> impl IntoView {
let websocket = expect_context::<WebSocketContext>();
let state_summary = expect_context::<ReadSignal<Option<ServerStateSummary>>>();
// Signals
let (online_users, set_online_users) = create_signal(0);
let (active_games, set_active_games) = create_signal(0);
// Websocket stuff
let status = move || websocket.ready_state.get().to_string();
let connected = move || websocket.ready_state.get() == ConnectionReadyState::Open;
let open_connection = move |_| {
(websocket.open)();
};
let close_connection = move |_| {
(websocket.close)();
set_online_users(0);
set_active_games(0);
};
// Update server info -> move this to a new component
create_effect(move |_| {
state_summary.with(move |state_summary| {
if let Some(state_summary) = state_summary {
set_online_users(state_summary.online_users);
set_active_games(state_summary.active_games);
}
})
});
view! {
<div class="w-auto">
<hr/>
<h2 class="p-1 text-2xl">Debug:</h2>
<p class="p-1">"Connection Status: " {status}</p>
<p class="p-1">"Users Online: " {online_users}</p>
<p class="p-1">"Active Games: " {active_games}</p>
<div class="p-1">
<button on:click=open_connection disabled=move || connected()>
"Connect"
</button>
<button on:click=close_connection disabled=move || !connected()>
"Disconnect"
</button>
</div>
</div>
}
}