Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"Inner" <Subscribe> is skipped in case of nested <Subscribe>s #309

Closed
jbhoot opened this issue Sep 22, 2023 · 3 comments
Closed

"Inner" <Subscribe> is skipped in case of nested <Subscribe>s #309

jbhoot opened this issue Sep 22, 2023 · 3 comments

Comments

@jbhoot
Copy link

jbhoot commented Sep 22, 2023

<Subscribe fallback={<p> Loading page </p>}>
  <Component1 />
  <Component2 />
  <RemoveSubscribe>
    <Subscribe fallback={<p> Loading this section </p>}>
      <ComponentThatSubscribesToAStreamWithoutADefaultValue />
    </Subscribe>
  </RemoveSubscribe>
</Subscribe>

What I expected

While the data for <ComponentThatSubscribesToAStreamWithoutADefaultValue> is loading, only that section of the page should display the loading fallback.

What happens instead

Loading fallback for the whole page is displayed instead. It seems that the inner <Subscribe> is ignored entirely. Or I am using it wrong.

@voliva
Copy link
Collaborator

voliva commented Sep 22, 2023

Can you provide an example please? I've tried it on this sandbox and it seems like it's working correctly https://codesandbox.io/s/react-rxjs-suspense-swn29y?file=/src/App.tsx

Keep in mind that Subscribe has to do a double-render when getting mounted, where it will render the fallback (defaulting to null) just on the first render, then immediately renders the children. On the case you don't want your Subscribe fallback to appear, you can take it out from there and add a regular <Suspense fallback="..."> from React. Subscribe will just render null instead.

@jbhoot
Copy link
Author

jbhoot commented Sep 25, 2023

Sorry I have been rushing to meet a deadline. I will put up an example as soon as I am done with it.

@voliva
Copy link
Collaborator

voliva commented Oct 23, 2023

I'll close this issue as we can't really reproduce it. If anyone can provide a test or a reproducible example we can reopen it.

Check that none of the other components (<Component1 /> <Component2 />) are triggering suspense. And also be mindful of the fact that Subscribe renders the fallback always on the initial render (docs).

@voliva voliva closed this as completed Oct 23, 2023
@voliva voliva closed this as not planned Won't fix, can't repro, duplicate, stale Oct 23, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants