using <Await> with also reactive server actions

[caligin]

Hello everyone, I'm new to Leptos and playing around the other day I've tried to use an <Await> inside a component that:

• displays a submittable form
• on initial (server side) render should load data from a DB to show it in the form
• upon submitting will store to a DB and echo back the saved data to be displayed back in the form, potentially with some alterations to it

Here is my code.
This loads some data, uses <Await>'s let: binding to refer to it, then tries to use it as part of a move || { ... } closure in the children that combines that with the result of a create_server_action in some try-load-stuff-or-show-defaults kinda situation.

I put this together following various examples in the book but got very stuck as the compiler rightly tells me that due to ownership of let:initial_data, the closure can only be FnOnce while a Fn is expected (exact output here).
I tried to rewrite this in various other ways, adding move to the future closure, removing move from the children, using the children= syntax with a view! and doing some cloning of initial_data before calling the view! macro and some more - but I just couldn't figure it out.

so here's my question: did I miss out something really obvious being new with the framework (and rust!), or is it something that due to the Fn bound in the types is just not possible to do at all with <Await>, and I should just use <Suspense> instead (which works just fine) ?

I do acknowledge that maybe the whole design of the interaction might be a bit weird - but suggestions on making that more sensical might be a bit outside the scope of the question, I really want to understand whether something similar is reasonable at all with an <Await>.

Many thanks in advance! 🙏

[gbj]

Here's a working version of these lines:

<ActionForm action=save_fields
  // clones `initial_data` before moving it into the children of `ActionForm`
  clone:initial_data
>
    <input
        type="text"
        prop:value=move || {
            let existing_data = initial_data
                // clones `initial_data` so it can be used to update this value multiple times
                .clone()

Here's another approach to the same kind of thing without needing to clone the value like that. I'm not sure this actually works as you're intending but hopefully you can see the point!

#[component]
fn HomePage() -> impl IntoView {
    let save_fields = create_server_action::<SaveFields>();
    let saved_values = save_fields.value();

    let initial_data = create_resource(|| (), |_| async move { load_fields().await.unwrap() });
    let data = move || {
        saved_values.get().map_or(
            initial_data
                .get()
                .unwrap()
                .map_or("".to_string(), |s| s.name),
            |res| res.map(|fields| fields.name).unwrap(),
        )
    };
    view! {
        <Suspense fallback=move || view! { <p>"Loading..."</p> }>
            <p>{move || if save_fields.pending().get() { "Saving..." } else { "" }}</p>
            <ActionForm action=save_fields>
                <input
                    type="text"
                    prop:value=data
                    name="name"
                />
                <input type="text" name="surname"/>
                <input type="text" name="email"/>
                <input type="submit" value="Save"/>
            </ActionForm>
        </Suspense>
    }
}

[caligin]

Ah that's great, thank you - I didn't find the clone: attr in ActionForm, that makes sense 🙏

[caligin]

can I just check in again that this is supposed to work in version 0.6.11 as well?
I got it to compile just fine in 0.6.10, then merged a dependabot PR and now I get:

error[E0521]: borrowed data escapes outside of closure
   --> src/app.rs:77:5
    |
77  | /     view! {
78  | |         <Await
79  | |             future=|| load_fields()
80  | |             let:initial_data
    | |             ---
    | |             |
    | |             `initial_data` is a reference that is only valid in the closure body
    | |             has type `&'1 Result<std::option::Option<StructForDbStorage>, leptos::ServerFnError>`
...   |
107 | |         </Await>
108 | |     }
    | |     ^
    | |     |
    | |_____`initial_data` escapes the closure body here
    |       argument requires that `'1` must outlive `'static`

is this a bug or did I miss some important notice on the changelog?

[gbj]

Something that compiled on 0.6.10 and not 0.6.11 is a bug in the framework. In this case it may or may not be caused by the same thing as #2541

[caligin]

thanks for confirming, will keep an eye on #2541 🙏