chore: rename all &cx to cx, make clipppy happy

This commit is contained in:
Jonathan Kelley committed 2022-12-07 13:11:40 -08:00
1 parent e8133e9449
commit 4eefc3f854
85 files changed
+256 -271

No files matched your search

@@ -12,7 +12,7 @@ Your component today might look something like this:
```rust
fn Comp(cx: Scope) -> DomTree {
let (title, set_title) = use_state(&cx, || "Title".to_string());
let (title, set_title) = use_state(cx, || "Title".to_string());
cx.render(rsx!{
input {
value: title,
@@ -26,7 +26,7 @@ This component is fairly straightforward – the input updates its own value on
```rust
fn Comp(cx: Scope) -> DomTree {
let (title, set_title) = use_state(&cx, || "Title".to_string());
let (title, set_title) = use_state(cx, || "Title".to_string());
cx.render(rsx!{
div {
input {
@@ -49,7 +49,7 @@ We can use signals to generate a two-way binding between data and the input box.
```rust
fn Comp(cx: Scope) -> DomTree {
let mut title = use_signal(&cx, || String::from("Title"));
let mut title = use_signal(cx, || String::from("Title"));
cx.render(rsx!(input { value: title }))
}
```
@@ -58,8 +58,8 @@ For a slightly more interesting example, this component calculates the sum betwe
```rust
fn Calculator(cx: Scope) -> DomTree {
let mut a = use_signal(&cx, || 0);
let mut b = use_signal(&cx, || 0);
let mut a = use_signal(cx, || 0);
let mut b = use_signal(cx, || 0);
let mut c = a + b;
rsx! {
input { value: a }
@@ -72,8 +72,8 @@ fn Calculator(cx: Scope) -> DomTree {
Do you notice how we can use built-in operations on signals? Under the hood, we actually create a new derived signal that depends on `a` and `b`. Whenever `a` or `b` update, then `c` will update. If we need to create a new derived signal that's more complex than a basic operation (`std::ops`) we can either chain signals together or combine them:
```rust
let mut a = use_signal(&cx, || 0);
let mut b = use_signal(&cx, || 0);
let mut a = use_signal(cx, || 0);
let mut b = use_signal(cx, || 0);
// Chain signals together using the `with` method
let c = a.with(b).map(|(a, b)| *a + *b);
@@ -84,7 +84,7 @@ let c = a.with(b).map(|(a, b)| *a + *b);
If we ever need to get the value out of a signal, we can simply `deref` it.
```rust
let mut a = use_signal(&cx, || 0);
let mut a = use_signal(cx, || 0);
let c = *a + *b;
```
@@ -97,7 +97,7 @@ Sometimes you want a signal to propagate across your app, either through far-awa
```rust
const TITLE: Atom<String> = || "".to_string();
const Provider: Component = |cx|{
let title = use_signal(&cx, &TITLE);
let title = use_signal(cx, &TITLE);
render!(input { value: title })
};
```
@@ -106,7 +106,7 @@ If we use the `TITLE` atom in another component, we can cause updates to flow be
```rust
const Receiver: Component = |cx|{
let title = use_signal(&cx, &TITLE);
let title = use_signal(cx, &TITLE);
log::info!("This will only be called once!");
rsx!(cx,
div {
@@ -133,7 +133,7 @@ Dioxus automatically understands how to use your signals when mixed with iterato
```rust
const DICT: AtomFamily<String, String> = |_| {};
const List: Component = |cx|{
let dict = use_signal(&cx, &DICT);
let dict = use_signal(cx, &DICT);
cx.render(rsx!(
ul {
For { each: dict, map: |k, v| rsx!( li { "{v}" }) }
+1 -1
View File
@@ -59,7 +59,7 @@ If we represented the reactive graph presented above in Dioxus, it would look ve
// Declare a component that holds our datasources and calculates `g`
fn RenderGraph(cx: Scope) -> Element {
let seconds = use_datasource(SECONDS);
let constant = use_state(&cx, || 1);
let constant = use_state(cx, || 1);
cx.render(rsx!(
RenderG { seconds: seconds }
+6 -6
View File
@@ -28,8 +28,8 @@ If we used global state like use_context or fermi, we might be tempted to inject
```rust
fn Titlebar(cx: Scope<TitlebarProps>) -> Element {
let title = use_read(&cx, TITLE);
let subtitle = use_read(&cx, SUBTITLE);
let title = use_read(cx, TITLE);
let subtitle = use_read(cx, SUBTITLE);
cx.render(rsx!{/* ui */})
}
@@ -43,11 +43,11 @@ To enable our titlebar component to be used across apps, we want to lift our ato
```rust
fn DocsiteTitlesection(cx: Scope) {
let title = use_read(&cx, TITLE);
let subtitle = use_read(&cx, SUBTITLE);
let title = use_read(cx, TITLE);
let subtitle = use_read(cx, SUBTITLE);
let username = use_read(&cx, USERNAME);
let points = use_read(&cx, POINTS);
let username = use_read(cx, USERNAME);
let points = use_read(cx, POINTS);
cx.render(rsx!{
TitleBar { title: title, subtitle: subtitle }
+7 -7
View File
@@ -13,7 +13,7 @@ struct Todo {
is_editing: bool,
}
let todos = use_ref(&cx, || vec![Todo::new()]);
let todos = use_ref(cx, || vec![Todo::new()]);
cx.render(rsx!{
ul {
@@ -40,7 +40,7 @@ Instead, let's refactor our Todo component to handle its own state:
```rust
#[inline_props]
fn Todo<'a>(cx: Scope, todo: &'a Todo) -> Element {
let is_hovered = use_state(&cx, || false);
let is_hovered = use_state(cx, || false);
cx.render(rsx!{
li {
@@ -80,15 +80,15 @@ struct State {
}
// in the component
let state = use_ref(&cx, State::new)
let state = use_ref(cx, State::new)
```
The "better" approach for this particular component would be to break the state apart into different values:
```rust
let count = use_state(&cx, || 0);
let color = use_state(&cx, || "red");
let names = use_state(&cx, HashMap::new);
let count = use_state(cx, || 0);
let color = use_state(cx, || "red");
let names = use_state(cx, HashMap::new);
```
You might recognize that our "names" value is a HashMap – which is not terribly cheap to clone every time we update its value. To solve this issue, we *highly* suggest using a library like [`im`](https://crates.io/crates/im) which will take advantage of structural sharing to make clones and mutations much cheaper.
@@ -96,7 +96,7 @@ You might recognize that our "names" value is a HashMap – which is not terribl
When combined with the `make_mut` method on `use_state`, you can get really succinct updates to collections:
```rust
let todos = use_state(&cx, im_rc::HashMap::default);
let todos = use_state(cx, im_rc::HashMap::default);
todos.make_mut().insert("new todo", Todo {
contents: "go get groceries",
+2 -2
View File
@@ -8,8 +8,8 @@ For example, let's say we have a component that has two children:
```rust
fn Demo(cx: Scope) -> Element {
// don't worry about these 2, we'll cover them later
let name = use_state(&cx, || String::from("bob"));
let age = use_state(&cx, || 21);
let name = use_state(cx, || String::from("bob"));
let age = use_state(cx, || 21);
cx.render(rsx!{
Name { name: name }
+1 -1
View File
@@ -20,7 +20,7 @@ Our component is really simple – we just call `use_ref` to get an initial calc
```rust
fn app(cx: Scope) -> Element {
let state = use_ref(&cx, Calculator::new);
let state = use_ref(cx, Calculator::new);
cx.render(rsx!{
// the rendering code
+12 -12
View File
@@ -10,7 +10,7 @@ The basic setup for coroutines is the `use_coroutine` hook. Most coroutines we w
```rust
fn app(cx: Scope) -> Element {
let ws: &UseCoroutine<()> = use_coroutine(&cx, |rx| async move {
let ws: &UseCoroutine<()> = use_coroutine(cx, |rx| async move {
// Connect to some sort of service
let mut conn = connect_to_ws_server().await;
@@ -27,7 +27,7 @@ For many services, a simple async loop will handle the majority of use cases.
However, if we want to temporarily disable the coroutine, we can "pause" it using the `pause` method, and "resume" it using the `resume` method:
```rust
let sync: &UseCoroutine<()> = use_coroutine(&cx, |rx| async move {
let sync: &UseCoroutine<()> = use_coroutine(cx, |rx| async move {
// code for syncing
});
@@ -63,7 +63,7 @@ enum ProfileUpdate {
SetAge(i32)
}
let profile = use_coroutine(&cx, |mut rx: UnboundedReciver<ProfileUpdate>| async move {
let profile = use_coroutine(cx, |mut rx: UnboundedReciver<ProfileUpdate>| async move {
let mut server = connect_to_server().await;
while let Ok(msg) = rx.next().await {
@@ -86,9 +86,9 @@ cx.render(rsx!{
For sufficiently complex apps, we could build a bunch of different useful "services" that loop on channels to update the app.
```rust
let profile = use_coroutine(&cx, profile_service);
let editor = use_coroutine(&cx, editor_service);
let sync = use_coroutine(&cx, sync_service);
let profile = use_coroutine(cx, profile_service);
let editor = use_coroutine(cx, editor_service);
let sync = use_coroutine(cx, sync_service);
async fn profile_service(rx: UnboundedReceiver<ProfileCommand>) {
// do stuff
@@ -109,9 +109,9 @@ We can combine coroutines with Fermi to emulate Redux Toolkit's Thunk system wit
static USERNAME: Atom<String> = |_| "default".to_string();
fn app(cx: Scope) -> Element {
let atoms = use_atom_root(&cx);
let atoms = use_atom_root(cx);
use_coroutine(&cx, |rx| sync_service(rx, atoms.clone()));
use_coroutine(cx, |rx| sync_service(rx, atoms.clone()));
cx.render(rsx!{
Banner {}
@@ -119,7 +119,7 @@ fn app(cx: Scope) -> Element {
}
fn Banner(cx: Scope) -> Element {
let username = use_read(&cx, USERNAME);
let username = use_read(cx, USERNAME);
cx.render(rsx!{
h1 { "Welcome back, {username}" }
@@ -158,8 +158,8 @@ To yield values from a coroutine, simply bring in a `UseState` handle and set th
```rust
let sync_status = use_state(&cx, || Status::Launching);
let sync_task = use_coroutine(&cx, |rx: UnboundedReceiver<SyncAction>| {
let sync_status = use_state(cx, || Status::Launching);
let sync_task = use_coroutine(cx, |rx: UnboundedReceiver<SyncAction>| {
to_owned![sync_status];
async move {
loop {
@@ -176,7 +176,7 @@ Coroutine handles are automatically injected through the context API. `use_corou
```rust
fn Child(cx: Scope) -> Element {
let sync_task = use_coroutine_handle::<SyncAction>(&cx);
let sync_task = use_coroutine_handle::<SyncAction>(cx);
sync_task.send(SyncAction::SetUsername);
}
@@ -56,7 +56,7 @@ The next "best" way of handling errors in Dioxus is to match on the error locall
To do this, we simply have an error state built into our component:
```rust
let err = use_state(&cx, || None);
let err = use_state(cx, || None);
```
Whenever we perform an action that generates an error, we'll set that error state. We can then match on the error in a number of ways (early return, return Element, etc).
@@ -64,7 +64,7 @@ Whenever we perform an action that generates an error, we'll set that error stat
```rust
fn Commandline(cx: Scope) -> Element {
let error = use_state(&cx, || None);
let error = use_state(cx, || None);
cx.render(match *error {
Some(error) => rsx!(
@@ -85,7 +85,7 @@ If you're dealing with a handful of components with minimal nesting, you can jus
```rust
fn Commandline(cx: Scope) -> Element {
let error = use_state(&cx, || None);
let error = use_state(cx, || None);
if let Some(error) = **error {
return cx.render(rsx!{ "An error occured" });
@@ -125,7 +125,7 @@ Then, in our top level component, we want to explicitly handle the possible erro
```rust
fn TopLevel(cx: Scope) -> Element {
let error = use_read(&cx, INPUT_ERROR);
let error = use_read(cx, INPUT_ERROR);
match error {
TooLong => return cx.render(rsx!{ "FAILED: Too long!" }),
@@ -139,7 +139,7 @@ Now, whenever a downstream component has an error in its actions, it can simply
```rust
fn Commandline(cx: Scope) -> Element {
let set_error = use_set(&cx, INPUT_ERROR);
let set_error = use_set(cx, INPUT_ERROR);
cx.render(rsx!{
input {
+2 -2
View File
@@ -6,7 +6,7 @@ Dioxus is a portable, performant, and ergonomic framework for building cross-pla
```rust
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx!(
h1 { "High-Five counter: {count}" }
@@ -48,4 +48,4 @@ Web: Since the web is a fairly mature platform, we expect there to be very littl
Desktop: APIs will likely be in flux as we figure out better patterns than our ElectronJS counterpart.
SSR: We don't expect the SSR API to change drastically in the future.
SSR: We don't expect the SSR API to change drastically in the future.
+12 -12
View File
@@ -10,7 +10,7 @@ A configuração básica para corrotinas é o _hook_ `use_coroutine`. A maioria
```rust
fn app(cx: Scope) -> Element {
let ws: &UseCoroutine<()> = use_coroutine(&cx, |rx| async move {
let ws: &UseCoroutine<()> = use_coroutine(cx, |rx| async move {
// Connect to some sort of service
let mut conn = connect_to_ws_server().await;
@@ -27,7 +27,7 @@ Para muitos serviços, um _loop_ assíncrono simples lidará com a maioria dos c
No entanto, se quisermos desabilitar temporariamente a corrotina, podemos "pausá-la" usando o método `pause` e "retomá-la" usando o método `resume`:
```rust
let sync: &UseCoroutine<()> = use_coroutine(&cx, |rx| async move {
let sync: &UseCoroutine<()> = use_coroutine(cx, |rx| async move {
// code for syncing
});
@@ -62,7 +62,7 @@ enum ProfileUpdate {
SetAge(i32)
}
let profile = use_coroutine(&cx, |mut rx: UnboundedReciver<ProfileUpdate>| async move {
let profile = use_coroutine(cx, |mut rx: UnboundedReciver<ProfileUpdate>| async move {
let mut server = connect_to_server().await;
while let Ok(msg) = rx.next().await {
@@ -85,9 +85,9 @@ cx.render(rsx!{
Para aplicativos suficientemente complexos, poderíamos criar vários "serviços" úteis diferentes que fazem um _loop_ nos canais para atualizar o aplicativo.
```rust
let profile = use_coroutine(&cx, profile_service);
let editor = use_coroutine(&cx, editor_service);
let sync = use_coroutine(&cx, sync_service);
let profile = use_coroutine(cx, profile_service);
let editor = use_coroutine(cx, editor_service);
let sync = use_coroutine(cx, sync_service);
async fn profile_service(rx: UnboundedReceiver<ProfileCommand>) {
// do stuff
@@ -108,9 +108,9 @@ Podemos combinar corrotinas com `Fermi` para emular o sistema `Thunk` do **Redux
static USERNAME: Atom<String> = |_| "default".to_string();
fn app(cx: Scope) -> Element {
let atoms = use_atom_root(&cx);
let atoms = use_atom_root(cx);
use_coroutine(&cx, |rx| sync_service(rx, atoms.clone()));
use_coroutine(cx, |rx| sync_service(rx, atoms.clone()));
cx.render(rsx!{
Banner {}
@@ -118,7 +118,7 @@ fn app(cx: Scope) -> Element {
}
fn Banner(cx: Scope) -> Element {
let username = use_read(&cx, USERNAME);
let username = use_read(cx, USERNAME);
cx.render(rsx!{
h1 { "Welcome back, {username}" }
@@ -156,8 +156,8 @@ async fn sync_service(mut rx: UnboundedReceiver<SyncAction>, atoms: AtomRoot) {
Para obter valores de uma corrotina, basta usar um identificador `UseState` e definir o valor sempre que sua corrotina concluir seu trabalho.
```rust
let sync_status = use_state(&cx, || Status::Launching);
let sync_task = use_coroutine(&cx, |rx: UnboundedReceiver<SyncAction>| {
let sync_status = use_state(cx, || Status::Launching);
let sync_task = use_coroutine(cx, |rx: UnboundedReceiver<SyncAction>| {
to_owned![sync_status];
async move {
loop {
@@ -174,7 +174,7 @@ Os identificadores de corrotina são injetados automaticamente por meio da API d
```rust
fn Child(cx: Scope) -> Element {
let sync_task = use_coroutine_handle::<SyncAction>(&cx);
let sync_task = use_coroutine_handle::<SyncAction>(cx);
sync_task.send(SyncAction::SetUsername);
}
@@ -53,14 +53,14 @@ A próxima "melhor" maneira de lidar com erros no Dioxus é combinar (`match`) o
Para fazer isso, simplesmente temos um estado de erro embutido em nosso componente:
```rust
let err = use_state(&cx, || None);
let err = use_state(cx, || None);
```
Sempre que realizarmos uma ação que gere um erro, definiremos esse estado de erro. Podemos então combinar o erro de várias maneiras (retorno antecipado, elemento de retorno etc.).
```rust
fn Commandline(cx: Scope) -> Element {
let error = use_state(&cx, || None);
let error = use_state(cx, || None);
cx.render(match *error {
Some(error) => rsx!(
@@ -81,7 +81,7 @@ Se você estiver lidando com alguns componentes com um mínimo de aninhamento, b
```rust
fn Commandline(cx: Scope) -> Element {
let error = use_state(&cx, || None);
let error = use_state(cx, || None);
if let Some(error) = **error {
return cx.render(rsx!{ "An error occured" });
@@ -120,7 +120,7 @@ Então, em nosso componente de nível superior, queremos tratar explicitamente o
```rust
fn TopLevel(cx: Scope) -> Element {
let error = use_read(&cx, INPUT_ERROR);
let error = use_read(cx, INPUT_ERROR);
match error {
TooLong => return cx.render(rsx!{ "FAILED: Too long!" }),
@@ -134,7 +134,7 @@ Agora, sempre que um componente _downstream_ tiver um erro em suas ações, ele
```rust
fn Commandline(cx: Scope) -> Element {
let set_error = use_set(&cx, INPUT_ERROR);
let set_error = use_set(cx, INPUT_ERROR);
cx.render(rsx!{
input {
+1 -1
View File
@@ -6,7 +6,7 @@ Dioxus é uma estrutura portátil, de alto desempenho e ergonômica para a const
```rust
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx!(
h1 { "High-Five counter: {count}" }