Merge branch 'master' into jk/update-hooks

examples/borrowed.rs

@@ -1,3 +1,5 @@
+#![allow(non_snake_case)]
+
 /*
 Dioxus manages borrow lifetimes for you. This means any child may borrow from its parent. However, it is not possible
 to hand out an &mut T to children - all props are consumed by &P, so you'd only get an &&mut T.

examples/calculator.rs

@@ -98,7 +98,7 @@ fn app(cx: Scope) -> Element {
                                 button { class: "calculator-key key-0", onclick: move |_| input_digit(0),
                                     "0"
                                 }
-                                button { class: "calculator-key key-dot", onclick: move |_| display_value.modify().push_str("."),
+                                button { class: "calculator-key key-dot", onclick: move |_| display_value.modify().push('.'),
                                     "●"
                                 }
                                 (1..10).map(|k| rsx!{
@@ -175,7 +175,7 @@ fn calc_val(val: String) -> f64 {
 
     for c in val[start_index..].chars() {
         if c == '+' || c == '-' || c == '*' || c == '/' {
-            if temp != "" {
+            if !temp.is_empty() {
                 match &operation as &str {
                     "+" => result += temp.parse::<f64>().unwrap(),
                     "-" => result -= temp.parse::<f64>().unwrap(),
@@ -191,7 +191,7 @@ fn calc_val(val: String) -> f64 {
         }
     }
 
-    if temp != "" {
+    if !temp.is_empty() {
         match &operation as &str {
             "+" => result += temp.parse::<f64>().unwrap(),
             "-" => result -= temp.parse::<f64>().unwrap(),

examples/crm.rs

@@ -1,7 +1,7 @@
 /*
 Tiny CRM: A port of the Yew CRM example to Dioxus.
 */
-use dioxus::{events::FormEvent, prelude::*};
+use dioxus::prelude::*;
 
 fn main() {
     dioxus::desktop::launch(app);

examples/dog_app.rs

@@ -1,5 +1,6 @@
+#![allow(non_snake_case)]
+
 //! Render a bunch of doggos!
-//!
 
 use std::collections::HashMap;
 
@@ -50,7 +51,7 @@ fn app(cx: Scope) -> Element {
                 }
             }
         }),
