fix: Update examples (#29)

marc2332 · web-flow · commit 8e83eafd3acd · 2024-04-03T17:58:22.000-04:00
* fix: Update launch function in clipboard example

* fix: Update launch function in geolocation example

* fixes everywhere

* fix
diff --git a/Cargo.toml b/Cargo.toml
@@ -1,12 +1,10 @@
-[workspace]
-resolver = "2"
-members = [
-    "std",
-    "examples/*",
-]
-
-[workspace.dependencies]
-dioxus-std = { path = "./std" }
-dioxus = { version = "0.5" }
-dioxus-web = { version = "0.5" }
-dioxus-desktop = { version = "0.5" }
+[workspace]
+resolver = "2"
+members = [
+    "std",
+    "examples/*",
+]
+
+[workspace.dependencies]
+dioxus-std = { path = "./std" }
+dioxus = { version = "0.5" }
diff --git a/examples/channel/Cargo.toml b/examples/channel/Cargo.toml
@@ -5,8 +5,7 @@ edition = "2021"
 
 [dependencies]
 dioxus-std = { workspace = true, features = ["utils"]}
-dioxus = { workspace = true }
-dioxus-web = { workspace = true }
+dioxus = { workspace = true, features = ["web"]}
 
 log = "0.4.6"
 
diff --git a/examples/channel/src/main.rs b/examples/channel/src/main.rs
@@ -19,8 +19,11 @@ fn app() -> Element {
         }
     });
 
