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

♻️ Use suspense for items page #1167

Merged
merged 3 commits into from
Apr 15, 2024

Conversation

patrick91
Copy link
Contributor

I've also added a very simple skeleton

CleanShot.2024-04-11.at.10.30.26.mp4

@patrick91 patrick91 changed the title ✨ use suspense for items page ✨ Use suspense for items page Apr 12, 2024
@patrick91 patrick91 marked this pull request as draft April 12, 2024 09:40
Items Management
</Heading>

<ErrorBoundary fallback={<div>Something went wrong</div>}>
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@alejsdev what do you think of this?

I needed to add a new library, because you can't create error boundaries with functional components, and I thought it was better to import a new library rather than creating our own version of the component :D

https://react.dev/reference/react/Suspense#providing-a-fallback-for-server-errors-and-client-only-content

https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, I like this approach 😄

@patrick91
Copy link
Contributor Author

Update to only suspend the table, it looks much better 😊

CleanShot.2024-04-15.at.13.55.01.mp4

The only issue is the heading widths changing, but maybe we can live with that? (or we do set a fixed size for them) 😊

@patrick91 patrick91 marked this pull request as ready for review April 15, 2024 15:49
@alejsdev
Copy link
Member

Update to only suspend the table, it looks much better 😊

CleanShot.2024-04-15.at.13.55.01.mp4
The only issue is the heading widths changing, but maybe we can live with that? (or we do set a fixed size for them) 😊

Yes, it looks nice! I think we can set a fixed size for it 🤔

@alejsdev alejsdev merged commit c31a12c into fastapi:master Apr 15, 2024
3 checks passed
@alejsdev alejsdev changed the title ✨ Use suspense for items page ♻️ Use suspense for items page Apr 15, 2024
@tiangolo
Copy link
Member

Awesome, thanks! Looks great 🚀

@patrick91 patrick91 deleted the feature/suspense-items branch April 16, 2024 08:19
gusevyaroslove pushed a commit to gusevyaroslove/fastapi-template that referenced this pull request Aug 4, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants