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

Disable rule of hooks in stories files #149

Merged
merged 2 commits into from
Feb 16, 2024

Conversation

ndelangen
Copy link
Member

@ndelangen ndelangen commented Feb 13, 2024

Closes: storybookjs/storybook#21115

What Changed

I chatted with @valentinpalkovic and we concluded that instead of writing an automigration adding code that in neither case looks "quite right", we considered maybe adding an exception to the config exposed by the plugin, which turns off the problems reported from react-hooks eslint plugin.

Checklist

Check the ones applicable to your change:

  • Ran yarn update-all
  • Tests are updated
  • Documentation is updated

Change Type

Indicate the type of change your pull request is:

  • maintenance
  • documentation
  • patch
  • minor
  • major
📦 Published PR as canary version: 0.7.0--canary.149.b9dd4e1.0

✨ Test out this PR locally via:

npm install eslint-plugin-storybook@0.7.0--canary.149.b9dd4e1.0
# or 
yarn add eslint-plugin-storybook@0.7.0--canary.149.b9dd4e1.0

@valentinpalkovic
Copy link
Contributor

valentinpalkovic commented Feb 13, 2024

LGTM, I am curious what @yannbf thinks about this!

@kasperpeulen
Copy link
Contributor

Can one plugin turn off a rule from another plugin? And are we sure hooks always keep working? Or only if they use storybook hooks?

@ndelangen
Copy link
Member Author

Can one plugin turn off a rule from another plugin?

@kasperpeulen I think this answers your question:
https://github.com/storybookjs/eslint-plugin-storybook/pull/149/files#diff-ded734a061dba2176af9593a93a97d7e478a8aa10774724c78ade7977e783832R13

This very plugin is already doing that.

And are we sure hooks always keep working?

This does not impact runtime of hooks.
There's no difference in react's hooks vs custom hooks for the eslint plugin, you can't disable 1, and not the other.

@@ -9,6 +9,7 @@ export = {
{
files: ['*.stories.@(ts|tsx|js|jsx|mjs|cjs)', '*.story.@(ts|tsx|js|jsx|mjs|cjs)'],
rules: {
'react-hooks/rules-of-hooks': 'off',
Copy link
Member

Choose a reason for hiding this comment

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

make sure to add this to the other config files, else it's all good!

@yannbf yannbf changed the title Turn off react-hooks problems in stories files Disable rule of hooks in stories files Feb 16, 2024
@yannbf yannbf added patch Increment the patch version when merged minor Increment the minor version when merged and removed patch Increment the patch version when merged labels Feb 16, 2024
@ndelangen ndelangen merged commit a100924 into main Feb 16, 2024
4 checks passed
@ndelangen ndelangen deleted the norbert/add-off-switch-react-hooks-in-stories branch February 16, 2024 11:08
Copy link

🚀 PR was released in v0.7.0 🚀

@github-actions github-actions bot added the released This issue/pull request has been released. label Feb 16, 2024
@ndelangen
Copy link
Member Author

To resolve this issue, please use the official storybook eslint plugin. the latest version should resolve this issue, see: https://github.com/storybookjs/eslint-plugin-storybook/releases/tag/v0.7.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
minor Increment the minor version when merged released This issue/pull request has been released.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Codemod: Handle react hooks better for CSF3
4 participants