Added initial_url to the router component (#510)

* added active_url

* renamed active_url to initial_url

* updated docs

packages/router/src/cfg.rs

@@ -2,4 +2,5 @@
 pub struct RouterCfg {
     pub base_url: Option<String>,
     pub active_class: Option<String>,
+    pub initial_url: Option<String>,
 }

packages/router/src/components/router.rs

@@ -28,6 +28,9 @@ pub struct RouterProps<'a> {
     /// This is useful if you don't want to repeat the same `active_class` prop value in every Link.
     /// By default set to `"active"`.
     pub active_class: Option<&'a str>,
+
+    /// Set the initial url.
+    pub initial_url: Option<String>,
 }
 
 /// A component that conditionally renders children based on the current location of the app.
@@ -43,6 +46,7 @@ pub fn Router<'a>(cx: Scope<'a, RouterProps<'a>>) -> Element {
             RouterCfg {
                 base_url: cx.props.base_url.map(|s| s.to_string()),
                 active_class: cx.props.active_class.map(|s| s.to_string()),
+                initial_url: cx.props.initial_url.clone(),
             },
         ))
     });

packages/router/src/service.rs

@@ -9,6 +9,7 @@ use std::{
     cell::{Cell, RefCell},
     collections::{HashMap, HashSet},
     rc::Rc,
+    str::FromStr,
     sync::Arc,
 };
 use url::Url;
@@ -84,7 +85,19 @@ impl RouterCore {
         #[cfg(not(feature = "web"))]
         let history = Box::new(hash::new());
 
-        let route = Arc::new(history.init_location());
+        let route = match &cfg.initial_url {
+            Some(url) => Arc::new(ParsedRoute {
+                url: Url::from_str(&url).expect(
+                    format!(
+                        "RouterCfg expects a valid initial_url, but got '{}'. Example: '{{scheme}}://{{?authority}}/{{?path}}'",
+                        &url
+                    ).as_str()
+                ),
+                title: None,
+                serialized_state: None,
+            }),
+            None => Arc::new(history.init_location()),
+        };
 
         let svc = Arc::new(Self {
             cfg,

packages/router/usage.md

@@ -81,6 +81,20 @@ Router {
 }
 ```
 
+#### Initial url
+
+When working with ssr specially is crucial to have the ability to set an initial url. This is an optional property and defaults to `app:///` for desktop, mobile and ssr, and for web retrieves the url from the window current location.
+
+You must provide a valid URL `{scheme}://{?authority}/{?path}`.
+
+```rust
+Router {
+    initial_url: "https://dioxuslab.com/blog",  // Set the initial url. 
+    Link { to: "/", "Home" },
+    Link { to: "/blog", "Blog" }, // The router will render this route.
+}
+```
+
 ### Segments
 
 Each route in your app is comprised of segments and queries. Segments are the portions of the route delimited by forward slashes.
@@ -125,12 +139,8 @@ fn BlogPost(cx: Scope) -> Element {
 }
 ```
 
-
 ### Queries
 
-
-
-
 ### Listeners
 
 It's possible to connect to route change events from the router by attaching a listener to the Router's `onchange` parameter. This listener is guaranteed to run before any of your routes are matched, so you can perform redirects, add some logging, fetch some data, or do anything that you might want to be synchronous with clicks on Links.
@@ -154,7 +164,6 @@ fn app() {
 }
 ```
 
-
 Listeners can also be attached downstream in your app with the `RouteListener` handler component:
 
 ```rust
@@ -169,7 +178,6 @@ fn TitleCard(cx: Scope) -> Element {
 }
 ```
 
-
 ### Working with Github Pages and other static hosts
 
 Most "static" hosts will have issues with single-page-app (SPA) routers. To get around this, you can either generate an index.html for each route or hijack the 404 page.
@@ -178,7 +186,7 @@ For generating a static index.html, see `Generating a Route List`.
 
 To hijack the 404 page, we can simply make a copy of our index.html page and call it 404.html. When Github Pages serves this 404 page, your app will be served instead and the router will render the right corresponding route.
 
-https://docs.github.com/en/pages/getting-started-with-github-pages/creating-a-custom-404-page-for-your-github-pages-site
+<https://docs.github.com/en/pages/getting-started-with-github-pages/creating-a-custom-404-page-for-your-github-pages-site>
 
 ### Generating a SiteMap or Route List