send login request

client/src/components/auth.rs

@@ -1,9 +1,25 @@
+use crate::components::websocket::WebSocketContext;
+use html::Input;
 use leptos::*;
+use lib::models::*;
+use serde_json::to_string;
 
 #[component]
 pub fn Auth() -> impl IntoView {
+    let websocket = expect_context::<WebSocketContext>();
     let (username, _set_username) = create_signal("Anonymous");
 
+    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(),
+        );
+        logging::log!("sent");
+    };
+
     view! {
         <div class="p-1">
             <h2 class="text-2xl">Sign in:</h2>
@@ -11,6 +27,14 @@ pub fn Auth() -> impl IntoView {
             <input
                 class="w-96 font-mono rounded-sm bg-slate-900 text-slate-200"
                 placeholder=move || username.get()
+                node_ref=username_input_ref
+                on:change=send_login.clone()
+            />
+            <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"
+                on:change=send_login.clone()
             />
         </div>
     }