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

Add eslint-plugin-react-refresh #4379

Merged
merged 2 commits into from
Jan 7, 2025
Merged

Add eslint-plugin-react-refresh #4379

merged 2 commits into from
Jan 7, 2025

Conversation

rakyi
Copy link
Contributor

@rakyi rakyi commented Jan 3, 2025

Add eslint-plugin-react-refresh

Fast Refresh is a feature that lets you edit React components in a
running application without losing their state. It is similar to an old
feature known as "hot reloading", but Fast Refresh is more reliable and
officially supported by React.

Vite already supports Fast Refresh, but it works only under specific
conditions. This ESlint plugin helps us write components in a way that
ensures they can be reloaded using Fast Refresh. We don't enable it for
directories containing mostly class components, since it doesn't work
for them.

As part of this change I fixed the linter errors by refactoring the
code, which means now many more components will be working with Fast
Refresh, speeding up the local development.

https://github.com/ArnaudBarre/eslint-plugin-react-refresh
https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react#consistent-components-exports

Rename adminSiteServer files from .tsx to .ts

Several files had the .tsx extension despite not containing any JSX.

Copy link
Contributor Author

rakyi commented Jan 3, 2025

This stack of pull requests is managed by Graphite. Learn more about stacking.

@rakyi rakyi marked this pull request as ready for review January 3, 2025 15:39
@rakyi rakyi force-pushed the eslint-plugin-react-refresh branch from 34d7006 to 4d3ea4a Compare January 3, 2025 15:45
@owidbot
Copy link
Contributor

owidbot commented Jan 3, 2025

Quick links (staging server):

Site Dev Site Preview Admin Wizard Docs

Login: ssh owid@staging-site-eslint-plugin-react-refresh

SVG tester:

Number of differences (default views): 0 ✅
Number of differences (all views): 0 ✅

Edited: 2025-01-03 17:16:51 UTC
Execution time: 1.21 seconds

@danyx23 danyx23 self-requested a review January 3, 2025 15:52
@rakyi rakyi force-pushed the eslint-plugin-react-refresh branch from 4d3ea4a to 4968f76 Compare January 3, 2025 15:55
@rakyi rakyi force-pushed the eslint-plugin-react-refresh branch from 4968f76 to 16df04b Compare January 3, 2025 17:02
Copy link
Contributor

@danyx23 danyx23 left a comment

Choose a reason for hiding this comment

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

Super nice! This is a huge improvement for working on our react components where the fast refresh is supported. Thanks a lot for doing this!

Copy link
Contributor Author

rakyi commented Jan 7, 2025

Merge activity

  • Jan 7, 3:47 AM EST: A user started a stack merge that includes this pull request via Graphite.
  • Jan 7, 3:51 AM EST: Graphite rebased this pull request as part of a merge.
  • Jan 7, 3:52 AM EST: A user merged this pull request with Graphite.

@rakyi rakyi changed the base branch from eslint-9 to graphite-base/4379 January 7, 2025 08:48
@rakyi rakyi changed the base branch from graphite-base/4379 to master January 7, 2025 08:49
rakyi added 2 commits January 7, 2025 08:50
Fast Refresh is a feature that lets you edit React components in a
running application without losing their state. It is similar to an old
feature known as "hot reloading", but Fast Refresh is more reliable and
officially supported by React.

Vite already supports Fast Refresh, but it works only under specific
conditions. This ESlint plugin helps us write components in a way that
ensures they can be reloaded using Fast Refresh. We don't enable it for
directories containing mostly class components, since it doesn't work
for them.

As part of this change I fixed the linter errors by refactoring the
code, which means now many more components will be working with Fast
Refresh, speeding up the local development.

https://github.com/ArnaudBarre/eslint-plugin-react-refresh
https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react#consistent-components-exports
Several files had the .tsx extension despite not containing any JSX.
@rakyi rakyi force-pushed the eslint-plugin-react-refresh branch from 16df04b to b11707e Compare January 7, 2025 08:50
@rakyi rakyi merged commit b6980bc into master Jan 7, 2025
12 of 16 checks passed
@rakyi rakyi deleted the eslint-plugin-react-refresh branch January 7, 2025 08:52
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.

3 participants