CLI: Enhance csf factory codemod to migrate from csf2 #30395
Conversation
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
There was a problem hiding this comment.
4 file(s) reviewed, 4 comment(s)
Edit PR Review Bot Settings | Greptile
| // Do change the type of no-arg stories without annotations to StoryFn when applicable | ||
| if (isSimpleCSFStory(init, annotations)) { |
There was a problem hiding this comment.
style: Duplicate comment line should be removed
|
|
||
| export default { title: 'Component', Component: Cat }; | ||
|
|
||
| const Template: Story = (args) => <Button {...args} /> |
There was a problem hiding this comment.
logic: Template uses Button component but args are typed for Cat component. This could cause type errors.
| // This is a tough one to support, we just skip for now. | ||
| // Relates to `Stories.Story.args` where Stories is coming from another file. We can't know whether it should be transformed or not. | ||
| if (err.message.includes(`instead got "MemberExpression"`)) { | ||
| console.log({ path }); | ||
| return; |
There was a problem hiding this comment.
style: silently returning on MemberExpression errors could hide issues. Consider adding a debug log here to help track these cases.
| import { Story, StoryFn, ComponentStory, ComponentStoryObj } from '@storybook/react'; | ||
| import { Cat, type CatProps } from './Cat'; | ||
|
|
||
| export default { title: 'Component', Component: Cat }; |
There was a problem hiding this comment.
style: Property name 'Component' (uppercase) in the meta object doesn't match the standard 'component' (lowercase) used elsewhere
|
View your CI Pipeline Execution ↗ for commit 488fd4f.
☁️ Nx Cloud last updated this comment at |
Package BenchmarksCommit: The following packages have significant changes to their size or dependencies:
|
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 401 | 390 | 🎉 -11 🎉 |
| Self size | 529 KB | 530 KB | 🚨 +468 B 🚨 |
| Dependency size | 75.62 MB | 75.35 MB | 🎉 -271 KB 🎉 |
| Bundle Size Analyzer | Link | Link |
yannbf
force-pushed
the
yann/csf-factory-codemod-from-csf-2
branch
from
e666dd4 to
488fd4f
Compare
Closes #
What I did
This PR introduces a brief refactor in the csf2-to-3 codemod so it can be reused as part of the csf-factories codemod.
Checklist for Contributors
Testing
The changes in this PR are covered in the following automated tests:
Manual testing
This section is mandatory for all contributions. If you believe no manual test is necessary, please state so explicitly. Thanks!
Documentation
MIGRATION.MD
Checklist for Maintainers
When this PR is ready for testing, make sure to add
ci:normal,ci:mergedorci:dailyGH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found incode/lib/cli-storybook/src/sandbox-templates.tsMake sure this PR contains one of the labels below:
Available labels
bug: Internal changes that fixes incorrect behavior.maintenance: User-facing maintenance tasks.dependencies: Upgrading (sometimes downgrading) dependencies.build: Internal-facing build tooling & test updates. Will not show up in release changelog.cleanup: Minor cleanup style change. Will not show up in release changelog.documentation: Documentation only changes. Will not show up in release changelog.feature request: Introducing a new feature.BREAKING CHANGE: Changes that break compatibility in some way with current major version.other: Changes that don't fit in the above categories.🦋 Canary release
This PR does not have a canary release associated. You can request a canary release of this pull request by mentioning the
@storybookjs/coreteam here.core team members can create a canary release here or locally with
gh workflow run --repo storybookjs/storybook canary-release-pr.yml --field pr=<PR_NUMBER>Greptile Summary
Refactored the csf-2-to-3 codemod to enable reuse in the csf-factories transformation, focusing on modular code structure and improved TypeScript support.
csf2to3function incode/lib/codemod/src/transforms/csf-2-to-3.tscode/lib/cli-storybook/src/codemod/helpers/story-to-csf-factory.ts