* Create a minimalistic toast

* Profile editing (WIP)

frontend/src/handles.rs

@@ -1,10 +1,73 @@
+use gloo::{console::log, events::EventListener, net::http::Request};
 use wasm_bindgen::prelude::*;
-use web_sys::{Document, HtmlLabelElement};
+use wasm_bindgen_futures::spawn_local;
+use web_sys::{Document, HtmlInputElement};
 
-pub fn recipe_edit(doc: &Document) {
+use crate::toast::{self, Level};
+
+pub fn recipe_edit(doc: Document) -> Result<(), JsValue> {
     let title_input = doc.get_element_by_id("title_field").unwrap();
+    Ok(())
 }
 
-pub fn user_edit(doc: &Document) {
-    // let name_input = doc.get_element_by_id("name_field").unwrap().dyn_ref::<>()
+pub fn user_edit(doc: Document) -> Result<(), JsValue> {
+    log!("user_edit");
+
+    let button = doc
+        .query_selector("#user-edit input[type='button']")?
+        .unwrap();
+
+    let on_click_submit = EventListener::new(&button, "click", move |_event| {
+        log!("Click!");
+
+        let input_name = doc.get_element_by_id("input-name").unwrap();
+        let name = input_name.dyn_ref::<HtmlInputElement>().unwrap().value();
+
+        let update_data = common::ron_api::UpdateProfile {
+            name: Some(name),
+            email: None,
+            password: None,
+        };
+
+        let body = common::ron_api::to_string(update_data);
+
+        let doc = doc.clone();
+        spawn_local(async move {
+            match Request::put("/ron-api/user/update")
+                .header("Content-Type", "application/ron")
+                .body(body)
+                .unwrap()
+                .send()
+                .await
+            {
+                Ok(resp) => {
+                    log!("Status code: {}", resp.status());
+                    if resp.status() == 200 {
+                        toast::show(Level::Info, "Profile saved", doc);
+                    } else {
+                        toast::show(
+                            Level::Error,
+                            &format!(
+                                "Status code: {} {}",
+                                resp.status(),
+                                resp.text().await.unwrap()
+                            ),
+                            doc,
+                        );
+                    }
+                }
+                Err(error) => {
+                    toast::show(
+                        Level::Info,
+                        &format!("Internal server error: {}", error),
+                        doc,
+                    );
+                }
+            }
+        });
+    });
+
+    on_click_submit.forget();
+
+    Ok(())
 }

frontend/src/lib.rs

@@ -1,19 +1,21 @@
 mod handles;
+mod toast;
 mod utils;
 
+use gloo::{console::log, events::EventListener};
 use wasm_bindgen::prelude::*;
 use web_sys::console;
 
-#[wasm_bindgen]
-extern "C" {
-    fn alert(s: &str);
-}
+// #[wasm_bindgen]
+// extern "C" {
+//     fn alert(s: &str);
+// }
 
-#[wasm_bindgen]
-pub fn greet(name: &str) {
-    alert(&format!("Hello, {}!", name));
-    console::log_1(&"Hello bg".into());
-}
+// #[wasm_bindgen]
+// pub fn greet(name: &str) {
+//     alert(&format!("Hello, {}!", name));
+//     console::log_1(&"Hello bg".into());
+// }
 
 #[wasm_bindgen(start)]
 pub fn main() -> Result<(), JsValue> {
@@ -33,17 +35,16 @@ pub fn main() -> Result<(), JsValue> {
      *  - Call (as AJAR) /ron-api/set-title and set the body to a serialized RON of the type common::ron_api::SetTitle
      *  - Display error message if needed
      */
-
     match path[..] {
         ["recipe", "edit", id] => {
             let id = id.parse::<i64>().unwrap(); // TODO: remove unwrap.
-            console_log!("recipe edit ID: {}", id);
+            log!("recipe edit ID: {}", id);
 
-            handles::recipe_edit(&document);
+            handles::recipe_edit(document)?;
         }
 
         ["user", "edit"] => {
-            handles::user_edit(&document);
+            handles::user_edit(document)?;
         }
         _ => (),
     }

frontend/src/toast.rs

@@ -0,0 +1,20 @@
+use gloo::{console::log, timers::callback::Timeout};
+use web_sys::{console, Document, HtmlInputElement};
+
+pub enum Level {
+    Success,
+    Error,
+    Info,
+    Warning,
+}
+
+pub fn show(level: Level, message: &str, doc: Document) {
+    let toast_element = doc.get_element_by_id("toast").unwrap();
+    toast_element.set_inner_html(message);
+    toast_element.set_class_name("show");
+
+    Timeout::new(4_000, move || {
+        toast_element.set_class_name("");
+    })
+    .forget();
+}

frontend/src/utils.rs

@@ -1,4 +1,4 @@
-use web_sys::console;
+// use web_sys::console;
 
 pub fn set_panic_hook() {
     // When the `console_error_panic_hook` feature is enabled, we can call the
@@ -11,9 +11,9 @@ pub fn set_panic_hook() {
     console_error_panic_hook::set_once();
 }
 
-#[macro_export]
-macro_rules! console_log {
-    // Note that this is using the `log` function imported above during
-    // `bare_bones`
-    ($($t:tt)*) => (console::log_1(&format_args!($($t)*).to_string().into()))
-}
+// #[macro_export]
+// macro_rules! console_log {
+//     // Note that this is using the `log` function imported above during
+//     // `bare_bones`
+//     ($($t:tt)*) => (console::log_1(&format_args!($($t)*).to_string().into()))
+// }