From 90f725d02d8da793a5ce92a7a6203e33f90dc14f Mon Sep 17 00:00:00 2001 From: antifallobst Date: Fri, 29 Sep 2023 00:22:11 +0200 Subject: [PATCH] feat: implemented form data fetching and the sign_up ui --- Cargo.lock | 291 +++++++++++++++++++++++++++++++++---- Cargo.toml | 5 +- src/topbar/guest/mod.rs | 4 +- src/topbar/guest/signin.rs | 54 ++++++- src/topbar/guest/signup.rs | 88 +++++++++++ 5 files changed, 411 insertions(+), 31 deletions(-) create mode 100644 src/topbar/guest/signup.rs diff --git a/Cargo.lock b/Cargo.lock index 259b8c7..0710ce1 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -96,6 +96,12 @@ dependencies = [ "wasm-bindgen", ] +[[package]] +name = "equivalent" +version = "1.0.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "5443807d6dff69373d433ab9ef5378ad8df50ca6298caf15de6e52e24aaf54d5" + [[package]] name = "fnv" version = "1.0.7" @@ -115,6 +121,9 @@ dependencies = [ name = "frontend" version = "0.1.0" dependencies = [ + "gloo 0.10.0", + "wasm-bindgen", + "web-sys", "yew", "yew-router", ] @@ -208,17 +217,36 @@ version = "0.8.1" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "28999cda5ef6916ffd33fb4a7b87e1de633c47c0dc6d97905fee1cdaa142b94d" dependencies = [ - "gloo-console", - "gloo-dialogs", - "gloo-events", - "gloo-file", - "gloo-history", - "gloo-net", - "gloo-render", - "gloo-storage", - "gloo-timers", - "gloo-utils", - "gloo-worker", + "gloo-console 0.2.3", + "gloo-dialogs 0.1.1", + "gloo-events 0.1.2", + "gloo-file 0.2.3", + "gloo-history 0.1.5", + "gloo-net 0.3.1", + "gloo-render 0.1.1", + "gloo-storage 0.2.2", + "gloo-timers 0.2.6", + "gloo-utils 0.1.7", + "gloo-worker 0.2.1", +] + +[[package]] +name = "gloo" +version = "0.10.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "cd35526c28cc55c1db77aed6296de58677dbab863b118483a27845631d870249" +dependencies = [ + "gloo-console 0.3.0", + "gloo-dialogs 0.2.0", + "gloo-events 0.2.0", + "gloo-file 0.3.0", + "gloo-history 0.2.0", + "gloo-net 0.4.0", + "gloo-render 0.2.0", + "gloo-storage 0.3.0", + "gloo-timers 0.3.0", + "gloo-utils 0.2.0", + "gloo-worker 0.4.0", ] [[package]] @@ -227,7 +255,20 @@ version = "0.2.3" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "82b7ce3c05debe147233596904981848862b068862e9ec3e34be446077190d3f" dependencies = [ - "gloo-utils", + "gloo-utils 0.1.7", + "js-sys", + "serde", + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "gloo-console" +version = "0.3.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "2a17868f56b4a24f677b17c8cb69958385102fa879418052d60b50bc1727e261" +dependencies = [ + "gloo-utils 0.2.0", "js-sys", "serde", "wasm-bindgen", @@ -244,6 +285,16 @@ dependencies = [ "web-sys", ] +[[package]] +name = "gloo-dialogs" +version = "0.2.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "bf4748e10122b01435750ff530095b1217cf6546173459448b83913ebe7815df" +dependencies = [ + "wasm-bindgen", + "web-sys", +] + [[package]] name = "gloo-events" version = "0.1.2" @@ -254,6 +305,16 @@ dependencies = [ "web-sys", ] +[[package]] +name = "gloo-events" +version = "0.2.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "27c26fb45f7c385ba980f5fa87ac677e363949e065a083722697ef1b2cc91e41" +dependencies = [ + "wasm-bindgen", + "web-sys", +] + [[package]] name = "gloo-file" version = "0.2.3" @@ -261,7 +322,19 @@ source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "a8d5564e570a38b43d78bdc063374a0c3098c4f0d64005b12f9bbe87e869b6d7" dependencies = [ "futures-channel", - "gloo-events", + "gloo-events 0.1.2", + "js-sys", + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "gloo-file" +version = "0.3.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "97563d71863fb2824b2e974e754a81d19c4a7ec47b09ced8a0e6656b6d54bd1f" +dependencies = [ + "gloo-events 0.2.0", "js-sys", "wasm-bindgen", "web-sys", @@ -273,8 +346,24 @@ version = "0.1.5" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "85725d90bf0ed47063b3930ef28e863658a7905989e9929a8708aab74a1d5e7f" dependencies = [ - "gloo-events", - "gloo-utils", + "gloo-events 0.1.2", + "gloo-utils 0.1.7", + "serde", + "serde-wasm-bindgen", + "serde_urlencoded", + "thiserror", + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "gloo-history" +version = "0.2.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "91be9f3dd048f35a59c8de3d716ef6d568360078c73ed35a7700776ed53153c8" +dependencies = [ + "gloo-events 0.2.0", + "gloo-utils 0.2.0", "serde", "serde-wasm-bindgen", "serde_urlencoded", @@ -292,7 +381,28 @@ dependencies = [ "futures-channel", "futures-core", "futures-sink", - "gloo-utils", + "gloo-utils 0.1.7", + "http", + "js-sys", + "pin-project", + "serde", + "serde_json", + "thiserror", + "wasm-bindgen", + "wasm-bindgen-futures", + "web-sys", +] + +[[package]] +name = "gloo-net" +version = "0.4.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "8ac9e8288ae2c632fa9f8657ac70bfe38a1530f345282d7ba66a1f70b72b7dc4" +dependencies = [ + "futures-channel", + "futures-core", + "futures-sink", + "gloo-utils 0.2.0", "http", "js-sys", "pin-project", @@ -314,13 +424,38 @@ dependencies = [ "web-sys", ] +[[package]] +name = "gloo-render" +version = "0.2.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "56008b6744713a8e8d98ac3dcb7d06543d5662358c9c805b4ce2167ad4649833" +dependencies = [ + "wasm-bindgen", + "web-sys", +] + [[package]] name = "gloo-storage" version = "0.2.2" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "5d6ab60bf5dbfd6f0ed1f7843da31b41010515c745735c970e821945ca91e480" dependencies = [ - "gloo-utils", + "gloo-utils 0.1.7", + "js-sys", + "serde", + "serde_json", + "thiserror", + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "gloo-storage" +version = "0.3.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "fbc8031e8c92758af912f9bc08fbbadd3c6f3cfcbf6b64cdf3d6a81f0139277a" +dependencies = [ + "gloo-utils 0.2.0", "js-sys", "serde", "serde_json", @@ -341,6 +476,16 @@ dependencies = [ "wasm-bindgen", ] +[[package]] +name = "gloo-timers" +version = "0.3.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "bbb143cf96099802033e0d4f4963b19fd2e0b728bcf076cd9cf7f6634f092994" +dependencies = [ + "js-sys", + "wasm-bindgen", +] + [[package]] name = "gloo-utils" version = "0.1.7" @@ -354,6 +499,19 @@ dependencies = [ "web-sys", ] +[[package]] +name = "gloo-utils" +version = "0.2.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "0b5555354113b18c547c1d3a98fbf7fb32a9ff4f6fa112ce823a21641a0ba3aa" +dependencies = [ + "js-sys", + "serde", + "serde_json", + "wasm-bindgen", + "web-sys", +] + [[package]] name = "gloo-worker" version = "0.2.1" @@ -362,8 +520,8 @@ checksum = "13471584da78061a28306d1359dd0178d8d6fc1c7c80e5e35d27260346e0516a" dependencies = [ "anymap2", "bincode", - "gloo-console", - "gloo-utils", + "gloo-console 0.2.3", + "gloo-utils 0.1.7", "js-sys", "serde", "wasm-bindgen", @@ -371,12 +529,49 @@ dependencies = [ "web-sys", ] +[[package]] +name = "gloo-worker" +version = "0.4.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "76495d3dd87de51da268fa3a593da118ab43eb7f8809e17eb38d3319b424e400" +dependencies = [ + "bincode", + "futures", + "gloo-utils 0.2.0", + "gloo-worker-macros", + "js-sys", + "pinned", + "serde", + "thiserror", + "wasm-bindgen", + "wasm-bindgen-futures", + "web-sys", +] + +[[package]] +name = "gloo-worker-macros" +version = "0.1.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "956caa58d4857bc9941749d55e4bd3000032d8212762586fa5705632967140e7" +dependencies = [ + "proc-macro-crate", + "proc-macro2", + "quote", + "syn 2.0.31", +] + [[package]] name = "hashbrown" version = "0.12.3" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "8a9ee70c43aaf417c914396645a0fa852624801b24ebb7ae78fe8272889ac888" +[[package]] +name = "hashbrown" +version = "0.14.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "2c6201b9ff9fd90a5a3bac2e56a830d0caa509576f0e503818ee82c181b3437a" + [[package]] name = "hermit-abi" version = "0.3.2" @@ -400,7 +595,7 @@ version = "0.3.6" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "7c6ecbd987bb94f1f3c76c6787879756cf4b6f73bfff48d79308e8c56b46f65f" dependencies = [ - "indexmap", + "indexmap 1.9.3", ] [[package]] @@ -410,7 +605,17 @@ source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "bd070e393353796e801d209ad339e89596eb4c8d430d18ede6a1cced8fafbd99" dependencies = [ "autocfg", - "hashbrown", + "hashbrown 0.12.3", +] + +[[package]] +name = "indexmap" +version = "2.0.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ad227c3af19d4914570ad36d30409928b75967c298feb9ea1969db3a610bb14e" +dependencies = [ + "equivalent", + "hashbrown 0.14.0", ] [[package]] @@ -539,6 +744,16 @@ dependencies = [ "syn 1.0.109", ] +[[package]] +name = "proc-macro-crate" +version = "1.3.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "7f4c021e1093a56626774e81216a4ce732a735e5bad4868a03f3ed65ca0c3919" +dependencies = [ + "once_cell", + "toml_edit", +] + [[package]] name = "proc-macro-error" version = "1.0.4" @@ -579,7 +794,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "03b55e106e5791fa5a13abd13c85d6127312e8e09098059ca2bc9b03ca4cf488" dependencies = [ "futures", - "gloo", + "gloo 0.8.1", "num_cpus", "once_cell", "pin-project", @@ -748,6 +963,23 @@ dependencies = [ "tokio", ] +[[package]] +name = "toml_datetime" +version = "0.6.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "7cda73e2f1397b1262d6dfdcef8aafae14d1de7748d66822d3bfeeb6d03e5e4b" + +[[package]] +name = "toml_edit" +version = "0.19.15" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "1b5bb770da30e5cbfde35a2d7b9b8a2c4b8ef89548a7a6aeab5c9a576e3e7421" +dependencies = [ + "indexmap 2.0.1", + "toml_datetime", + "winnow", +] + [[package]] name = "tracing" version = "0.1.37" @@ -868,6 +1100,15 @@ dependencies = [ "wasm-bindgen", ] +[[package]] +name = "winnow" +version = "0.5.15" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "7c2e3184b9c4e92ad5167ca73039d0c42476302ab603e2fec4487511f38ccefc" +dependencies = [ + "memchr", +] + [[package]] name = "yew" version = "0.20.0" @@ -876,9 +1117,9 @@ checksum = "5dbecfe44343b70cc2932c3eb445425969ae21754a8ab3a0966981c1cf7af1cc" dependencies = [ "console_error_panic_hook", "futures", - "gloo", + "gloo 0.8.1", "implicit-clone", - "indexmap", + "indexmap 1.9.3", "js-sys", "prokio", "rustversion", @@ -914,7 +1155,7 @@ version = "0.17.0" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "426ee0486d2572a6c5e39fbdbc48b58d59bb555f3326f54631025266cf04146e" dependencies = [ - "gloo", + "gloo 0.8.1", "js-sys", "route-recognizer", "serde", diff --git a/Cargo.toml b/Cargo.toml index 04cf285..3252e18 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -7,4 +7,7 @@ edition = "2021" [dependencies] yew = { version = "0.20.0", features = ["csr"] } -yew-router = "0.17.0" \ No newline at end of file +yew-router = "0.17.0" +web-sys = { version = "0.3.64", features = ["HtmlInputElement"] } +wasm-bindgen = "0.2.87" +gloo = "0.10.0" diff --git a/src/topbar/guest/mod.rs b/src/topbar/guest/mod.rs index af4e500..eaad046 100644 --- a/src/topbar/guest/mod.rs +++ b/src/topbar/guest/mod.rs @@ -1,7 +1,9 @@ mod signin; +mod signup; use crate::topbar::Tab; use signin::SignIn; +use signup::SignUp; use std::rc::Rc; use yew::prelude::*; @@ -77,7 +79,7 @@ pub fn TopBar() -> Html { } if state.sign_up { -

{"Sign Up"}

+ } } diff --git a/src/topbar/guest/signin.rs b/src/topbar/guest/signin.rs index aac3983..55c5ec0 100644 --- a/src/topbar/guest/signin.rs +++ b/src/topbar/guest/signin.rs @@ -1,21 +1,67 @@ +use std::ops::Deref; +use wasm_bindgen::JsCast; +use web_sys::HtmlInputElement; use yew::prelude::*; +#[derive(PartialEq, Clone, Default, Debug)] +struct Data { + pub username: String, + pub password: String, +} + #[function_component] pub fn SignIn() -> Html { + let state = use_state(|| Data::default()); + + let cloned_state = state.clone(); + let on_username_changed = Callback::from(move |event: Event| { + let username = event + .target() + .expect("WTF") + .unchecked_into::() + .value(); + + let mut data = cloned_state.deref().clone(); + data.username = username; + cloned_state.set(data); + }); + + let cloned_state = state.clone(); + let on_password_changed = Callback::from(move |event: Event| { + let password = event + .target() + .expect("WTF") + .unchecked_into::() + .value(); + + let mut data = cloned_state.deref().clone(); + data.password = password; + cloned_state.set(data); + }); + + let cloned_state = state.clone(); + let onsubmit = Callback::from(move |event: SubmitEvent| { + event.prevent_default(); + + let data = cloned_state.deref().clone(); + gloo::console::log!("username: ", data.username); + gloo::console::log!("password: ", data.password); + }); + html! { -
+

-
+

-
+
- +
} diff --git a/src/topbar/guest/signup.rs b/src/topbar/guest/signup.rs new file mode 100644 index 0000000..fc27b9d --- /dev/null +++ b/src/topbar/guest/signup.rs @@ -0,0 +1,88 @@ +use std::ops::Deref; +use wasm_bindgen::JsCast; +use web_sys::HtmlInputElement; +use yew::prelude::*; + +#[derive(PartialEq, Clone, Default, Debug)] +struct Data { + pub username: String, + pub email: String, + pub password: String, +} + +#[function_component] +pub fn SignUp() -> Html { + let state = use_state(|| Data::default()); + + let cloned_state = state.clone(); + let on_username_changed = Callback::from(move |event: Event| { + let username = event + .target() + .expect("WTF") + .unchecked_into::() + .value(); + + let mut data = cloned_state.deref().clone(); + data.username = username; + cloned_state.set(data); + }); + + let cloned_state = state.clone(); + let on_email_changed = Callback::from(move |event: Event| { + let email = event + .target() + .expect("WTF") + .unchecked_into::() + .value(); + + let mut data = cloned_state.deref().clone(); + data.email = email; + cloned_state.set(data); + }); + + let cloned_state = state.clone(); + let on_password_changed = Callback::from(move |event: Event| { + let password = event + .target() + .expect("WTF") + .unchecked_into::() + .value(); + + let mut data = cloned_state.deref().clone(); + data.password = password; + cloned_state.set(data); + }); + + let cloned_state = state.clone(); + let onsubmit = Callback::from(move |event: SubmitEvent| { + event.prevent_default(); + + let data = cloned_state.deref().clone(); + gloo::console::log!("username: ", data.username); + gloo::console::log!("email: ", data.email); + gloo::console::log!("password: ", data.password); + }); + + html! { +
+
+
+
+
+ +
+
+
+
+ +
+
+
+
+ +
+ +
+
+ } +}