cards/client/src/components/auth.rs
2024-08-04 18:14:10 -04:00

54 lines
1.7 KiB
Rust

use crate::components::websocket::WebSocketContext;
use html::Input;
use leptos::*;
use lib::*;
use serde_json::to_string;
#[component]
pub fn Auth() -> impl IntoView {
let websocket = expect_context::<WebSocketContext>();
let user_context = expect_context::<ReadSignal<Option<UserUpdate>>>();
let (username, set_username) = create_signal("".to_string());
create_effect(move |_| {
user_context.with(|new_user| {
if let Some(user) = new_user {
set_username(user.username.to_string());
}
})
});
let username_input_ref = create_node_ref::<Input>();
let send_login = move |_| {
websocket.send(
&to_string(&UserLogIn {
username: username_input_ref.get().unwrap().value(),
})
.unwrap(),
);
set_username.set(username_input_ref.get().unwrap().value());
username_input_ref.get().unwrap().set_value("");
logging::log!("sent");
};
view! {
<div class="p-1">
<h2 class="text-2xl">Sign in:</h2>
<p>Username:</p>
<form onsubmit="return false" on:submit=send_login>
<input
class="w-96 font-mono rounded-sm bg-slate-900 text-slate-200"
placeholder=move || username.get()
node_ref=username_input_ref
/>
handle empty
<br/>
<input
class="py-2 px-4 pl-4 font-bold text-white rounded border-b-4 bg-slate-600 border-slate-800 hover:bg-slate-700 hover:border-slate-500"
type="submit"
value="Send"
/>
</form>
</div>
}
}