0.5 version - context in <Show />

[azecm]

after switching to version 0.5
there were problems with the context under some conditions

for example, in Loaded a context is created (provide_context) in the create_frame_context function
and in this case, when I try to use it in events through use_context, I get an error - it’s not there

if you remove <Show />
then everything works

#[component]
#[allow(non_snake_case)]
pub fn GameInit(text: Option<String>) -> impl IntoView {
    let data = from_json_string::<GameData>(text).expect("source data parse error");
    let images = load_image(&data.src_list[0]);
    let fps = use_fps();
    view! {
        <Show when=move || (images.get().is_some()) fallback=|| view! { <></> }>
            <Loaded data=data.clone() image=images.get_untracked().unwrap() fps/>
        </Show>
    }
}


#[component]
#[allow(non_snake_case)]
fn Loaded(data: GameData, image: HtmlImageElement, fps: ReadSignal<Option<Fps>>) -> impl IntoView {
    create_frame_context(Some(InitBoardSize {
        width: image.natural_width(),
        height: image.natural_height(),
        ..InitBoardSize::default()
    }));

    view! {
        <HostGame>
            <BoardView data image browser_fps=fps/>
        </HostGame>
    }
}

Replacing <Show /> with if doesn't help either.

    move|| if images.get().is_some(){
        div().child(Loaded(LoadedProps{data: data.clone(), image:images.get_untracked().unwrap(), fps }))
    }else {
        div()
    }

[gbj]

I can't see the use_context in the example, but you mention events, so I assume you mean calling use_context inside an event listener returns None. This is true and is a breaking change in 0.5; you can only access context in component bodies. So instead of

#[component]
fn SomeComponent() -> impl IntoView {
  view! {
    <button on:click=|_| {
      let ctx = use_context::<T>();
      ctx.something();
    }> // etc.
  }
}

you should do

#[component]
fn SomeComponent() -> impl IntoView {
  // access it in component body
  let ctx = use_context::<T>();

  view! {
    // move it into click handler
    <button on:click=move |_| {
      ctx.something();
    }> // etc.
  }
}

If that is impossible -- i.e., if the context is provided at some point other than during the initial render -- you can manually reset to the component's owner in the handler.

#[component]
fn SomeComponent() -> impl IntoView {
  let owner = Owner::current().unwrap();
  view! {
    <button on:click=|_| {
      let ctx = with_owner(owner, || use_context::<T>());
      ctx.something();
    }> // etc.
  }
}

I have a short bullet point on this in the release notes, but will add a link to this longer version!

[azecm]

Thank you for the quick response
yes, you understood everything correctly

I have made several browser games
two stopped working
and the third one works
and there use_context is used inside events

to solve the problem described above
raised provide_context above the <Show/> block

and everything worked
use_context - works everywhere below, including in events

[azecm]

this is how I work now (v0.5) with use_context inside events

#[component]
fn SomeComponent() -> impl IntoView {
    let on_click = move |_: MouseEvent| {
        let ctx = use_context::<T>();
        ctx.something();
    };
    view! {
        <button on:click=on_click />
    }
}

thanks for the example with with_owner
I'll keep it on mind