-        Some(Err(e)) => cx.render(rsx! {
+        Some(Err(_e)) => cx.render(rsx! {
             div { "Error fetching breeds" }
         }),
         None => cx.render(rsx! {
@@ -61,7 +62,7 @@ fn app(cx: Scope) -> Element {
 
 #[inline_props]
 fn Breed(cx: Scope, breed: String) -> Element {
-    #[derive(serde::Deserialize)]
+    #[derive(serde::Deserialize, Debug)]
     struct DogApi {
         message: String,
     }
@@ -72,6 +73,12 @@ fn Breed(cx: Scope, breed: String) -> Element {
         reqwest::get(endpoint).await.unwrap().json::<DogApi>().await
     });
 
+    let breed_name = use_state(&cx, || breed.clone());
+    if breed_name.get() != breed {
+        breed_name.set(breed.clone());
+        fut.restart();
+    }
+
     cx.render(match fut.value() {
         Some(Ok(resp)) => rsx! {
             button {

examples/file_explorer.rs

@@ -15,7 +15,7 @@ fn main() {
 }
 
 fn app(cx: Scope) -> Element {
-    let files = use_ref(&cx, || Files::new());
+    let files = use_ref(&cx, Files::new);
 
     rsx!(cx, div {
         link { href:"https://fonts.googleapis.com/icon?family=Material+Icons", rel:"stylesheet", }
@@ -28,8 +28,8 @@ fn app(cx: Scope) -> Element {
         }
         main {
             files.read().path_names.iter().enumerate().map(|(dir_id, path)| {
-                let path_end = path.split('/').last().unwrap_or(path.as_str());
-                let icon_type = if path_end.contains(".") {
+                let path_end = path.split('/').last().unwrap_or_else(|| path.as_str());
+                let icon_type = if path_end.contains('.') {
                     "description"
                 } else {
                     "folder"

examples/filedragdrop.rs

@@ -2,7 +2,7 @@ use dioxus::prelude::*;
 
 fn main() {
     dioxus::desktop::launch_with_props(app, (), |c| {
-        c.with_file_drop_handler(|w, e| {
+        c.with_file_drop_handler(|_w, e| {
             println!("{:?}", e);
             false
         })

examples/framework_benchmark.rs

@@ -1,3 +1,5 @@
+#![allow(non_snake_case)]
+
 use dioxus::prelude::*;
 use rand::prelude::*;
 
@@ -30,7 +32,7 @@ impl Label {
 }
 
 fn app(cx: Scope) -> Element {
-    let items = use_ref(&cx, || vec![]);
+    let items = use_ref(&cx, Vec::new);
     let selected = use_state(&cx, || None);
 
     cx.render(rsx! {

examples/inputs.rs

@@ -2,8 +2,6 @@
 //!
 //! There is some conversion happening when input types are checkbox/radio/select/textarea etc.
 
-use std::sync::Arc;
-
 use dioxus::{events::FormEvent, prelude::*};
 
 fn main() {

examples/link.rs

@@ -0,0 +1,28 @@
+use dioxus::prelude::*;
+
+fn main() {
+    dioxus::desktop::launch(app);
+}
+
+fn app(cx: Scope) -> Element {
+    cx.render(rsx! (
+        div {
+            p {
+                a {
+                    href: "http://dioxuslabs.com/",
+                    "default link"
+                }
+            }
+            p {
+                a {
+                    href: "http://dioxuslabs.com/",
+                    prevent_default: "onclick",
+                    onclick: |_| {
+                        println!("Hello Dioxus");
+                    },
+                    "custom event link",
+                }
+            }
+        }
+    ))
+}

examples/nested_listeners.rs

@@ -0,0 +1,33 @@
+//! Nested Listeners
+//!
+//! This example showcases how to control event bubbling from child to parents.
+//!
+//! Both web and desktop support bubbling and bubble cancelation.
+
+use dioxus::prelude::*;
+
+fn main() {
+    dioxus::desktop::launch(app);
+}
+
+fn app(cx: Scope) -> Element {
+    cx.render(rsx! {
+        div {
+            onclick: move |_| println!("clicked! top"),
+            button {
+                onclick: move |_| println!("clicked! bottom propoate"),
+                "Propogate"
+            }
+            button {
+                onclick: move |evt| {
+                    println!("clicked! bottom no bubbling");
+                    evt.cancel_bubble();
+                },
+                "Dont propogate"
+            }
+            button {
+                "Does not handle clicks"
+            }
+        }
+    })
+}

examples/optional_props.rs

@@ -1,3 +1,5 @@
+#![allow(non_snake_case)]
+
 //! Example: README.md showcase
 //!
 //! The example from the README.md.
@@ -14,6 +16,7 @@ fn app(cx: Scope) -> Element {
             a: "asd".to_string(),
             c: Some("asd".to_string()),
             d: "asd".to_string(),
+            e: "asd".to_string(),
         }
     })
 }
@@ -30,8 +33,19 @@ struct ButtonProps {
 
     #[props(default, strip_option)]
     d: Option<String>,
+
+    #[props(optional)]
+    e: Option<String>,
 }
 
 fn Button(cx: Scope<ButtonProps>) -> Element {
-    todo!()
+    cx.render(rsx! {
+        button {
+            "{cx.props.a}"
+            "{cx.props.b:?}"
+            "{cx.props.c:?}"
+            "{cx.props.d:?}"
+            "{cx.props.e:?}"
+        }
+    })
 }

examples/pattern_model.rs

@@ -1,3 +1,5 @@
+#![allow(non_snake_case)]
+
 //! Example: Calculator
 //! -------------------
 //!
@@ -30,7 +32,7 @@ fn main() {
 }
 
 fn app(cx: Scope) -> Element {
-    let state = use_ref(&cx, || Calculator::new());
+    let state = use_ref(&cx, Calculator::new);
 
     cx.render(rsx! {
         style { [include_str!("./assets/calculator.css")] }
@@ -171,8 +173,8 @@ impl Calculator {
         }
     }
     fn input_dot(&mut self) {
-        if self.display_value.find(".").is_none() {
-            self.display_value.push_str(".");
+        if !self.display_value.contains('.') {
+            self.display_value.push('.');
         }
     }
     fn perform_operation(&mut self) {
@@ -190,8 +192,8 @@ impl Calculator {
         }
     }
     fn toggle_sign(&mut self) {
-        if self.display_value.starts_with("-") {
-            self.display_value = self.display_value.trim_start_matches("-").to_string();
+        if self.display_value.starts_with('-') {
+            self.display_value = self.display_value.trim_start_matches('-').to_string();
         } else {
             self.display_value = format!("-{}", self.display_value);
         }

examples/router.rs

@@ -2,6 +2,7 @@
 
 use dioxus::prelude::*;
 use dioxus::router::{Link, Route, Router};
+use serde::Deserialize;
 
 fn main() {
     dioxus::desktop::launch(app);
@@ -18,7 +19,7 @@ fn app(cx: Scope) -> Element {
             Route { to: "/", "Home" }
             Route { to: "users",
                 Route { to: "/", "User list" }
-                Route { to: ":name", BlogPost {} }
+                Route { to: ":name", User {} }
              }
             Route { to: "blog"
                 Route { to: "/", "Blog list" }
@@ -30,7 +31,7 @@ fn app(cx: Scope) -> Element {
 }
 
 fn BlogPost(cx: Scope) -> Element {
-    let post = dioxus::router::use_route(&cx).last_segment()?;
+    let post = dioxus::router::use_route(&cx).last_segment();
 
     cx.render(rsx! {
         div {
@@ -40,14 +41,27 @@ fn BlogPost(cx: Scope) -> Element {
     })
 }
 
+#[derive(Deserialize)]
+struct Query {
+    bold: bool,
+}
+
 fn User(cx: Scope) -> Element {
-    let post = dioxus::router::use_route(&cx).last_segment()?;
-    let bold = dioxus::router::use_route(&cx).param::<bool>("bold");
+    let post = dioxus::router::use_route(&cx).last_segment();
+    let query = dioxus::router::use_route(&cx)
+        .query::<Query>()
+        .unwrap_or(Query { bold: false });
 
     cx.render(rsx! {
         div {
             h1 { "Reading blog post: {post}" }
             p { "example blog post" }
+
+            if query.bold {
+                rsx!{ b { "bold" } }
+            } else {
+                rsx!{ i { "italic" } }
+            }
         }
     })
 }

examples/suspense.rs

@@ -1,3 +1,5 @@
+#![allow(non_snake_case)]
+
 //! Suspense in Dioxus
 //!
 //! Currently, `rsx!` does not accept futures as values. To achieve the functionality

examples/tailwind.rs

@@ -1,3 +1,5 @@
+#![allow(non_snake_case)]
+
 //! Example: Basic Tailwind usage
 //!
 //! This example shows how an app might be styled with TailwindCSS.

examples/tasks.rs

@@ -13,13 +13,12 @@ fn app(cx: Scope) -> Element {
     let count = use_state(&cx, || 0);
 
     use_future(&cx, move || {
-        let count = UseState::for_async(&count);
-        // for_async![count];
+        let mut count = count.for_async();
         async move {
-            // loop {
-            //     tokio::time::sleep(Duration::from_millis(1000)).await;
-            //     count += 1;
-            // }
+            loop {
+                tokio::time::sleep(Duration::from_millis(1000)).await;
+                count += 1;
+            }
         }
     });