Feat: about to consolidate context and scope

This commit is contained in:
Jonathan Kelley 2021-05-17 17:59:10 -04:00
parent 3de54d0b52
commit 4c8130c4e4
5 changed files with 136 additions and 9 deletions

View file

@ -1 +1,3 @@
# Hello examples
# Examples
Most of these examples are run through webview so you don't need the dioxus cli installed to preview the functionality. Anything labeled `_web` will need to be compiled with Dioxus CLI.

View file

@ -0,0 +1,38 @@
//! Example: External Updates
//! -------------------------
//! Cause updates to the VirtualDOM state from outside the component lifecycle.
//! The root props could be changed or the use_receiver hook could be used.
//!
//!
fn main() {
let (recv, sender) = channel();
async_std::task::spawn({
for location in ["a", "b", "c", "d"] {
sender.send(location);
}
});
let app = diouxs_webview::launch_with_props(App, RootProps { recv }).await;
}
struct RootProps {
navigator: Receiver<&'static str>,
}
fn App(ctx: Context, props: &RootProps) -> DomTree {
let router = use_router(&ctx, |router| {});
let navigator = use_history(&ctx);
use_receiver(&ctx, || props.recv.clone(), |to| navigator.navigate(to));
ctx.render(rsx! {
div {
a { href="/dogs/"}
a { href="/cats/"}
{content}
}
})
}

View file

@ -8,4 +8,35 @@
use dioxus::prelude::*;
fn main() {}
fn main() {
diouxs_webview::launch(App).run().await
}
fn App(ctx: Context, props: &()) -> DomTree {
let router = use_router(&ctx, |router| {
//
router.get("/dogs/:dogId/").render(|ctx, request| {
rsx! {
div {
}
}
});
router.get("/cats/:catId/").render(|ctx, request| {
rsx! {
div {
}
}
});
});
ctx.render(rsx! {
div {
a { href="/dogs/"}
a { href="/cats/"}
{router.render()}
}
})
}

View file

@ -22,9 +22,9 @@ use crate::{arena::ScopeArena, innerlude::*};
use bumpalo::Bump;
use generational_arena::Arena;
use std::{
any::TypeId,
any::{Any, TypeId},
cell::{RefCell, UnsafeCell},
collections::HashSet,
collections::{HashMap, HashSet},
fmt::Debug,
future::Future,
pin::Pin,
@ -50,6 +50,10 @@ pub struct VirtualDom {
/// All components dump their updates into a queue to be processed
pub(crate) event_queue: EventQueue,
/// Global contexts shared within the VirtualDOM
/// These are anchored to individual scopes, making them inaccessible if a context is created from a sibiling
pub(crate) contexts: HashMap<ContextId, Box<dyn Any>>,
/// a strong allocation to the "caller" for the original component and its props
#[doc(hidden)]
_root_caller: Rc<OpaqueComponent<'static>>,
@ -152,6 +156,7 @@ impl VirtualDom {
_root_caller,
base_scope,
event_queue,
contexts: Default::default(),
components: ScopeArena::new(components),
_root_prop_type: TypeId::of::<P>(),
}
@ -720,8 +725,6 @@ impl<'a> Context<'a> {
todo!("Children API not yet implemented for component Context")
}
pub fn callback(&self, _f: impl Fn(()) + 'a) {}
/// Create a subscription that schedules a future render for the reference component
pub fn schedule_update(&self) -> impl Fn() -> () {
self.scope.event_queue.schedule_update(&self.scope)
@ -763,12 +766,15 @@ impl<'scope> Context<'scope> {
idx: 0.into(),
};
let safe_nodes: VNode<'scope> = lazy_nodes.into_vnode(&ctx);
let root: VNode<'static> = unsafe { std::mem::transmute(safe_nodes) };
DomTree { root }
DomTree {
root: unsafe {
std::mem::transmute::<VNode<'scope>, VNode<'static>>(lazy_nodes.into_vnode(&ctx))
},
}
}
}
// We need to pin the hook so it doesn't move as we initialize the list of hooks
type Hook = Pin<Box<dyn std::any::Any>>;
impl<'scope> Context<'scope> {
@ -833,6 +839,16 @@ impl<'scope> Context<'scope> {
// We extend the lifetime of the internal state
runner(unsafe { &mut *(internal_state as *mut _) })
}
fn create_context_provider<T: 'static>(&self, init: impl Fn() -> T) {}
fn try_consume_context<T: 'static>(&self) -> Result<&T> {
todo!()
}
fn consume_context<T: 'static>(&self) -> &T {
self.try_consume_context().unwrap()
}
}
mod support {
@ -894,6 +910,18 @@ mod support {
Ok(())
}
}
#[derive(Debug, PartialEq, Hash)]
pub struct ContextId {
// Which component is the scope in
original: ScopeIdx,
// What's the height of the scope
height: u32,
// Which scope is it (in order)
id: u32,
}
}
mod tests {

28
packages/recoil/README.md Normal file
View file

@ -0,0 +1,28 @@
# Recoil.rs
Recoil.rs provides a global state management API for Dioxus apps built on the concept of "atomic state." Instead of grouping state together into a single bundle ALA Redux, Recoil provides individual building blocks of state called Atoms. These atoms can be set/get anywhere in the app and combined to craft complex state. Recoil should be easier to learn and more efficient than Redux. Recoil.rs is modeled after the Recoil.JS project and pulls in
## Guide
A simple atom of state is defined globally as a const:
```rust
static Light: Atom<&'static str> = atom(|_| "Green");
```
This atom of state is initialized with a value of `"Green"`. The atom that is returned does not actually contain any values. Instead, the atom's key - which is automatically generated in this instance - is used in the context of a Recoil App.
This is then later used in components like so:
```rust
fn App(ctx: Context, props: &()) -> DomTree {
// The recoil root must be initialized at the top of the application before any uses
recoil::init_recoil_root(&ctx, |_| {});
let color = use_recoil(&ctx, &TITLE);
ctx.render(rsx!{
h1 {"Color of light: {color}"}
})
}
```