-    let send = move |_: MouseEvent| async move {
-        channel.send("Hello").await.ok();
+    let send = move |_: MouseEvent| {
+        to_owned![channel];
+        async move {
+            channel.send("Hello").await.ok();
+        }
     };
 
     rsx!(
diff --git a/examples/clipboard/Cargo.toml b/examples/clipboard/Cargo.toml
@@ -5,5 +5,4 @@ edition = "2021"
 
 [dependencies]
 dioxus-std = { workspace = true, features = ["clipboard"] }
-dioxus = { workspace = true }
-dioxus-desktop = { workspace = true }
+dioxus = { workspace = true, features = ["desktop"]}
diff --git a/examples/clipboard/src/main.rs b/examples/clipboard/src/main.rs
@@ -2,15 +2,15 @@ use dioxus::prelude::*;
 use dioxus_std::clipboard::use_clipboard;
 
 fn main() {
-    dioxus_desktop::launch(app);
+    launch(app);
 }
 
 fn app() -> Element {
     let mut clipboard = use_clipboard();
     let mut text = use_signal(String::new);
 
     let oninput = move |e: FormEvent| {
-        text.set(e.data.value.clone());
+        text.set(e.data.value());
     };
 
     let oncopy = move |_| match clipboard.set(text.read().clone()) {
diff --git a/examples/color_scheme/Cargo.toml b/examples/color_scheme/Cargo.toml
@@ -5,8 +5,7 @@ edition = "2021"
 
 [dependencies]
 dioxus-std = { workspace = true, features = ["color_scheme"] }
-dioxus = { workspace = true }
-dioxus-web = { workspace = true }
+dioxus = { workspace = true, features = ["web"]}
 
 log = "0.4.6"
 
diff --git a/examples/color_scheme/src/main.rs b/examples/color_scheme/src/main.rs
@@ -6,7 +6,7 @@ fn main() {
     wasm_logger::init(wasm_logger::Config::default());
     console_error_panic_hook::set_once();
 
-    dioxus_web::launch(app);
+    launch(app);
 }
 
 fn app() -> Element {
@@ -17,13 +17,9 @@ fn app() -> Element {
             style: "text-align: center;",
             h1 { "🌗 Dioxus 🚀" }
             if let Ok(color_scheme) = color_scheme {
-                rsx!(
-                    h3 { "You preferred color scheme is {color_scheme:?}." }
-                )
+                h3 { "You preferred color scheme is {color_scheme:?}." }
             } else {
-                rsx!(
-                    h3 { "There was an error when reading your preferred color scheme."}
-                )
+                h3 { "There was an error when reading your preferred color scheme."}
             }
         }
     )
diff --git a/examples/geolocation/Cargo.toml b/examples/geolocation/Cargo.toml
@@ -5,6 +5,5 @@ edition = "2021"
 
 [dependencies]
 dioxus-std = { workspace = true, features = ["geolocation"] }
-dioxus = { workspace = true }
-dioxus-desktop ={ workspace = true }
-# dioxus-web ={ workspace = true }
+# You can change from 'desktop' to 'web' as well
+dioxus = { workspace = true, features = ["desktop"] } 
diff --git a/examples/geolocation/src/main.rs b/examples/geolocation/src/main.rs
@@ -2,13 +2,20 @@ use dioxus::prelude::*;
 use dioxus_std::geolocation::{init_geolocator, use_geolocation, PowerMode};
 
 fn main() {
-    dioxus_desktop::launch(app);
-    //dioxus_web::launch(app);
+    launch(app);
 }
 
 fn app() -> Element {
-    let geolocator = init_geolocator(PowerMode::High).unwrap();
-    let initial_coords = use_future(|_| async move { geolocator.get_coordinates().await.unwrap() });
+    let geolocator = init_geolocator(PowerMode::High);
+    let initial_coords = use_resource(move || async move {
+        geolocator
+            .read()
+            .as_ref()
+            .unwrap()
+            .get_coordinates()
+            .await
+            .unwrap()
+    });
     let latest_coords = use_geolocation();
 
     let latest_coords = match latest_coords {
@@ -22,24 +29,22 @@ fn app() -> Element {
     // Google maps embed api key
     //let key = std::env::var("DIOXUS_GEOLOCATION_MAP_KEY").unwrap();
 
-    let initial_coords = initial_coords.value();
-
     rsx!(
         div {
             style: "text-align: center;",
             h1 { "🗺️ Dioxus Geolocation Example 🛰️" }
             h3 { "Your initial location is:"}
 
             p {
-                if let Some(coords) = initial_coords {
-                    format!("Latitude: {} | Longitude: {}", coords.latitude, coords.longitude)
+                if let Some(coords) = initial_coords.read().as_ref() {
+                    "Latitude: {coords.latitude} | Longitude: {coords.longitude}"
                 } else {
-                    "Loading...".to_string()
+                    "Loading..."
                 }
             }
 
             h3 { "Your latest location is:" }
-            p { format!("Latitude: {} | Longitude: {}", latest_coords.latitude, latest_coords.longitude) }
+            p { "Latitude: {latest_coords.latitude} | Longitude: {latest_coords.longitude}" }
 
             // Google maps embed
             //iframe {
diff --git a/examples/i18n/Cargo.toml b/examples/i18n/Cargo.toml
@@ -5,8 +5,7 @@ edition = "2021"
 
 [dependencies]
 dioxus-std = { workspace = true, features = ["i18n"] }
-dioxus = { workspace = true }
-dioxus-web = { workspace = true }
+dioxus = { workspace = true, features = ["web"] }
 
 log = "0.4.6"
 
diff --git a/examples/i18n/src/main.rs b/examples/i18n/src/main.rs
@@ -1,22 +1,22 @@
 use dioxus::prelude::*;
 use dioxus_std::i18n::*;
 use dioxus_std::translate;
-use std::{collections::HashMap, str::FromStr};
+use std::str::FromStr;
 
 fn main() {
     // init debug tool for WebAssembly
     wasm_logger::init(wasm_logger::Config::default());
     console_error_panic_hook::set_once();
 
-    dioxus_web::launch(app);
+    launch(app);
 }
 
 static EN_US: &str = include_str!("./en-US.json");
 static ES_ES: &str = include_str!("./es-ES.json");
 
 #[allow(non_snake_case)]
 fn Body() -> Element {
-    let i18 = use_i18();
+    let mut i18 = use_i18();
 
     let change_to_english = move |_| i18.set_language("en-US".parse().unwrap());
     let change_to_spanish = move |_| i18.set_language("es-ES".parse().unwrap());
@@ -34,8 +34,8 @@ fn Body() -> Element {
                 "Spanish"
             }
         }
-        p { translate!(i18, "messages.hello_world") }
-        p { translate!(i18, "messages.hello", name: "Dioxus")  }
+        p { {translate!(i18, "messages.hello_world")} }
+        p { {translate!(i18, "messages.hello", name: "Dioxus")}  }
     )
 }
 
diff --git a/std/src/geolocation/use_geolocation.rs b/std/src/geolocation/use_geolocation.rs
@@ -3,12 +3,13 @@
 use super::core::{Error, Event, Geocoordinates, Geolocator, PowerMode, Status};
 use dioxus::{
     prelude::{
-        provide_context, try_consume_context, use_coroutine, use_signal, Signal, UnboundedReceiver,
+        provide_context, try_consume_context, use_coroutine, use_hook, use_signal, Signal,
+        UnboundedReceiver,
     },
     signals::{Readable, Writable},
 };
 use futures_util::stream::StreamExt;
-use std::{rc::Rc, sync::Once};
+use std::sync::Once;
 
 static INIT: Once = Once::new();
 
@@ -17,11 +18,14 @@ pub fn use_geolocation() -> Result<Geocoordinates, Error> {
     // Store the coords
     let mut coords: Signal<Result<Geocoordinates, Error>> =
         use_signal(|| Err(Error::NotInitialized));
+    let Some(geolocator) = try_consume_context::<Signal<Result<Geolocator, Error>>>() else {
+        return Err(Error::NotInitialized);
+    };
+    let geolocator = geolocator.read();
 
     // Get geolocator
-    let geolocator = match try_consume_context::<Rc<Geolocator>>() {
-        Some(v) => v,
-        None => return Err(Error::NotInitialized),
+    let Ok(geolocator) = geolocator.as_ref() else {
+        return Err(Error::NotInitialized);
     };
 
     // Initialize the handler of events
@@ -49,9 +53,9 @@ pub fn use_geolocation() -> Result<Geocoordinates, Error> {
 }
 
 /// Must be called before any use of the geolocation abstraction.
-pub fn init_geolocator(power_mode: PowerMode) -> Result<Rc<Geolocator>, Error> {
-    let geolocator = Geolocator::new(power_mode)?;
-    let shared_locator = Rc::new(geolocator);
-    provide_context(shared_locator.clone());
-    Ok(shared_locator)
+pub fn init_geolocator(power_mode: PowerMode) -> Signal<Result<Geolocator, Error>> {
+    use_hook(|| {
+        let geolocator = Signal::new(Geolocator::new(power_mode));
+        provide_context(geolocator)
+    })
 }

Original file line number	Diff line number	Diff line change
`@@ -6,7 +6,7 @@ fn main() {`
`6`	`6`	`wasm_logger::init(wasm_logger::Config::default());`
`7`	`7`	`console_error_panic_hook::set_once();`
`8`	`8`
`9`		`- dioxus_web::launch(app);`
	`9`	`+ launch(app);`
`10`	`10`	`}`
`11`	`11`
`12`	`12`	`fn app() -> Element {`
`@@ -17,13 +17,9 @@ fn app() -> Element {`
`17`	`17`	`style: "text-align: center;",`
`18`	`18`	`h1 { "🌗 Dioxus 🚀" }`
`19`	`19`	`if let Ok(color_scheme) = color_scheme {`
`20`		`- rsx!(`
`21`		`- h3 { "You preferred color scheme is {color_scheme:?}." }`
`22`		`- )`
	`20`	`+ h3 { "You preferred color scheme is {color_scheme:?}." }`
`23`	`21`	`} else {`
`24`		`- rsx!(`
`25`		`- h3 { "There was an error when reading your preferred color scheme."}`
`26`		`- )`
	`22`	`+ h3 { "There was an error when reading your preferred color scheme."}`
`27`	`23`	`}`
`28`	`24`	`}`
`29`	`25`	`)`