Merge pull request #2511 from leptos-rs/simplify-stable

Simplify stable syntax in examples
leptos-rs · Apr 9, 2024 · 454a4f4 · 454a4f4
2 parents f0c1061 + 85a91af
commit 454a4f4
Show file tree

Hide file tree

Showing 17 changed files with 47 additions and 34 deletions.
diff --git a/examples/counter/src/lib.rs b/examples/counter/src/lib.rs
@@ -16,7 +16,7 @@ pub fn SimpleCounter(
         <div>
             <button on:click=move |_| set_value.set(0)>"Clear"</button>
             <button on:click=move |_| set_value.update(|value| *value -= step)>"-1"</button>
-            <span>"Value: " {move || value.get()} "!"</span>
+            <span>"Value: " {value} "!"</span>
             <button on:click=move |_| set_value.update(|value| *value += step)>"+1"</button>
         </div>
     }

diff --git a/examples/counters/src/lib.rs b/examples/counters/src/lib.rs
@@ -63,7 +63,7 @@ pub fn Counters() -> impl IntoView {
             </p>
             <ul>
                 <For
-                    each=move||counters.get()
+                    each=move || counters.get()
                     key=|counter| counter.0
                     children=move |(id, (value, set_value)): (usize, (ReadSignal<i32>, WriteSignal<i32>))| {
                         view! {

diff --git a/examples/hackernews_axum/src/error_template.rs b/examples/hackernews_axum/src/error_template.rs
@@ -11,7 +11,7 @@ pub fn error_template(errors: Option<RwSignal<Errors>>) -> View {
       <h1>"Errors"</h1>
       <For
           // a function that returns the items we're iterating over; a signal is fine
-          each=move||errors.get()
+          each=move ||  errors.get()
           // a unique key for each item as a reference
           key=|(key, _)| key.clone()
           // renders each item to a view

diff --git a/examples/hackernews_islands_axum/src/error_template.rs b/examples/hackernews_islands_axum/src/error_template.rs
@@ -11,7 +11,7 @@ pub fn error_template(errors: Option<RwSignal<Errors>>) -> View {
       <h1>"Errors"</h1>
       <For
           // a function that returns the items we're iterating over; a signal is fine
-          each=move||errors.get()
+          each=move || errors.get()
           // a unique key for each item as a reference
           key=|(key, _)| key.clone()
           // renders each item to a view

diff --git a/examples/hackernews_islands_axum/src/routes/story.rs b/examples/hackernews_islands_axum/src/routes/story.rs
@@ -92,7 +92,7 @@ pub fn Story() -> impl IntoView {
 pub fn Toggle(children: Children) -> impl IntoView {
     let (open, set_open) = create_signal(true);
     view! {
-        <div class="toggle" class:open=move||open.get()>
+        <div class="toggle" class:open=open>
             <a on:click=move |_| set_open.update(|n| *n = !*n)>
                 {move || if open.get() {
                     "[-]"

diff --git a/examples/hackernews_js_fetch/src/error_template.rs b/examples/hackernews_js_fetch/src/error_template.rs
@@ -11,7 +11,7 @@ pub fn error_template(errors: Option<RwSignal<Errors>>) -> View {
       <h1>"Errors"</h1>
       <For
           // a function that returns the items we're iterating over; a signal is fine
-          each=move||errors.get()
+          each=move || errors.get()
           // a unique key for each item as a reference
           key=|(key, _)| key.clone()
           // renders each item to a view

diff --git a/examples/hackernews_js_fetch/src/routes/story.rs b/examples/hackernews_js_fetch/src/routes/story.rs
@@ -83,7 +83,7 @@ pub fn Comment(comment: api::Comment) -> impl IntoView {
         {(!comment.comments.is_empty()).then(|| {
             view! {
                 <div>
-                    <div class="toggle" class:open=move||open.get()>
+                    <div class="toggle" class:open=open>
                         <a on:click=move |_| set_open.update(|n| *n = !*n)>
                             {
                                 let comments_len = comment.comments.len();

diff --git a/examples/js-framework-benchmark/src/lib.rs b/examples/js-framework-benchmark/src/lib.rs
@@ -166,7 +166,7 @@ pub fn App() -> impl IntoView {
             <table class="table table-hover table-striped test-data">
                 <tbody>
                     <For
-                        each=move||data.get()
+                        each=move || data.get()
                         key={|row| row.id}
                         children=move |row: RowData| {
                             let row_id = row.id;
@@ -182,7 +182,7 @@ pub fn App() -> impl IntoView {
                             template! {
                                 <tr class:danger={move || is_selected.selected(Some(row_id))}>
                                     <td class="col-md-1">{row_id.to_string()}</td>
-                                    <td class="col-md-4"><a on:click=move |_| set_selected.set(Some(row_id))>{move || label.get()}</a></td>
+                                    <td class="col-md-4"><a on:click=move |_| set_selected.set(Some(row_id))>{label}</a></td>
                                     <td class="col-md-1"><a on:click=move |_| remove(row_id)><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a></td>
                                     <td class="col-md-6"/>
                                 </tr>

diff --git a/examples/parent_child/src/lib.rs b/examples/parent_child/src/lib.rs
@@ -31,10 +31,10 @@ pub fn App() -> impl IntoView {
         <main>
             <p
                 // class: attributes take F: Fn() => bool, and these signals all implement Fn()
-                class:red=move||red.get()
-                class:right=move||right.get()
-                class:italics=move||italics.get()
-                class:smallcaps=move||smallcaps.get()
+                class:red=red
+                class:right=right
+                class:italics=italics
+                class:smallcaps=smallcaps
             >
                 "Lorem ipsum sit dolor amet."
             </p>

diff --git a/examples/portal/src/lib.rs b/examples/portal/src/lib.rs
@@ -11,7 +11,7 @@ pub fn App() -> impl IntoView {
                 Show Overlay
             </button>
 
-            <Show when=move||show_overlay.get() fallback=|| ()>
+            <Show when=move || show_overlay.get() fallback=|| ()>
                 <div>Show</div>
                 <Portal mount=document().get_element_by_id("app").unwrap()>
                     <div style="position: fixed; z-index: 10; width: 100vw; height: 100vh; top: 0; left: 0; background: rgba(0, 0, 0, 0.8); color: white;">
@@ -23,7 +23,7 @@ pub fn App() -> impl IntoView {
                             Toggle inner
                         </button>
 
-                        <Show when=move||show_inside_overlay.get() fallback=|| view! { "Hidden" }>
+                        <Show when=move || show_inside_overlay.get() fallback=|| view! { "Hidden" }>
                             Visible
                         </Show>
                     </div>

diff --git a/examples/server_fns_axum/src/app.rs b/examples/server_fns_axum/src/app.rs
@@ -193,7 +193,7 @@ pub fn WithAnAction() -> impl IntoView {
         <p>You submitted: {move || format!("{:?}", action.input().get())}</p>
         <p>The result was: {move || format!("{:?}", action.value().get())}</p>
         <Transition>
-            <p>Total rows: {move || row_count.get()}</p>
+            <p>Total rows: {row_count}</p>
         </Transition>
     }
 }
@@ -227,7 +227,7 @@ pub fn WithActionForm() -> impl IntoView {
         <p>You submitted: {move || format!("{:?}", action.input().get())}</p>
         <p>The result was: {move || format!("{:?}", action.value().get())}</p>
         <Transition>archive underaligned: need alignment 4 but have alignment 1
-            <p>Total rows: {move || row_count.get()}</p>
+            <p>Total rows: {row_count}</p>
         </Transition>
     }
 }
@@ -285,7 +285,7 @@ pub fn ServerFnArgumentExample() -> impl IntoView {
         >
             Click to see length
         </button>
-        <p>Length is {move||result.get()}</p>
+        <p>Length is {result}</p>
     }
 }
 
@@ -313,8 +313,6 @@ pub fn RkyvExample() -> impl IntoView {
 
     view! {
         <h3>Using <code>rkyv</code> encoding</h3>
-        <p>
-        </p>
         <input node_ref=input_ref placeholder="Type something here."/>
         <button
             on:click=move |_| {
@@ -324,9 +322,9 @@ pub fn RkyvExample() -> impl IntoView {
         >
             Click to capitalize
         </button>
-        <p>{move||input.get()}</p>
+        <p>{input}</p>
         <Transition>
-            {move || rkyv_result.get()}
+            {rkyv_result}
         </Transition>
     }
 }
@@ -797,7 +795,7 @@ pub fn CustomEncoding() -> impl IntoView {
         >
             Submit
         </button>
-        <p>{move||result.get()}</p>
+        <p>{result}</p>
     }
 }
 

diff --git a/examples/slots/src/lib.rs b/examples/slots/src/lib.rs
@@ -49,7 +49,7 @@ pub fn App() -> impl IntoView {
 
     view! {
         <button on:click=move |_| set_count.update(|value| *value += 1)>"+1"</button>
-        " "{move||count.get()}" is "
+        " "{count}" is "
         <SlotIf cond=is_even>
             // The slot name can be emitted if it would match the slot struct name (in snake case).
             <Then slot>"even"</Then>

diff --git a/examples/sso_auth_axum/src/lib.rs b/examples/sso_auth_axum/src/lib.rs
@@ -129,7 +129,7 @@ pub fn App() -> impl IntoView {
                     <Route path="" view=move || {
                         view!{
                             {display_email}
-                            <Show when=move||email.get().is_some() fallback=||view!{<SignIn/>}>
+                            <Show when=move || email.get().is_some() fallback=||view!{<SignIn/>}>
                                 <LogOut/>
                             </Show>
                             }

diff --git a/examples/tailwind_axum/src/app.rs b/examples/tailwind_axum/src/app.rs
@@ -31,7 +31,7 @@ fn Home() -> impl IntoView {
                         "+"
                     </button>
                     <button class="rounded px-3 py-2 m-1 border-b-4 border-l-2 shadow-lg bg-blue-800 border-blue-900 text-white">
-                        {move||value.get()}
+                        {value}
                     </button>
                     <button on:click=move |_| set_value.update(|value| *value -= 1) class="rounded px-3 py-2 m-1 border-b-4 border-l-2 shadow-lg bg-blue-700 border-blue-800 text-white">
                         "-"

diff --git a/examples/timer/src/lib.rs b/examples/timer/src/lib.rs
@@ -21,9 +21,9 @@ pub fn TimerDemo() -> impl IntoView {
     view! {
         <div>
             <div>"Count A (fixed interval of 1000 ms)"</div>
-            <div>{move||count_a.get()}</div>
-            <div>"Count B (dynamic interval, currently " {move||interval.get()} " ms)"</div>
-            <div>{move||count_b.get()}</div>
+            <div>{count_a}</div>
+            <div>"Count B (dynamic interval, currently " {interval} " ms)"</div>
+            <div>{count_b}</div>
             <input prop:value=interval on:input=move |ev| {
                 if let Ok(value) = event_target_value(&ev).parse::<u64>() {
                     set_interval.set(value);

diff --git a/examples/todomvc/src/lib.rs b/examples/todomvc/src/lib.rs
@@ -300,14 +300,14 @@ pub fn Todo(todo: Todo) -> impl IntoView {
         <li
             class="todo"
             class:editing={editing}
-            class:completed={move || todo.completed.get()}
+            class:completed={todo.completed}
         >
             <div class="view">
                 <input
                     node_ref=todo_input
                     class="toggle"
                     type="checkbox"
-                    prop:checked={move || todo.completed.get()}
+                    prop:checked={todo.completed}
                     on:input={move |ev| {
                         let checked = event_target_checked(&ev);
                         todo.completed.set(checked);
@@ -320,15 +320,15 @@ pub fn Todo(todo: Todo) -> impl IntoView {
                         _ = input.focus();
                     }
                 }>
-                    {move || todo.title.get()}
+                    {todo.title}
                 </label>
                 <button class="destroy" on:click=move |_| set_todos.update(|t| t.remove(todo.id))/>
             </div>
             {move || editing.get().then(|| view! {
                 <input
                     class="edit"
                     class:hidden={move || !editing.get()}
-                    prop:value={move || todo.title.get()}
+                    prop:value=todo.title
                     on:focusout=move |ev: web_sys::FocusEvent| save(&event_target_value(&ev))
                     on:keyup={move |ev: web_sys::KeyboardEvent| {
                         let key_code = ev.key_code();

diff --git a/leptos_dom/src/lib.rs b/leptos_dom/src/lib.rs
@@ -45,7 +45,8 @@ use html::{AnyElement, ElementDescriptor};
 pub use hydration::{HydrationCtx, HydrationKey};
 #[cfg(not(feature = "nightly"))]
 use leptos_reactive::{
-    MaybeProp, MaybeSignal, Memo, ReadSignal, RwSignal, Signal, SignalGet,
+    MaybeProp, MaybeSignal, Memo, ReadSignal, Resource, RwSignal, Signal,
+    SignalGet,
 };
 use leptos_reactive::{Oco, TextProp};
 pub use macro_helpers::*;
@@ -207,6 +208,20 @@ where
     }
 }
 #[cfg(not(feature = "nightly"))]
+impl<S, T> IntoView for Resource<S, T>
+where
+    S: Clone,
+    T: IntoView + Clone,
+{
+    #[cfg_attr(
+        any(debug_assertions, feature = "ssr"),
+        instrument(level = "trace", name = "Signal<T>", skip_all)
+    )]
+    fn into_view(self) -> View {
+        DynChild::new(move || self.get()).into_view()
+    }
+}
+#[cfg(not(feature = "nightly"))]
 impl<T> IntoView for MaybeSignal<T>
 where
     T: IntoView + Clone,