diff --git a/examples/flat_router.rs b/examples/flat_router.rs index 8d6790502..f055e113e 100644 --- a/examples/flat_router.rs +++ b/examples/flat_router.rs @@ -5,17 +5,15 @@ use dioxus_router::prelude::*; fn main() { env_logger::init(); - LaunchBuilder::new(|| { - render! { Router:: {} } - }) - .cfg( - Config::new().with_window( - WindowBuilder::new() - .with_inner_size(LogicalSize::new(600, 1000)) - .with_resizable(false), - ), - ) - .launch() + LaunchBuilder::new(Route::Home {}) + .cfg( + Config::new().with_window( + WindowBuilder::new() + .with_inner_size(LogicalSize::new(600, 1000)) + .with_resizable(false), + ), + ) + .launch() } #[derive(Routable, Clone)] diff --git a/examples/link.rs b/examples/link.rs index 14bfd0c79..bf1d315f0 100644 --- a/examples/link.rs +++ b/examples/link.rs @@ -9,21 +9,17 @@ fn main() { fn App() -> Element { rsx! ( div { - p { - a { href: "http://dioxuslabs.com/", "Default link - links outside of your app" } - } + p { a { href: "http://dioxuslabs.com/", "Default link - links outside of your app" } } p { a { href: "http://dioxuslabs.com/", prevent_default: "onclick", onclick: |_| println!("Hello Dioxus"), - "Custom event link - links inside of your app", + "Custom event link - links inside of your app" } } } - div { - Router:: {} - } + div { Router:: {} } ) } @@ -42,8 +38,12 @@ fn Header() -> Element { render! { h1 { "Your app here" } ul { - li { Link { to: Route::Home {}, "home" } } - li { Link { to: Route::Settings {}, "settings" } } + li { + Link { to: Route::Home {}, "home" } + } + li { + Link { to: Route::Settings {}, "settings" } + } } Outlet:: {} } @@ -51,10 +51,10 @@ fn Header() -> Element { #[component] fn Home() -> Element { - render!(h1 { "Home" }) + render!( h1 { "Home" } ) } #[component] fn Settings() -> Element { - render!(h1 { "Settings" }) + render!( h1 { "Settings" } ) } diff --git a/examples/router.rs b/examples/router.rs index 8c2c1241f..cba432962 100644 --- a/examples/router.rs +++ b/examples/router.rs @@ -2,10 +2,7 @@ use dioxus::prelude::*; use dioxus_router::prelude::*; fn main() { - #[cfg(target_arch = "wasm32")] - dioxus_web::launch(App); - #[cfg(not(target_arch = "wasm32"))] - launch(App); + launch(Route::Home {}); } // ANCHOR: router @@ -35,20 +32,17 @@ enum Route { } // ANCHOR_END: router -#[component] -fn App() -> Element { - render! { - Router:: {} - } -} - #[component] fn NavBar() -> Element { render! { nav { ul { - li { Link { to: Route::Home {}, "Home" } } - li { Link { to: Route::BlogList {}, "Blog" } } + li { + Link { to: Route::Home {}, "Home" } + } + li { + Link { to: Route::BlogList {}, "Blog" } + } } } Outlet:: {} @@ -57,9 +51,7 @@ fn NavBar() -> Element { #[component] fn Home() -> Element { - render! { - h1 { "Welcome to the Dioxus Blog!" } - } + render! { h1 { "Welcome to the Dioxus Blog!" } } } #[component] @@ -77,13 +69,17 @@ fn BlogList() -> Element { ul { li { Link { - to: Route::BlogPost { name: "Blog post 1".into() }, + to: Route::BlogPost { + name: "Blog post 1".into(), + }, "Read the first blog post" } } li { Link { - to: Route::BlogPost { name: "Blog post 2".into() }, + to: Route::BlogPost { + name: "Blog post 2".into(), + }, "Read the second blog post" } } @@ -93,9 +89,7 @@ fn BlogList() -> Element { #[component] fn BlogPost(name: String) -> Element { - render! { - h2 { "Blog Post: {name}"} - } + render! { h2 { "Blog Post: {name}" } } } #[component] @@ -103,9 +97,6 @@ fn PageNotFound(route: Vec) -> Element { render! { h1 { "Page not found" } p { "We are terribly sorry, but the page you requested doesn't exist." } - pre { - color: "red", - "log:\nattemped to navigate to: {route:?}" - } + pre { color: "red", "log:\nattemped to navigate to: {route:?}" } } } diff --git a/examples/simple_desktop.rs b/examples/simple_desktop.rs index e7e36e916..d44050dbb 100644 --- a/examples/simple_desktop.rs +++ b/examples/simple_desktop.rs @@ -9,14 +9,7 @@ fn main() { .with_module_level("dioxus", log::LevelFilter::Trace) .init() .unwrap(); - launch(App); -} - -#[component] -fn App() -> Element { - render! { - Router:: {} - } + launch(Route::Home {}); } #[derive(Routable, Clone)] @@ -42,11 +35,36 @@ fn NavBar() -> Element { render! { h1 { "Your app here" } ul { - li { Link { to: Route::Home {}, "home" } } - li { Link { to: Route::BlogList {}, "blog" } } - li { Link { to: Route::BlogPost { post: "tim".into() }, "tims' blog" } } - li { Link { to: Route::BlogPost { post: "bill".into() }, "bills' blog" } } - li { Link { to: Route::BlogPost { post: "james".into() }, "james amazing' blog" } } + li { + Link { to: Route::Home {}, "home" } + } + li { + Link { to: Route::BlogList {}, "blog" } + } + li { + Link { + to: Route::BlogPost { + post: "tim".into(), + }, + "tims' blog" + } + } + li { + Link { + to: Route::BlogPost { + post: "bill".into(), + }, + "bills' blog" + } + } + li { + Link { + to: Route::BlogPost { + post: "james".into(), + }, + "james amazing' blog" + } + } } Outlet:: {} } @@ -70,7 +88,7 @@ fn BlogPost(post: String) -> Element { render! { div { - h3 { "blog post: {post}" } + h3 { "blog post: {post}" } Link { to: Route::BlogList {}, "back to blog list" } } } diff --git a/examples/simple_router.rs b/examples/simple_router.rs index 9f2f7c91c..0cb48a44c 100644 --- a/examples/simple_router.rs +++ b/examples/simple_router.rs @@ -29,14 +29,32 @@ fn Blog(id: String) -> Element { fn Nav() -> Element { render! { nav { - li { Link { to: Route::Homepage { }, "Go home" } } - li { Link { to: Route::Blog { id: "Brownies".to_string() }, "Learn Brownies" } } - li { Link { to: Route::Blog { id: "Cookies".to_string() }, "Learn Cookies" } } + li { + Link { to: Route::Homepage {}, "Go home" } + } + li { + Link { + to: Route::Blog { + id: "Brownies".to_string(), + }, + "Learn Brownies" + } + } + li { + Link { + to: Route::Blog { + id: "Cookies".to_string(), + }, + "Learn Cookies" + } + } } div { Outlet:: {} } } } fn main() { - launch(|| render!(Router:: {})); + launch(Route::Blog { + id: "hello".to_string(), + }); } diff --git a/packages/router-macro/src/lib.rs b/packages/router-macro/src/lib.rs index 75f739372..05cce7f9e 100644 --- a/packages/router-macro/src/lib.rs +++ b/packages/router-macro/src/lib.rs @@ -213,6 +213,7 @@ pub fn routable(input: TokenStream) -> TokenStream { let parse_impl = route_enum.parse_impl(); let display_impl = route_enum.impl_display(); let routable_impl = route_enum.routable_impl(); + let component_impl = route_enum.component_impl(); (quote! { #error_type @@ -221,6 +222,8 @@ pub fn routable(input: TokenStream) -> TokenStream { #routable_impl + #component_impl + #parse_impl }) .into() @@ -599,6 +602,25 @@ impl RouteEnum { } } } + + fn component_impl(&self) -> TokenStream2 { + let name = &self.name; + + quote! { + impl dioxus_core::ComponentFunction<#name> for #name { + type Props = ::std::rc::Rc<::std::cell::Cell<::dioxus_router::prelude::RouterConfig<#name>>>; + + fn call(&self, props: Self::Props) -> dioxus_core::Element { + let initial_route = self.clone(); + render! { + ::dioxus_router::prelude::Router::<#name> { + config: move || props.take().initial_route(initial_route) + } + } + } + } + } + } } struct SiteMapSegment { diff --git a/packages/router/examples/simple_routes.rs b/packages/router/examples/simple_routes.rs index d810cc07f..df7692e79 100644 --- a/packages/router/examples/simple_routes.rs +++ b/packages/router/examples/simple_routes.rs @@ -28,7 +28,7 @@ async fn main() { get(move |ws: WebSocketUpgrade| async move { ws.on_upgrade(move |socket| async move { _ = view - .launch(dioxus_liveview::axum_socket(socket), Root) + .launch(dioxus_liveview::axum_socket(socket), Route::Home {}) .await; }) }), @@ -44,23 +44,7 @@ async fn main() { #[cfg(not(feature = "liveview"))] fn main() { - #[cfg(not(target_arch = "wasm32"))] - dioxus_desktop::launch(Root); - - #[cfg(target_arch = "wasm32")] - dioxus_web::launch(root); -} - -#[cfg(feature = "liveview")] -#[component] -fn Root() -> Element { - render! { Router:: {} } -} - -#[cfg(not(feature = "liveview"))] -#[component] -fn Root() -> Element { - render! { Router:: {} } + launch(Route::Home {}) } #[component] diff --git a/packages/router/src/components/router.rs b/packages/router/src/components/router.rs index 4030047ac..77c1829b8 100644 --- a/packages/router/src/components/router.rs +++ b/packages/router/src/components/router.rs @@ -1,13 +1,14 @@ use dioxus_lib::prelude::*; -use std::{cell::RefCell, str::FromStr}; +use std::{cell::RefCell, rc::Rc, str::FromStr}; use crate::{prelude::Outlet, routable::Routable, router_cfg::RouterConfig}; /// The config for [`Router`]. +#[derive(Clone)] pub struct RouterConfigFactory { #[allow(clippy::type_complexity)] - config: RefCell RouterConfig>>>, + config: Rc RouterConfig>>>>, } #[cfg(feature = "serde")] @@ -34,7 +35,7 @@ where impl RouterConfig + 'static> From for RouterConfigFactory { fn from(value: F) -> Self { Self { - config: RefCell::new(Some(Box::new(value))), + config: Rc::new(RefCell::new(Some(Box::new(value)))), } } } @@ -67,7 +68,9 @@ where ::Err: std::fmt::Display, { fn clone(&self) -> Self { - todo!() + Self { + config: self.config.clone(), + } } } @@ -127,21 +130,21 @@ where { use crate::prelude::{outlet::OutletContext, RouterContext}; - todo!(); - // use_context_provider(|| { - // RouterContext::new( - // (props - // .config - // .config - // .take() - // .expect("use_context_provider ran twice"))(), - // schedule_update_any(), - // ) - // }); - // use_context_provider(|| OutletContext:: { - // current_level: 0, - // _marker: std::marker::PhantomData, - // }); + use_hook(|| { + provide_context(RouterContext::new( + (props + .config + .config + .take() + .expect("use_context_provider ran twice"))(), + schedule_update_any(), + )); + + provide_context(OutletContext:: { + current_level: 0, + _marker: std::marker::PhantomData, + }); + }); render! { Outlet:: {} } } diff --git a/packages/router/src/router_cfg.rs b/packages/router/src/router_cfg.rs index e03223483..6df2b73fe 100644 --- a/packages/router/src/router_cfg.rs +++ b/packages/router/src/router_cfg.rs @@ -28,6 +28,7 @@ pub struct RouterConfig { pub(crate) failure_external_navigation: fn() -> Element, pub(crate) history: Option>, pub(crate) on_update: Option>, + pub(crate) initial_route: Option, } #[cfg(feature = "serde")] @@ -77,6 +78,7 @@ where failure_external_navigation: FailureExternalNavigation, history: None, on_update: None, + initial_route: None, } } } @@ -88,18 +90,22 @@ where { pub(crate) fn take_history(&mut self) -> Box { self.history.take().unwrap_or_else(|| { + #[allow(unused)] + let initial_route = self.initial_route.clone().unwrap_or("/".parse().unwrap_or_else(|err| + panic!("index route does not exist:\n{}\n use MemoryHistory::with_initial_path or RouterConfig::initial_route to set a custom path", err) + )); // If we are on wasm32 and the web feature is enabled, use the web history. #[cfg(all(target_arch = "wasm32", feature = "web"))] - let history = Box::>>::default(); + let history = Box::>>::default(); // If we are not on wasm32 and the liveview feature is enabled, use the liveview history. #[cfg(all(feature = "liveview", not(target_arch = "wasm32")))] - let history = Box::>>::default(); + let history = Box::new(AnyHistoryProviderImplWrapper::new(LiveviewHistory::new(initial_route))); // If neither of the above are true, use the memory history. #[cfg(all( not(all(target_arch = "wasm32", feature = "web")), not(all(feature = "liveview", not(target_arch = "wasm32"))), ))] - let history = Box::>>::default(); + let history = Box::new(AnyHistoryProviderImplWrapper::new(MemoryHistory::with_initial_path(initial_route))); history }) } @@ -135,7 +141,7 @@ where /// The [`HistoryProvider`] the router should use. /// - /// Defaults to a default [`MemoryHistory`]. + /// Defaults to a different history provider depending on the target platform. pub fn history(self, history: impl HistoryProvider + 'static) -> Self { Self { history: Some(Box::new(AnyHistoryProviderImplWrapper::new(history))), @@ -143,6 +149,14 @@ where } } + /// The initial route the router should use if no history provider is set. + pub fn initial_route(self, route: R) -> Self { + Self { + initial_route: Some(route), + ..self + } + } + /// A component to render when an external navigation fails. /// /// Defaults to a router-internal component called [`FailureExternalNavigation`]