Mirrors/dioxus
2
0
Fork 0
mirror of https://github.com/DioxusLabs/dioxus synced 2024-11-10 22:54:12 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #203 from DioxusLabs/jk/local-router

Browse source 
Feat: abstract the router on a per-platform basis and add docs
This commit is contained in:
Jonathan Kelley 2022-03-05 14:16:18 -05:00 committed by GitHub
commit bec2f4129b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
33 changed files with 854 additions and 552 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
Cargo.toml
View file

@ -31,12 +31,12 @@ dioxus-interpreter-js = { path = "./packages/interpreter", version = "^0.0.0", o
[features]
default = ["macro", "hooks", "html"]
macro = ["dioxus-core-macro"]
# macro = ["dioxus-core-macro", "dioxus-rsx"]
macro = ["dioxus-core-macro"]
hooks = ["dioxus-hooks"]
html = ["dioxus-html"]
ssr = ["dioxus-ssr"]
web = ["dioxus-web"]
web = ["dioxus-web", "dioxus-router/web"]
desktop = ["dioxus-desktop"]
ayatana = ["dioxus-desktop/ayatana"]
router = ["dioxus-router"]
@ -72,7 +72,7 @@ dioxus = { path = ".", features = ["desktop", "ssr", "router", "fermi"] }
fern = { version = "0.6.0", features = ["colored"] }
criterion = "0.3.5"
thiserror = "1.0.30"
env_logger = "0.9.0"
[[bench]]
name = "create"

1
examples/fermi.rs
View file

@ -1,7 +1,6 @@
#![allow(non_snake_case)]
use dioxus::prelude::*;
use fermi::prelude::*;
fn main() {
dioxus::desktop::launch(app)

40
examples/flat_router.rs Normal file
View file

@ -0,0 +1,40 @@
use dioxus::prelude::*;
use dioxus::router::*;
use dioxus::desktop::tao::dpi::LogicalSize;
fn main() {
env_logger::init();
dioxus::desktop::launch_cfg(app, |c| {
c.with_window(|c| {
c.with_title("Spinsense Client")
.with_inner_size(LogicalSize::new(600, 1000))
.with_resizable(false)
})
})
}
fn app(cx: Scope) -> Element {
cx.render(rsx! {
Router {
Route { to: "/", "Home" }
Route { to: "/games", "Games" }
Route { to: "/play", "Play" }
Route { to: "/settings", "Settings" }
p {
"----"
}
nav {
ul {
Link { to: "/", li { "Home" } }
Link { to: "/games", li { "Games" } }
Link { to: "/play", li { "Play" } }
Link { to: "/settings", li { "Settings" } }
}
}
}
})
}

5
examples/router.rs
View file

@ -31,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 {
@ -47,7 +47,8 @@ struct Query {
}
fn User(cx: Scope) -> Element {
let post = dioxus::router::use_route(&cx).last_segment();
let post = dioxus::router::use_route(&cx).last_segment()?;
let query = dioxus::router::use_route(&cx)
.query::<Query>()
.unwrap_or(Query { bold: false });

27
packages/core/src/scopes.rs
View file

@ -327,12 +327,12 @@ impl ScopeArena {
while let Some(id) = cur_el.take() {
if let Some(el) = nodes.get(id.0) {
let real_el = unsafe { &**el };
log::debug!("looking for listener on {:?}", real_el);
log::trace!("looking for listener on {:?}", real_el);
if let VNode::Element(real_el) = real_el {
for listener in real_el.listeners.borrow().iter() {
if listener.event == event.name {
log::debug!("calling listener {:?}", listener.event);
log::trace!("calling listener {:?}", listener.event);
if state.canceled.get() {
// stop bubbling if canceled
break;
@ -440,7 +440,7 @@ impl<'a, P> std::ops::Deref for Scope<'a, P> {
/// `ScopeId` is a `usize` that is unique across the entire VirtualDOM and across time. ScopeIDs will never be reused
/// once a component has been unmounted.
#[cfg_attr(feature = "serialize", derive(serde::Serialize, serde::Deserialize))]
#[derive(Copy, Clone, PartialEq, Eq, Hash, Debug)]
#[derive(Copy, Clone, PartialEq, Eq, Hash, Debug, PartialOrd, Ord)]
pub struct ScopeId(pub usize);
/// A task's unique identifier.
@ -489,7 +489,7 @@ pub struct ScopeState {
pub(crate) hook_idx: Cell<usize>,
// shared state -> todo: move this out of scopestate
pub(crate) shared_contexts: RefCell<HashMap<TypeId, Rc<dyn Any>>>,
pub(crate) shared_contexts: RefCell<HashMap<TypeId, Box<dyn Any>>>,
pub(crate) tasks: Rc<TaskQueue>,
}
@ -676,11 +676,10 @@ impl ScopeState {
/// rsx!(cx, div { "hello {state.0}" })
/// }
/// ```
pub fn provide_context<T: 'static>(&self, value: T) -> Rc<T> {
let value = Rc::new(value);
pub fn provide_context<T: 'static + Clone>(&self, value: T) -> T {
self.shared_contexts
.borrow_mut()
.insert(TypeId::of::<T>(), value.clone())
.insert(TypeId::of::<T>(), Box::new(value.clone()))
.and_then(|f| f.downcast::<T>().ok());
value
}
@ -703,14 +702,12 @@ impl ScopeState {
/// rsx!(cx, div { "hello {state.0}" })
/// }
/// ```
pub fn provide_root_context<T: 'static>(&self, value: T) -> Rc<T> {
let value = Rc::new(value);
pub fn provide_root_context<T: 'static + Clone>(&self, value: T) -> T {
// if we *are* the root component, then we can just provide the context directly
if self.scope_id() == ScopeId(0) {
self.shared_contexts
.borrow_mut()
.insert(TypeId::of::<T>(), value.clone())
.insert(TypeId::of::<T>(), Box::new(value.clone()))
.and_then(|f| f.downcast::<T>().ok());
return value;
}
@ -724,7 +721,7 @@ impl ScopeState {
let exists = parent
.shared_contexts
.borrow_mut()
.insert(TypeId::of::<T>(), value.clone());
.insert(TypeId::of::<T>(), Box::new(value.clone()));
if exists.is_some() {
log::warn!("Context already provided to parent scope - replacing it");
@ -739,9 +736,9 @@ impl ScopeState {
}
/// Try to retrieve a SharedState with type T from the any parent Scope.
pub fn consume_context<T: 'static>(&self) -> Option<Rc<T>> {
pub fn consume_context<T: 'static + Clone>(&self) -> Option<T> {
if let Some(shared) = self.shared_contexts.borrow().get(&TypeId::of::<T>()) {
Some(shared.clone().downcast::<T>().unwrap())
Some((*shared.downcast_ref::<T>().unwrap()).clone())
} else {
let mut search_parent = self.parent_scope;
@ -749,7 +746,7 @@ impl ScopeState {
// safety: all parent pointers are valid thanks to the bump arena
let parent = unsafe { &*parent_ptr };
if let Some(shared) = parent.shared_contexts.borrow().get(&TypeId::of::<T>()) {
return Some(shared.clone().downcast::<T>().unwrap());
return Some(shared.downcast_ref::<T>().unwrap().clone());
}
search_parent = parent.parent_scope;
}

21
packages/desktop/src/controller.rs
View file

@ -2,8 +2,8 @@ use crate::desktop_context::{DesktopContext, UserWindowEvent};
use dioxus_core::*;
use std::{
collections::HashMap,
sync::atomic::AtomicBool,
sync::{Arc, RwLock},
sync::Arc,
sync::{atomic::AtomicBool, Mutex},
};
use wry::{
self,
@ -14,7 +14,7 @@ use wry::{
pub(super) struct DesktopController {
pub(super) webviews: HashMap<WindowId, WebView>,
pub(super) sender: futures_channel::mpsc::UnboundedSender<SchedulerMsg>,
pub(super) pending_edits: Arc<RwLock<Vec<String>>>,
pub(super) pending_edits: Arc<Mutex<Vec<String>>>,
pub(super) quit_app_on_close: bool,
pub(super) is_ready: Arc<AtomicBool>,
}
@ -27,13 +27,13 @@ impl DesktopController {
props: P,
proxy: EventLoopProxy<UserWindowEvent>,
) -> Self {
let edit_queue = Arc::new(RwLock::new(Vec::new()));
let pending_edits = edit_queue.clone();
let edit_queue = Arc::new(Mutex::new(Vec::new()));
let (sender, receiver) = futures_channel::mpsc::unbounded::<SchedulerMsg>();
let return_sender = sender.clone();
let pending_edits = edit_queue.clone();
let return_sender = sender.clone();
let desktop_context_proxy = proxy.clone();
std::thread::spawn(move || {
// We create the runtime as multithreaded, so you can still "spawn" onto multiple threads
let runtime = tokio::runtime::Builder::new_multi_thread()
@ -52,7 +52,7 @@ impl DesktopController {
let edits = dom.rebuild();
edit_queue
.write()
.lock()
.unwrap()
.push(serde_json::to_string(&edits.edits).unwrap());
@ -62,9 +62,10 @@ impl DesktopController {
loop {
dom.wait_for_work().await;
let mut muts = dom.work_with_deadline(|| false);
while let Some(edit) = muts.pop() {
edit_queue
.write()
.lock()
.unwrap()
.push(serde_json::to_string(&edit.edits).unwrap());
}
@ -93,7 +94,7 @@ impl DesktopController {
pub(super) fn try_load_ready_webviews(&mut self) {
if self.is_ready.load(std::sync::atomic::Ordering::Relaxed) {
let mut queue = self.pending_edits.write().unwrap();
let mut queue = self.pending_edits.lock().unwrap();
let (_id, view) = self.webviews.iter_mut().next().unwrap();
while let Some(edit) = queue.pop() {

12
packages/desktop/src/desktop_context.rs
View file

@ -1,14 +1,15 @@
use std::rc::Rc;
use crate::controller::DesktopController;
use dioxus_core::ScopeState;
use wry::application::event_loop::ControlFlow;
use wry::application::event_loop::EventLoopProxy;
use wry::application::window::Fullscreen as WryFullscreen;
use UserWindowEvent::*;
pub type ProxyType = EventLoopProxy<UserWindowEvent>;
/// Get an imperative handle to the current window
pub fn use_window(cx: &ScopeState) -> &Rc<DesktopContext> {
pub fn use_window(cx: &ScopeState) -> &DesktopContext {
cx.use_hook(|_| cx.consume_context::<DesktopContext>())
.as_ref()
.unwrap()
@ -120,11 +121,6 @@ impl DesktopContext {
}
}
use wry::application::event_loop::ControlFlow;
use wry::application::window::Fullscreen as WryFullscreen;
use crate::controller::DesktopController;
#[derive(Debug)]
pub enum UserWindowEvent {
Update,

4
packages/fermi/src/hooks/atom_root.rs
View file

@ -4,8 +4,8 @@ use std::rc::Rc;
// Returns the atom root, initiaizing it at the root of the app if it does not exist.
pub fn use_atom_root(cx: &ScopeState) -> &Rc<AtomRoot> {
cx.use_hook(|_| match cx.consume_context::<AtomRoot>() {
cx.use_hook(|_| match cx.consume_context::<Rc<AtomRoot>>() {
Some(root) => root,
None => cx.provide_root_context(AtomRoot::new(cx.schedule_update_any())),
None => cx.provide_root_context(Rc::new(AtomRoot::new(cx.schedule_update_any()))),
})
}

4
packages/fermi/src/hooks/init_atom_root.rs
View file

@ -4,8 +4,8 @@ use std::rc::Rc;
// Initializes the atom root and retuns it;
pub fn use_init_atom_root(cx: &ScopeState) -> &Rc<AtomRoot> {
cx.use_hook(|_| match cx.consume_context::<AtomRoot>() {
cx.use_hook(|_| match cx.consume_context::<Rc<AtomRoot>>() {
Some(ctx) => ctx,
None => cx.provide_context(AtomRoot::new(cx.schedule_update_any())),
None => cx.provide_context(Rc::new(AtomRoot::new(cx.schedule_update_any()))),
})
}

8
packages/hooks/src/use_shared_state.rs
View file

@ -6,7 +6,7 @@ use std::{
sync::Arc,
};
type ProvidedState<T> = RefCell<ProvidedStateInner<T>>;
type ProvidedState<T> = Rc<RefCell<ProvidedStateInner<T>>>;
// Tracks all the subscribers to a shared State
pub struct ProvidedStateInner<T> {
@ -91,7 +91,7 @@ pub fn use_context<'a, T: 'static>(cx: &'a ScopeState) -> Option<UseSharedState<
}
struct SharedStateInner<T: 'static> {
root: Option<Rc<ProvidedState<T>>>,
root: Option<ProvidedState<T>>,
value: Option<Rc<RefCell<T>>>,
scope_id: ScopeId,
needs_notification: Cell<bool>,
@ -174,11 +174,11 @@ where
///
pub fn use_context_provider<T: 'static>(cx: &ScopeState, f: impl FnOnce() -> T) {
cx.use_hook(|_| {
let state: ProvidedState<T> = RefCell::new(ProvidedStateInner {
let state: ProvidedState<T> = Rc::new(RefCell::new(ProvidedStateInner {
value: Rc::new(RefCell::new(f())),
notify_any: cx.schedule_update_any(),
consumers: HashSet::new(),
});
}));
cx.provide_context(state)
});
}

12
packages/hooks/src/usecoroutine.rs
View file

@ -1,7 +1,6 @@
use dioxus_core::{ScopeState, TaskId};
pub use futures_channel::mpsc::{UnboundedReceiver, UnboundedSender};
use std::future::Future;
use std::rc::Rc;
/// Maintain a handle over a future that can be paused, resumed, and canceled.
///
@ -76,7 +75,7 @@ where
/// Get a handle to a coroutine higher in the tree
///
/// See the docs for [`use_coroutine`] for more details.
pub fn use_coroutine_handle<M: 'static>(cx: &ScopeState) -> Option<&Rc<CoroutineHandle<M>>> {
pub fn use_coroutine_handle<M: 'static>(cx: &ScopeState) -> Option<&CoroutineHandle<M>> {
cx.use_hook(|_| cx.consume_context::<CoroutineHandle<M>>())
.as_ref()
}
@ -86,6 +85,15 @@ pub struct CoroutineHandle<T> {
task: TaskId,
}
impl<T> Clone for CoroutineHandle<T> {
fn clone(&self) -> Self {
Self {
tx: self.tx.clone(),
task: self.task,
}
}
}
impl<T> CoroutineHandle<T> {
/// Get the ID of this coroutine
#[must_use]

31
packages/router/Cargo.toml
View file

@ -14,10 +14,8 @@ keywords = ["dom", "ui", "gui", "react", "wasm"]
dioxus-core = { path = "../core", version = "^0.1.9", default-features = false }
dioxus-html = { path = "../html", version = "^0.1.6", default-features = false }
dioxus-core-macro = { path = "../core-macro", version = "^0.1.7" }
serde = "1"
serde_urlencoded = "0.7"
# url = "2.2.2"
futures-channel = "0.3.21"
url = { version = "2.2.2", default-features = false }
# for wasm
web-sys = { version = "0.3", features = [
@ -33,16 +31,17 @@ web-sys = { version = "0.3", features = [
], optional = true }
wasm-bindgen = { version = "0.2", optional = true }
js-sys = { version = "0.3", optional = true }
gloo = { version = "0.5", optional = true }
gloo-events = { version = "0.1.1", optional = true }
log = "0.4.14"
thiserror = "1.0.30"
futures-util = "0.3.21"
serde = { version = "1", optional = true }
serde_urlencoded = { version = "0.7.1", optional = true }
[features]
default = ["derive", "web"]
web = ["web-sys", "gloo", "js-sys", "wasm-bindgen"]
desktop = []
mobile = []
derive = []
default = ["query"]
web = ["web-sys", "gloo-events", "js-sys", "wasm-bindgen"]
query = ["serde", "serde_urlencoded"]
wasm_test = []
[dev-dependencies]
@ -52,9 +51,13 @@ log = "0.4.14"
wasm-logger = "0.2.0"
wasm-bindgen-test = "0.3"
gloo-utils = "0.1.2"
dioxus-ssr = { path = "../ssr" }
dioxus-router = { path = ".", default-features = false }
[target.wasm32-unknown-unknown.dev-dependencies]
dioxus-router = { path = ".", features = ["web"] }
[dev-dependencies.web-sys]
version = "0.3"
features = [
"Document",
]
features = ["Document"]

2
packages/router/README.md
View file

@ -51,7 +51,7 @@
Dioxus Router is a first-party Router for all your Dioxus Apps. It provides a React-Router style interface that works anywhere: across the browser, SSR, and natively.
```rust
```rust, ignore
fn app() {
cx.render(rsx! {
Router {

28
packages/router/examples/simple.rs
View file

@ -8,21 +8,28 @@ use dioxus_router::*;
fn main() {
console_error_panic_hook::set_once();
wasm_logger::init(wasm_logger::Config::new(log::Level::Debug));
dioxus_web::launch(APP);
dioxus_web::launch(app);
}
static APP: Component = |cx| {
fn app(cx: Scope) -> Element {
cx.render(rsx! {
Router {
onchange: move |route| log::info!("route changed to {}", route),
Route { to: "/", Home {} }
Route { to: "blog"
Route { to: "/", BlogList {} }
Route { to: ":id", BlogPost {} }
h1 { "Your app here" }
ul {
Link { to: "/", li { "home" }}
Link { to: "/blog", li { "blog" }}
Link { to: "/blog/tim", li { "tims' blog" }}
Link { to: "/blog/bill", li { "bills' blog" }}
Link { to: "/apples", li { "go to apples" }}
}
Route { to: "/", Home {} }
Route { to: "/blog/", BlogList {} }
Route { to: "/blog/:id/", BlogPost {} }
Route { to: "/oranges", "Oranges are not apples!" }
Redirect { from: "/apples", to: "/oranges" }
}
})
};
}
fn Home(cx: Scope) -> Element {
cx.render(rsx! {
@ -37,6 +44,9 @@ fn BlogList(cx: Scope) -> Element {
}
fn BlogPost(cx: Scope) -> Element {
let id = use_route(&cx).segment::<usize>("id")?;
let id = use_route(&cx).segment("id")?;
log::debug!("rendering blog post {}", id);
cx.render(rsx! { div { "{id:?}" } })
}

4
packages/router/src/cfg.rs Normal file
View file

@ -0,0 +1,4 @@
#[derive(Default)]
pub struct RouterCfg {
pub base_url: Option<String>,
}

145
packages/router/src/components/link.rs
View file

@ -1,97 +1,116 @@
use crate::RouterService;
use dioxus::Attribute;
use std::sync::Arc;
use crate::RouterCore;
use dioxus_core as dioxus;
use dioxus_core::prelude::*;
use dioxus_core_macro::{format_args_f, rsx, Props};
use dioxus_html as dioxus_elements;
/// Props for the [`Link`](struct.Link.html) component.
#[derive(Props)]
pub struct LinkProps<'a> {
to: &'a str,
/// The url that gets pushed to the history stack
///
/// You can either put in your own inline method or just autoderive the route using `derive(Routable)`
/// The route to link to. This can be a relative path, or a full URL.
///
/// ```rust, ignore
/// // Absolute path
/// Link { to: "/home", "Go Home" }
///
/// Link { to: Route::Home, href: |_| "home".to_string() }
///
/// // or
///
/// Link { to: Route::Home, href: Route::as_url }
///
/// // Relative path
/// Link { to: "../", "Go Up" }
/// ```
#[props(default, strip_option)]
href: Option<&'a str>,
pub to: &'a str,
/// Set the class of the inner link ['a'](https://www.w3schools.com/tags/tag_a.asp) element.
///
/// This can be useful when styling the inner link element.
#[props(default, strip_option)]
class: Option<&'a str>,
pub class: Option<&'a str>,
/// Set the ID of the inner link ['a'](https://www.w3schools.com/tags/tag_a.asp) element.
///
/// This can be useful when styling the inner link element.
#[props(default, strip_option)]
id: Option<&'a str>,
pub id: Option<&'a str>,
/// Set the title of the window after the link is clicked..
#[props(default, strip_option)]
title: Option<&'a str>,
pub title: Option<&'a str>,
/// Autodetect if a link is external or not.
///
/// This is automatically set to `true` and will use http/https detection
#[props(default = true)]
autodetect: bool,
pub autodetect: bool,
/// Is this link an external link?
#[props(default = false)]
external: bool,
pub external: bool,
/// New tab?
#[props(default = false)]
new_tab: bool,
pub new_tab: bool,
children: Element<'a>,
#[props(default)]
attributes: Option<&'a [Attribute<'a>]>,
/// Pass children into the `<a>` element
pub children: Element<'a>,
}
/// A component that renders a link to a route.
///
/// `Link` components are just [`<a>`](https://www.w3schools.com/tags/tag_a.asp) elements
/// that link to different pages *within* your single-page app.
///
/// If you need to link to a resource outside of your app, then just use a regular
/// `<a>` element directly.
///
/// # Examples
///
/// ```rust, ignore
/// fn Header(cx: Scope) -> Element {
/// cx.render(rsx!{
/// Link { to: "/home", "Go Home" }
/// })
/// }
/// ```
pub fn Link<'a>(cx: Scope<'a, LinkProps<'a>>) -> Element {
if let Some(service) = cx.consume_context::<RouterService>() {
let LinkProps {
to,
href,
class,
id,
title,
autodetect,
external,
new_tab,
children,
..
} = cx.props;
let svc = cx.use_hook(|_| cx.consume_context::<Arc<RouterCore>>());
let is_http = to.starts_with("http") || to.starts_with("https");
let outerlink = (*autodetect && is_http) || *external;
let LinkProps {
to,
class,
id,
title,
autodetect,
external,
new_tab,
children,
..
} = cx.props;
let prevent_default = if outerlink { "" } else { "onclick" };
let is_http = to.starts_with("http") || to.starts_with("https");
let outerlink = (*autodetect && is_http) || *external;
let prevent_default = if outerlink { "" } else { "onclick" };
return cx.render(rsx! {
a {
href: "{to}",
class: format_args!("{}", class.unwrap_or("")),
id: format_args!("{}", id.unwrap_or("")),
title: format_args!("{}", title.unwrap_or("")),
prevent_default: "{prevent_default}",
target: format_args!("{}", if *new_tab { "_blank" } else { "" }),
onclick: move |_| {
if !outerlink {
service.push_route(to);
cx.render(rsx! {
a {
href: "{to}",
class: format_args!("{}", class.unwrap_or("")),
id: format_args!("{}", id.unwrap_or("")),
title: format_args!("{}", title.unwrap_or("")),
prevent_default: "{prevent_default}",
target: format_args!("{}", if *new_tab { "_blank" } else { "" }),
onclick: move |_| {
if !outerlink {
if let Some(service) = svc {
service.push_route(to, cx.props.title.map(|f| f.to_string()), None);
} else {
log::error!(
"Attempted to create a Link to {} outside of a Router context",
cx.props.to,
);
}
},
&cx.props.children
}
});
}
log::warn!(
"Attempted to create a Link to {} outside of a Router context",
cx.props.to,
);
None
}
},
children
}
})
}

54
packages/router/src/components/redirect.rs Normal file
View file

@ -0,0 +1,54 @@
use dioxus_core as dioxus;
use dioxus_core::prelude::*;
use dioxus_core_macro::Props;
use crate::use_router;
/// The props for the [`Router`](fn.Router.html) component.
#[derive(Props)]
pub struct RedirectProps<'a> {
/// The route to link to. This can be a relative path, or a full URL.
///
/// ```rust, ignore
/// // Absolute path
/// Redirect { from: "", to: "/home" }
///
/// // Relative path
/// Redirect { from: "", to: "../" }
/// ```
pub to: &'a str,
/// The route to link from. This can be a relative path, or a full URL.
///
/// ```rust, ignore
/// // Absolute path
/// Redirect { from: "", to: "/home" }
///
/// // Relative path
/// Redirect { from: "", to: "../" }
/// ```
#[props(optional)]
pub from: Option<&'a str>,
}
/// If this component is rendered, it will redirect the user to the given route.
///
/// It will replace the current route rather than pushing the current one to the stack.
pub fn Redirect<'a>(cx: Scope<'a, RedirectProps<'a>>) -> Element {
let router = use_router(&cx);
let immediate_redirect = cx.use_hook(|_| {
if let Some(from) = cx.props.from {
router.register_total_route(from.to_string(), cx.scope_id());
false
} else {
true
}
});
if *immediate_redirect || router.should_render(cx.scope_id()) {
router.replace_route(cx.props.to, None, None);
}
None
}

54
packages/router/src/components/route.rs
View file

@ -1,4 +1,4 @@
use dioxus_core::Element;
use std::sync::Arc;
use dioxus_core as dioxus;
use dioxus_core::prelude::*;
@ -6,31 +6,42 @@ use dioxus_core_macro::Props;
use dioxus_core_macro::*;
use dioxus_html as dioxus_elements;
use crate::{RouteContext, RouterService};
use crate::{RouteContext, RouterCore};
/// Props for the [`Route`](struct.Route.html) component.
#[derive(Props)]
pub struct RouteProps<'a> {
to: &'a str,
/// The path to match.
pub to: &'a str,
children: Element<'a>,
#[props(default)]
fallback: bool,
/// The component to render when the path matches.
pub children: Element<'a>,
}
/// A component that conditionally renders children based on the current location.
///
/// # Example
///
///```rust, ignore
/// rsx!(
/// Router {
/// Route { to: "/home", Home {} }
/// Route { to: "/about", About {} }
/// Route { to: "/Blog", Blog {} }
/// }
/// )
/// ```
pub fn Route<'a>(cx: Scope<'a, RouteProps<'a>>) -> Element {
// now we want to submit
let router_root = cx
.use_hook(|_| cx.consume_context::<RouterService>())
.use_hook(|_| cx.consume_context::<Arc<RouterCore>>())
.as_ref()?;
cx.use_hook(|_| {
// create a bigger, better, longer route if one above us exists
let total_route = match cx.consume_context::<RouteContext>() {
Some(ctx) => ctx.total_route.to_string(),
Some(ctx) => ctx.total_route,
None => cx.props.to.to_string(),
};
// log::trace!("total route for {} is {}", cx.props.to, total_route);
// provide our route context
let route_context = cx.provide_context(RouteContext {
@ -39,28 +50,15 @@ pub fn Route<'a>(cx: Scope<'a, RouteProps<'a>>) -> Element {
});
// submit our rout
router_root.register_total_route(
route_context.total_route.clone(),
cx.scope_id(),
cx.props.fallback,
);
Some(RouteInner {})
router_root.register_total_route(route_context.total_route, cx.scope_id());
});
// log::trace!("Checking route {}", cx.props.to);
log::debug!("Checking Route: {:?}", cx.props.to);
if router_root.should_render(cx.scope_id()) {
log::debug!("Route should render: {:?}", cx.scope_id());
cx.render(rsx!(&cx.props.children))
} else {
log::debug!("Route should *not* render: {:?}", cx.scope_id());
None
}
}
struct RouteInner {}
impl Drop for RouteInner {
fn drop(&mut self) {
// todo!()
}
}

116
packages/router/src/components/router.rs
View file

@ -1,35 +1,119 @@
use dioxus_core::Element;
use crate::ParsedRoute;
use crate::{cfg::RouterCfg, RouteEvent, RouterCore};
use dioxus_core as dioxus;
use dioxus_core::prelude::*;
use dioxus_core_macro::*;
use dioxus_html as dioxus_elements;
use futures_util::stream::StreamExt;
use std::sync::Arc;
use crate::RouterService;
/// The props for the [`Router`](fn.Router.html) component.
#[derive(Props)]
pub struct RouterProps<'a> {
children: Element<'a>,
/// The routes and elements that should be rendered when the path matches.
///
/// If elements are not contained within Routes, the will be rendered
/// regardless of the path.
pub children: Element<'a>,
/// The URL to point at
///
/// This will be used to trim any latent segments from the URL when your app is
/// not deployed to the root of the domain.
#[props(optional)]
pub base_url: Option<&'a str>,
/// Hook into the router when the route is changed.
///
/// This lets you easily implement redirects
#[props(default)]
onchange: EventHandler<'a, String>,
pub onchange: EventHandler<'a, Arc<RouterCore>>,
}
/// A component that conditionally renders children based on the current location of the app.
///
/// Uses BrowserRouter in the browser and HashRouter everywhere else.
///
/// Will fallback to HashRouter is BrowserRouter is not available, or through configuration.
#[allow(non_snake_case)]
pub fn Router<'a>(cx: Scope<'a, RouterProps<'a>>) -> Element {
log::debug!("running router {:?}", cx.scope_id());
let svc = cx.use_hook(|_| {
let update = cx.schedule_update_any();
cx.provide_context(RouterService::new(update, cx.scope_id()))
let (tx, mut rx) = futures_channel::mpsc::unbounded::<RouteEvent>();
let base_url = cx.props.base_url.map(|s| s.to_string());
let svc = RouterCore::new(tx, RouterCfg { base_url });
cx.spawn({
let svc = svc.clone();
let regen_route = cx.schedule_update_any();
let router_id = cx.scope_id();
async move {
while let Some(msg) = rx.next().await {
match msg {
RouteEvent::Push {
route,
serialized_state,
title,
} => {
let new_route = Arc::new(ParsedRoute {
url: svc.current_location().url.join(&route).ok().unwrap(),
title,
serialized_state,
});
svc.history.push(&new_route);
svc.stack.borrow_mut().push(new_route);
}
RouteEvent::Replace {
route,
title,
serialized_state,
} => {
let new_route = Arc::new(ParsedRoute {
url: svc.current_location().url.join(&route).ok().unwrap(),
title,
serialized_state,
});
svc.history.replace(&new_route);
*svc.stack.borrow_mut().last_mut().unwrap() = new_route;
}
RouteEvent::Pop => {
let mut stack = svc.stack.borrow_mut();
if stack.len() == 1 {
continue;
}
stack.pop();
}
}
svc.route_found.set(None);
regen_route(router_id);
for listener in svc.onchange_listeners.borrow().iter() {
regen_route(*listener);
}
for route in svc.slots.borrow().keys() {
regen_route(*route);
}
}
}
});
cx.provide_context(svc)
});
let any_pending = svc.pending_events.borrow().len() > 0;
svc.pending_events.borrow_mut().clear();
if any_pending {
let location = svc.current_location();
let path = location.path();
cx.props.onchange.call(path.to_string());
// next time we run the rout_found will be filled
if svc.route_found.get().is_none() {
cx.props.onchange.call(svc.clone());
}
cx.render(rsx!(&cx.props.children))

0
packages/router/src/platform/desktop.rs → packages/router/src/error.rs
View file

157
packages/router/src/hooks/use_route.rs
View file

@ -1,94 +1,109 @@
use crate::{ParsedRoute, RouteContext, RouterCore, RouterService};
use dioxus_core::{ScopeId, ScopeState};
use gloo::history::{HistoryResult, Location};
use serde::de::DeserializeOwned;
use std::{rc::Rc, str::FromStr};
use std::{borrow::Cow, str::FromStr, sync::Arc};
use url::Url;
use crate::RouterService;
/// This hook provides access to information about the current location in the
/// context of a [`Router`]. If this function is called outside of a `Router`
/// component it will panic.
pub fn use_route(cx: &ScopeState) -> &UseRoute {
let handle = cx.use_hook(|_| {
let router = cx
.consume_context::<RouterService>()
.expect("Cannot call use_route outside the scope of a Router component");
/// This struct provides is a wrapper around the internal router
/// implementation, with methods for getting information about the current
/// route.
#[derive(Clone)]
let route_context = cx
.consume_context::<RouteContext>()
.expect("Cannot call use_route outside the scope of a Router component");
router.subscribe_onchange(cx.scope_id());
UseRouteListener {
state: UseRoute {
route_context,
route: router.current_location(),
},
router,
scope: cx.scope_id(),
}
});
handle.state.route = handle.router.current_location();
&handle.state
}
/// A handle to the current location of the router.
pub struct UseRoute {
router: Rc<RouterService>,
pub(crate) route: Arc<ParsedRoute>,
pub(crate) route_context: RouteContext,
}
impl UseRoute {
/// This method simply calls the [`Location::query`] method.
pub fn query<T>(&self) -> HistoryResult<T>
where
T: DeserializeOwned,
{
self.current_location().query::<T>()
/// Get the underlying [`Url`] of the current location.
pub fn url(&self) -> &Url {
&self.route.url
}
/// Get the first query parameter given the parameter name.
///
/// If you need to get more than one parameter, use [`query_pairs`] on the [`Url`] instead.
#[cfg(feature = "query")]
pub fn query<T: serde::de::DeserializeOwned>(&self) -> Option<T> {
let query = self.url().query()?;
serde_urlencoded::from_str(query.strip_prefix('?').unwrap_or("")).ok()
}
/// Get the first query parameter given the parameter name.
///
/// If you need to get more than one parameter, use [`query_pairs`] on the [`Url`] instead.
pub fn query_param(&self, param: &str) -> Option<Cow<str>> {
self.route
.url
.query_pairs()
.find(|(k, _)| k == param)
.map(|(_, v)| v)
}
/// Returns the nth segment in the path. Paths that end with a slash have
/// the slash removed before determining the segments. If the path has
/// fewer segments than `n` then this method returns `None`.
pub fn nth_segment(&self, n: usize) -> Option<String> {
let mut segments = self.path_segments();
let len = segments.len();
if len - 1 < n {
return None;
}
Some(segments.remove(n))
pub fn nth_segment(&self, n: usize) -> Option<&str> {
self.route.url.path_segments()?.nth(n)
}
/// Returns the last segment in the path. Paths that end with a slash have
/// the slash removed before determining the segments. The root path, `/`,
/// will return an empty string.
pub fn last_segment(&self) -> String {
let mut segments = self.path_segments();
segments.remove(segments.len() - 1)
pub fn last_segment(&self) -> Option<&str> {
self.route.url.path_segments()?.last()
}
/// Get the named parameter from the path, as defined in your router. The
/// value will be parsed into the type specified by `T` by calling
/// `value.parse::<T>()`. This method returns `None` if the named
/// parameter does not exist in the current path.
pub fn segment<T>(&self, name: &str) -> Option<Result<T, T::Err>>
pub fn segment(&self, name: &str) -> Option<&str> {
let index = self
.route_context
.total_route
.trim_start_matches('/')
.split('/')
.position(|segment| segment.starts_with(':') && &segment[1..] == name)?;
self.route.url.path_segments()?.nth(index)
}
/// Get the named parameter from the path, as defined in your router. The
/// value will be parsed into the type specified by `T` by calling
/// `value.parse::<T>()`. This method returns `None` if the named
/// parameter does not exist in the current path.
pub fn parse_segment<T>(&self, name: &str) -> Option<Result<T, T::Err>>
where
T: FromStr,
{
self.router
.current_path_params()
.get(name)
.and_then(|v| Some(v.parse::<T>()))
self.segment(name).map(|value| value.parse::<T>())
}
/// Returns the [Location] for the current route.
pub fn current_location(&self) -> Location {
self.router.current_location()
}
fn path_segments(&self) -> Vec<String> {
let location = self.router.current_location();
let path = location.path();
if path == "/" {
return vec![String::new()];
}
let stripped = &location.path()[1..];
stripped.split('/').map(str::to_string).collect::<Vec<_>>()
}
}
/// This hook provides access to information about the current location in the
/// context of a [`Router`]. If this function is called outside of a `Router`
/// component it will panic.
pub fn use_route(cx: &ScopeState) -> &UseRoute {
&cx.use_hook(|_| {
let router = cx
.consume_context::<RouterService>()
.expect("Cannot call use_route outside the scope of a Router component");
router.subscribe_onchange(cx.scope_id());
UseRouteListener {
router: UseRoute { router },
scope: cx.scope_id(),
}
})
.router
}
// The entire purpose of this struct is to unubscribe this component when it is unmounted.
@ -96,19 +111,13 @@ pub fn use_route(cx: &ScopeState) -> &UseRoute {
// Instead, we hide the drop implementation on this private type exclusive to the hook,
// and reveal our cached version of UseRoute to the component.
struct UseRouteListener {
router: UseRoute,
state: UseRoute,
router: Arc<RouterCore>,
scope: ScopeId,
}
impl Drop for UseRouteListener {
fn drop(&mut self) {
self.router.router.unsubscribe_onchange(self.scope)
self.router.unsubscribe_onchange(self.scope)
}
}
/// This hook provides access to the `RouterService` for the app.
pub fn use_router(cx: &ScopeState) -> &Rc<RouterService> {
cx.use_hook(|_| {
cx.consume_context::<RouterService>()
.expect("Cannot call use_route outside the scope of a Router component")
})
}

10
packages/router/src/hooks/use_router.rs Normal file
View file

@ -0,0 +1,10 @@
use crate::RouterService;
use dioxus_core::ScopeState;
/// This hook provides access to the `RouterService` for the app.
pub fn use_router(cx: &ScopeState) -> &RouterService {
cx.use_hook(|_| {
cx.consume_context::<RouterService>()
.expect("Cannot call use_route outside the scope of a Router component")
})
}

33
packages/router/src/lib.rs
View file

@ -1,41 +1,32 @@
#![allow(warnings)]
//! Dioxus-Router
//!
//! A simple match-based router and router service for most routing needs.
//!
//! Dioxus-Router is not a *declarative* router. Instead it uses a simple parse-match
//! pattern which can be derived via a macro.
//!
//! ```rust
//! fn app(cx: Scope) -> Element {
//!
//! }
//! ```
#![doc = include_str!("../README.md")]
#![warn(missing_docs)]
mod hooks {
mod use_route;
mod use_router;
pub use use_route::*;
pub use use_router::*;
}
pub use hooks::*;
mod components {
#![allow(non_snake_case)]
mod router;
pub use router::*;
mod route;
pub use route::*;
mod link;
mod redirect;
mod route;
mod router;
pub use link::*;
pub use redirect::*;
pub use route::*;
pub use router::*;
}
pub use components::*;
mod platform;
mod cfg;
mod routecontext;
mod service;
mod utils;
pub use routecontext::*;
pub use service::*;

0
packages/router/src/platform/mobile.rs
View file

4
packages/router/src/platform/mod.rs
View file

@ -1,4 +0,0 @@
pub trait RouterProvider {
fn get_current_route(&self) -> String;
fn listen(&self, callback: Box<dyn Fn()>);
}

125
packages/router/src/platform/web.rs
View file

@ -1,125 +0,0 @@
use web_sys::{window, Event};
pub struct RouterService<R: Routable> {
historic_routes: Vec<R>,
history_service: RefCell<web_sys::History>,
base_ur: RefCell<Option<String>>,
}
impl<R: Routable> RouterService<R> {
fn push_route(&self, r: R) {
todo!()
// self.historic_routes.borrow_mut().push(r);
}
fn get_current_route(&self) -> &str {
todo!()
}
fn update_route_impl(&self, url: String, push: bool) {
let history = web_sys::window().unwrap().history().expect("no history");
let base = self.base_ur.borrow();
let path = match base.as_ref() {
Some(base) => {
let path = format!("{}{}", base, url);
if path.is_empty() {
"/".to_string()
} else {
path
}
}
None => url,
};
if push {
history
.push_state_with_url(&JsValue::NULL, "", Some(&path))
.expect("push history");
} else {
history
.replace_state_with_url(&JsValue::NULL, "", Some(&path))
.expect("replace history");
}
let event = Event::new("popstate").unwrap();
web_sys::window()
.unwrap()
.dispatch_event(&event)
.expect("dispatch");
}
}
pub fn use_router_service<R: Routable>(cx: &ScopeState) -> Option<&Rc<RouterService<R>>> {
cx.use_hook(|_| cx.consume_state::<RouterService<R>>())
.as_ref()
}
/// This hould only be used once per app
///
/// You can manually parse the route if you want, but the derived `parse` method on `Routable` will also work just fine
pub fn use_router<R: Routable>(cx: &ScopeState, mut parse: impl FnMut(&str) -> R + 'static) -> &R {
// for the web, attach to the history api
let state = cx.use_hook(
#[cfg(not(feature = "web"))]
|_| {},
#[cfg(feature = "web")]
|f| {
//
use gloo::events::EventListener;
let base = window()
.unwrap()
.document()
.unwrap()
.query_selector("base[href]")
.ok()
.flatten()
.and_then(|base| {
let base = JsCast::unchecked_into::<web_sys::HtmlBaseElement>(base).href();
let url = web_sys::Url::new(&base).unwrap();
if url.pathname() != "/" {
Some(strip_slash_suffix(&base).to_string())
} else {
None
}
});
let location = window().unwrap().location();
let pathname = location.pathname().unwrap();
let initial_route = parse(&pathname);
let service: RouterService<R> = RouterService {
historic_routes: vec![initial_route],
history_service: RefCell::new(
web_sys::window().unwrap().history().expect("no history"),
),
base_ur: RefCell::new(base),
};
// let base = base_url();
// let url = route.to_path();
// pending_routes: RefCell::new(vec![]),
// service.history_service.push_state(data, title);
// cx.provide_state(service);
let regenerate = cx.schedule_update();
// // when "back" is called by the user, we want to to re-render the component
let listener = EventListener::new(&web_sys::window().unwrap(), "popstate", move |_| {
//
regenerate();
});
service
},
);
let base = state.base_ur.borrow();
if let Some(base) = base.as_ref() {
let path = format!("{}{}", base, state.get_current_route());
}
let history = state.history_service.borrow();
state.historic_routes.last().unwrap()
}

21
packages/router/src/routecontext.rs
View file

@ -1,7 +1,24 @@
/// A `RouteContext` is a context that is provided by [`Route`](fn.Route.html) components.
///
/// This signals to all child [`Route`] and [`Link`] components that they are
/// currently nested under this route.
#[derive(Debug, Clone)]
pub struct RouteContext {
// "/name/:id"
/// The `declared_route` is the sub-piece of the route that matches this pattern.
///
///
/// It follows this pattern:
/// ```ignore
/// "name/:id"
/// ```
pub declared_route: String,
// "app/name/:id"
/// The `total_route` is the full route that matches this pattern.
///
///
/// It follows this pattern:
/// ```ignore
/// "/level0/level1/:id"
/// ```
pub total_route: String,
}

422
packages/router/src/service.rs
View file

@ -1,153 +1,197 @@
use gloo::history::{BrowserHistory, History, HistoryListener, Location};
// todo: how does router work in multi-window contexts?
// does each window have its own router? probably, lol
use crate::cfg::RouterCfg;
use dioxus_core::ScopeId;
use futures_channel::mpsc::UnboundedSender;
use std::any::Any;
use std::{
cell::{Cell, Ref, RefCell},
cell::{Cell, RefCell},
collections::{HashMap, HashSet},
rc::Rc,
sync::Arc,
};
use url::Url;
use dioxus_core::ScopeId;
/// An abstraction over the platform's history API.
///
/// The history is denoted using web-like semantics, with forward slashes delmitiing
/// routes and question marks denoting optional parameters.
///
/// This RouterService is exposed so you can modify the history directly. It
/// does not provide a high-level ergonomic API for your components. Instead,
/// you should consider using the components and hooks instead.
/// - [`Route`](struct.Route.html)
/// - [`Link`](struct.Link.html)
/// - [`UseRoute`](struct.UseRoute.html)
/// - [`Router`](struct.Router.html)
///
///
/// # Example
///
/// ```rust, ignore
/// let router = Router::new();
/// router.push_route("/home/custom");
/// cx.provide_context(router);
/// ```
///
/// # Platform Specific
///
/// - On the web, this is a [`BrowserHistory`](https://docs.rs/gloo/0.3.0/gloo/history/struct.BrowserHistory.html).
/// - On desktop, mobile, and SSR, this is just a Vec of Strings. Currently on
/// desktop, there is no way to tap into forward/back for the app unless explicitly set.
pub struct RouterCore {
pub(crate) route_found: Cell<Option<ScopeId>>,
use crate::platform::RouterProvider;
pub(crate) stack: RefCell<Vec<Arc<ParsedRoute>>>,
pub struct RouterService {
pub(crate) regen_route: Arc<dyn Fn(ScopeId)>,
pub(crate) pending_events: Rc<RefCell<Vec<RouteEvent>>>,
slots: Rc<RefCell<Vec<(ScopeId, String)>>>,
onchange_listeners: Rc<RefCell<HashSet<ScopeId>>>,
root_found: Rc<Cell<Option<ScopeId>>>,
cur_path_params: Rc<RefCell<HashMap<String, String>>>,
pub(crate) tx: UnboundedSender<RouteEvent>,
// history: Rc<dyn RouterProvider>,
history: Rc<RefCell<BrowserHistory>>,
listener: HistoryListener,
pub(crate) slots: Rc<RefCell<HashMap<ScopeId, String>>>,
pub(crate) onchange_listeners: Rc<RefCell<HashSet<ScopeId>>>,
pub(crate) history: Box<dyn RouterProvider>,
pub(crate) cfg: RouterCfg,
}
pub enum RouteEvent {
Change,
Pop,
Push,
/// A shared type for the RouterCore.
pub type RouterService = Arc<RouterCore>;
/// A route is a combination of window title, saved state, and a URL.
#[derive(Debug, Clone)]
pub struct ParsedRoute {
/// The URL of the route.
pub url: Url,
/// The title of the route.
pub title: Option<String>,
/// The serialized state of the route.
pub serialized_state: Option<String>,
}
enum RouteSlot {
Routes {
// the partial route
partial: String,
// the total route
total: String,
// Connections to other routs
rest: Vec<RouteSlot>,
#[derive(Debug)]
pub(crate) enum RouteEvent {
Push {
route: String,
title: Option<String>,
serialized_state: Option<String>,
},
Replace {
route: String,
title: Option<String>,
serialized_state: Option<String>,
},
Pop,
}
impl RouterService {
pub fn new(regen_route: Arc<dyn Fn(ScopeId)>, root_scope: ScopeId) -> Self {
let history = BrowserHistory::default();
let location = history.location();
let path = location.path();
impl RouterCore {
pub(crate) fn new(tx: UnboundedSender<RouteEvent>, cfg: RouterCfg) -> Arc<Self> {
#[cfg(feature = "web")]
let history = Box::new(web::new(tx.clone()));
let onchange_listeners = Rc::new(RefCell::new(HashSet::new()));
let slots: Rc<RefCell<Vec<(ScopeId, String)>>> = Default::default();
let pending_events: Rc<RefCell<Vec<RouteEvent>>> = Default::default();
let root_found = Rc::new(Cell::new(None));
#[cfg(not(feature = "web"))]
let history = Box::new(hash::new());
let listener = history.listen({
let pending_events = pending_events.clone();
let regen_route = regen_route.clone();
let root_found = root_found.clone();
let slots = slots.clone();
let onchange_listeners = onchange_listeners.clone();
move || {
root_found.set(None);
// checking if the route is valid is cheap, so we do it
for (slot, root) in slots.borrow_mut().iter().rev() {
regen_route(*slot);
}
let route = Arc::new(history.init_location());
for listener in onchange_listeners.borrow_mut().iter() {
regen_route(*listener);
}
Arc::new(Self {
cfg,
tx,
route_found: Cell::new(None),
stack: RefCell::new(vec![route]),
slots: Default::default(),
onchange_listeners: Default::default(),
history,
})
}
// also regenerate the root
regen_route(root_scope);
pending_events.borrow_mut().push(RouteEvent::Change)
}
/// Push a new route to the history.
///
/// This will trigger a route change event.
///
/// This does not modify the current route
pub fn push_route(&self, route: &str, title: Option<String>, serialized_state: Option<String>) {
let _ = self.tx.unbounded_send(RouteEvent::Push {
route: route.to_string(),
title,
serialized_state,
});
Self {
listener,
root_found,
history: Rc::new(RefCell::new(history)),
regen_route,
slots,
pending_events,
onchange_listeners,
cur_path_params: Rc::new(RefCell::new(HashMap::new())),
}
}
pub fn push_route(&self, route: &str) {
self.history.borrow_mut().push(route);
/// Pop the current route from the history.
pub fn pop_route(&self) {
let _ = self.tx.unbounded_send(RouteEvent::Pop);
}
pub fn register_total_route(&self, route: String, scope: ScopeId, fallback: bool) {
let clean = clean_route(route);
self.slots.borrow_mut().push((scope, clean));
/// Instead of pushing a new route, replaces the current route.
pub fn replace_route(
&self,
route: &str,
title: Option<String>,
serialized_state: Option<String>,
) {
let _ = self.tx.unbounded_send(RouteEvent::Replace {
route: route.to_string(),
title,
serialized_state,
});
}
pub fn should_render(&self, scope: ScopeId) -> bool {
if let Some(root_id) = self.root_found.get() {
if root_id == scope {
return true;
}
return false;
}
let location = self.history.borrow().location();
let path = location.path();
let roots = self.slots.borrow();
let root = roots.iter().find(|(id, route)| id == &scope);
// fallback logic
match root {
Some((id, route)) => {
if let Some(params) = route_matches_path(route, path) {
self.root_found.set(Some(*id));
*self.cur_path_params.borrow_mut() = params;
true
} else {
if route == "" {
self.root_found.set(Some(*id));
true
} else {
false
}
}
}
None => false,
}
/// Get the current location of the Router
pub fn current_location(&self) -> Arc<ParsedRoute> {
self.stack.borrow().last().unwrap().clone()
}
pub fn current_location(&self) -> Location {
self.history.borrow().location().clone()
}
pub fn current_path_params(&self) -> Ref<HashMap<String, String>> {
self.cur_path_params.borrow()
/// Get the current native location of the Router
pub fn native_location<T: 'static>(&self) -> Option<Box<T>> {
self.history.native_location().downcast::<T>().ok()
}
/// Registers a scope to regenerate on route change.
///
/// This is useful if you've built some abstraction on top of the router service.
pub fn subscribe_onchange(&self, id: ScopeId) {
self.onchange_listeners.borrow_mut().insert(id);
}
/// Unregisters a scope to regenerate on route change.
///
/// This is useful if you've built some abstraction on top of the router service.
pub fn unsubscribe_onchange(&self, id: ScopeId) {
self.onchange_listeners.borrow_mut().remove(&id);
}
pub(crate) fn register_total_route(&self, route: String, scope: ScopeId) {
let clean = clean_route(route);
self.slots.borrow_mut().insert(scope, clean);
}
pub(crate) fn should_render(&self, scope: ScopeId) -> bool {
if let Some(root_id) = self.route_found.get() {
return root_id == scope;
}
let roots = self.slots.borrow();
if let Some(route) = roots.get(&scope) {
if route_matches_path(
&self.current_location().url,
route,
self.cfg.base_url.as_ref(),
) || route.is_empty()
{
self.route_found.set(Some(scope));
true
} else {
false
}
} else {
false
}
}
}
fn clean_route(route: String) -> String {
@ -161,41 +205,159 @@ fn clean_path(path: &str) -> &str {
if path == "/" {
return path;
}
path.trim_end_matches('/')
let sub = path.trim_end_matches('/');
if sub.starts_with('/') {
&path[1..]
} else {
sub
}
}
fn route_matches_path(route: &str, path: &str) -> Option<HashMap<String, String>> {
let route_pieces = route.split('/').collect::<Vec<_>>();
let path_pieces = clean_path(path).split('/').collect::<Vec<_>>();
fn route_matches_path(cur: &Url, attempt: &str, base_url: Option<&String>) -> bool {
let cur_piece_iter = cur.path_segments().unwrap();
if route_pieces.len() != path_pieces.len() {
return None;
let cur_pieces = match base_url {
// baseurl is naive right now and doesn't support multiple nesting levels
Some(_) => cur_piece_iter.skip(1).collect::<Vec<_>>(),
None => cur_piece_iter.collect::<Vec<_>>(),
};
let attempt_pieces = clean_path(attempt).split('/').collect::<Vec<_>>();
if attempt == "/" && cur_pieces.len() == 1 && cur_pieces[0].is_empty() {
return true;
}
let mut matches = HashMap::new();
for (i, r) in route_pieces.iter().enumerate() {
if attempt_pieces.len() != cur_pieces.len() {
return false;
}
for (i, r) in attempt_pieces.iter().enumerate() {
// If this is a parameter then it matches as long as there's
// _any_thing in that spot in the path.
if r.starts_with(':') {
let param = &r[1..];
matches.insert(param.to_string(), path_pieces[i].to_string());
continue;
}
if path_pieces[i] != *r {
return None;
if cur_pieces[i] != *r {
return false;
}
}
Some(matches)
true
}
pub struct RouterCfg {
initial_route: String,
pub(crate) trait RouterProvider {
fn push(&self, route: &ParsedRoute);
fn replace(&self, route: &ParsedRoute);
fn native_location(&self) -> Box<dyn Any>;
fn init_location(&self) -> ParsedRoute;
}
impl RouterCfg {
pub fn new(initial_route: String) -> Self {
Self { initial_route }
#[cfg(not(feature = "web"))]
mod hash {
use super::*;
pub fn new() -> HashRouter {
HashRouter {}
}
/// a simple cross-platform hash-based router
pub struct HashRouter {}
impl RouterProvider for HashRouter {
fn push(&self, _route: &ParsedRoute) {}
fn native_location(&self) -> Box<dyn Any> {
Box::new(())
}
fn init_location(&self) -> ParsedRoute {
ParsedRoute {
url: Url::parse("app:///").unwrap(),
title: None,
serialized_state: None,
}
}
fn replace(&self, _route: &ParsedRoute) {}
}
}
#[cfg(feature = "web")]
mod web {
use super::RouterProvider;
use crate::{ParsedRoute, RouteEvent};
use futures_channel::mpsc::UnboundedSender;
use gloo_events::EventListener;
use std::any::Any;
use web_sys::History;
pub struct WebRouter {
// keep it around so it drops when the router is dropped
_listener: gloo_events::EventListener,
window: web_sys::Window,
history: History,
}
impl RouterProvider for WebRouter {
fn push(&self, route: &ParsedRoute) {
let ParsedRoute {
url,
title,
serialized_state,
} = route;
let _ = self.history.push_state_with_url(
&wasm_bindgen::JsValue::from_str(serialized_state.as_deref().unwrap_or("")),
title.as_deref().unwrap_or(""),
Some(url.as_str()),
);
}
fn replace(&self, route: &ParsedRoute) {
let ParsedRoute {
url,
title,
serialized_state,
} = route;
let _ = self.history.replace_state_with_url(
&wasm_bindgen::JsValue::from_str(serialized_state.as_deref().unwrap_or("")),
title.as_deref().unwrap_or(""),
Some(url.as_str()),
);
}
fn native_location(&self) -> Box<dyn Any> {
Box::new(self.window.location())
}
fn init_location(&self) -> ParsedRoute {
ParsedRoute {
url: url::Url::parse(&web_sys::window().unwrap().location().href().unwrap())
.unwrap(),
title: web_sys::window()
.unwrap()
.document()
.unwrap()
.title()
.into(),
serialized_state: None,
}
}
}
pub(crate) fn new(tx: UnboundedSender<RouteEvent>) -> WebRouter {
WebRouter {
history: web_sys::window().unwrap().history().unwrap(),
window: web_sys::window().unwrap(),
_listener: EventListener::new(&web_sys::window().unwrap(), "popstate", move |_| {
let _ = tx.unbounded_send(RouteEvent::Pop);
}),
}
}
}

6
packages/router/src/utils.rs
View file

@ -1,6 +0,0 @@
// use wasm_bindgen::JsCast;
// use web_sys::window;
pub(crate) fn strip_slash_suffix(path: &str) -> &str {
path.strip_suffix('/').unwrap_or(path)
}

30
packages/router/tests/ssr_router.rs Normal file
View file

@ -0,0 +1,30 @@
#![allow(non_snake_case)]
use dioxus_core::prelude::*;
use dioxus_core_macro::*;
use dioxus_html as dioxus_elements;
use dioxus_router::*;
#[test]
fn generates_without_error() {
let mut app = VirtualDom::new(app);
app.rebuild();
let out = dioxus_ssr::render_vdom(&app);
assert_eq!(out, "<nav>navbar</nav>default<!--placeholder-->");
}
fn app(cx: Scope) -> Element {
cx.render(rsx! {
Router {
nav { "navbar" }
Route { to: "/", "default" }
Route { to: "/home", Home {} }
}
})
}
fn Home(cx: Scope) -> Element {
cx.render(rsx! { h1 { "Home" } })
}

4
packages/router/tests/route.rs → packages/router/tests/web_router.rs
View file

@ -21,7 +21,7 @@ fn simple_test() {
static APP: Component = |cx| {
cx.render(rsx! {
Router {
onchange: move |route| log::info!("route changed to {}", route),
onchange: move |route: RouterService| log::info!("route changed to {:?}", route.current_location()),
Route { to: "/", Home {} }
Route { to: "blog"
Route { to: "/", BlogList {} }
@ -48,7 +48,7 @@ fn simple_test() {
}
fn BlogPost(cx: Scope) -> Element {
let id = use_route(&cx).segment::<usize>("id")?;
let id = use_route(&cx).parse_segment::<usize>("id")?;
cx.render(rsx! {
div {

9
src/lib.rs
View file

@ -20,9 +20,6 @@ pub use dioxus_desktop as desktop;
#[cfg(feature = "fermi")]
pub use fermi;
// #[cfg(feature = "mobile")]
// pub use dioxus_mobile as mobile;
pub mod events {
#[cfg(feature = "html")]
pub use dioxus_html::{on::*, KeyCode};
@ -34,4 +31,10 @@ pub mod prelude {
pub use dioxus_elements::{GlobalAttributes, SvgAttributes};
pub use dioxus_hooks::*;
pub use dioxus_html as dioxus_elements;
#[cfg(feature = "router")]
pub use dioxus_router::{use_route, use_router, Link, Redirect, Router, UseRoute};
#[cfg(feature = "fermi")]
pub use fermi::{use_atom_ref, use_init_atom_root, use_read, use_set, Atom, AtomRef};
}

11
tests/sharedstate.rs
View file

@ -2,6 +2,7 @@
use dioxus::prelude::*;
use dioxus_core::{DomEdit, Mutations, SchedulerMsg, ScopeId};
use std::rc::Rc;
use DomEdit::*;
mod test_logging;
@ -11,12 +12,12 @@ fn shared_state_test() {
struct MySharedState(&'static str);
static App: Component = |cx| {
cx.provide_context(MySharedState("world!"));
cx.provide_context(Rc::new(MySharedState("world!")));
cx.render(rsx!(Child {}))
};
static Child: Component = |cx| {
let shared = cx.consume_context::<MySharedState>()?;
let shared = cx.consume_context::<Rc<MySharedState>>()?;
cx.render(rsx!("Hello, {shared.0}"))
};
@ -40,7 +41,7 @@ fn swap_test() {
let val = cx.use_hook(|_| 0);
*val += 1;
cx.provide_context(MySharedState("world!"));
cx.provide_context(Rc::new(MySharedState("world!")));
let child = match *val % 2 {
0 => rsx!(
@ -71,7 +72,7 @@ fn swap_test() {
#[inline_props]
fn Child1<'a>(cx: Scope, children: Element<'a>) -> Element {
let shared = cx.consume_context::<MySharedState>().unwrap();
let shared = cx.consume_context::<Rc<MySharedState>>().unwrap();
println!("Child1: {}", shared.0);
cx.render(rsx! {
div {
@ -83,7 +84,7 @@ fn swap_test() {
#[inline_props]
fn Child2<'a>(cx: Scope, children: Element<'a>) -> Element {
let shared = cx.consume_context::<MySharedState>().unwrap();
let shared = cx.consume_context::<Rc<MySharedState>>().unwrap();
println!("Child2: {}", shared.0);
cx.render(rsx! {
h1 {