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

Issue/1298 eslint rule no useless fragments #1673

Merged
merged 2 commits into from
Dec 15, 2023

Conversation

nehahirve92
Copy link
Collaborator

@nehahirve92 nehahirve92 commented Dec 3, 2023

Description

This PR adds the eslint rule Disallow unnecessary fragments (react/jsx-no-useless-fragment)
And refactors any instances where this is the case.

I chose to render null in a lot of cases where we were rendering empty fragments; see philosophy here https://kentcdodds.com/blog/use-ternaries-rather-than-and-and-in-jsx

In cases where Fragments were essentially serving to change type from a ReactNode to a JSX.Element (strings or numbers), I wrapped these in tags instead.

⚠️ The integration test tests/organize/tags/add.spec.ts seems flaky. It's failing locally but was also failing locally on a clean main
Closes #1298

Screenshots

[Add screenshots here]

Changes

[Add a list of features added/changed, bugs fixed etc]

  • Adds…
  • Changes…

Notes to reviewer

[Add instructions for testing]

Related issues

Resolves #[id]

@nehahirve92 nehahirve92 marked this pull request as draft December 3, 2023 13:27
@ghost ghost force-pushed the issue/1298-eslint-rule-no-useless-fragments branch from 275b564 to 17d9f42 Compare December 3, 2023 14:26
@ghost ghost force-pushed the issue/1298-eslint-rule-no-useless-fragments branch from 17d9f42 to 7d3b29b Compare December 3, 2023 14:37
@nehahirve92 nehahirve92 marked this pull request as ready for review December 3, 2023 14:54
@richardolsson
Copy link
Member

Maybe you can have a look at reviewing this @ziggabyte?

Copy link
Contributor

@ziggabyte ziggabyte left a comment

Choose a reason for hiding this comment

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

Hi Neha!! So great to see you in here again! :D

I have looked around and clicked around and as far as I can tell things work as they're supposed to, meaning this works fine :D

Happy to approve this and have a future where the code is nicer 💯

@ziggabyte ziggabyte merged commit a9fcfbf into main Dec 15, 2023
4 checks passed
@ziggabyte ziggabyte deleted the issue/1298-eslint-rule-no-useless-fragments branch December 15, 2023 10:22
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

Successfully merging this pull request may close these issues.

Add eslint rule react/jsx-no-useless-fragment
3 participants