CLI: Add react-vite to tanstack-react automigration#34718
Merged
Conversation
Co-authored-by: Copilot <copilot@github.com>
Co-authored-by: Copilot <copilot@github.com>
huang-julien
added
feature request
cli
automigrations
ci:normal
ci:docs
Contributor
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
📝 WalkthroughWalkthroughAdds an automigration that replaces ChangesReact-Vite → TanStack-React Automigration
Sequence DiagramsequenceDiagram
participant CLI as Automigrate CLI
participant Checker as Check Logic
participant FS as File System
participant Detector as Decorator Detector
participant Prompt as Prompt Handler
participant Transformer as Migration Runner
participant Clipboard as Clipboard
CLI->>Checker: check() for React-Vite & TanStack packages
Checker->>FS: scan package.json files
FS-->>Checker: package presence result
alt both packages present
Checker->>Detector: detectTanstackRouterDecorator()
Detector->>FS: glob candidate files (preview, configDir, stories)
FS-->>Detector: file contents
Detector-->>Checker: decorator found? (true/false)
Checker-->>CLI: return migration metadata
else missing package
Checker-->>CLI: return null
end
CLI->>Prompt: prompt() (shows old/new packages)
Prompt-->>CLI: message
CLI->>Transformer: run() perform migration
Transformer->>FS: update package.json (remove/add packages)
Transformer->>FS: transform `.storybook/main.*` (replace framework)
Transformer->>FS: transform imports via transformImportFiles
FS-->>Transformer: write results
alt decorator detected & no --yes
Transformer->>Prompt: ask to copy AI prompt
Prompt-->>Transformer: user confirms
Transformer->>Clipboard: copy AI migration prompt
Clipboard-->>CLI: clipboard contains prompt
end
Estimated Code Review Effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly Related PRs
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (2)
code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.ts (1)
155-156: ⚡ Quick winMock behaviors inside test cases should be moved to
beforeEach.Lines 155–156 dynamically re-import and configure
globbyinside a test case, and line 264 setsprompt.confirm's resolved value inline. Both should be configured in abeforeEachblock (or a nesteddescribeblock with its ownbeforeEach) rather than inline inside the test.As per coding guidelines: "Implement mock behaviors in
beforeEachblocks in Vitest tests" and "Avoid inline mock implementations within test cases in Vitest tests."Also applies to: 264-264
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.ts` around lines 155 - 156, Move inline mock setups for globby and prompt.confirm out of individual tests into a shared beforeEach (or a nested describe with its own beforeEach): import or require globby at the top of the test module, then in beforeEach call vi.mocked(globby).mockResolvedValue(...) instead of mockResolvedValueOnce inside the test, and similarly set vi.mocked(prompt).confirm.mockResolvedValue(...) (or prompt.confirm.mockResolvedValue) in beforeEach; update tests that relied on per-test one-off values to adjust expectations or reconfigure mocks within nested beforeEach if a single-test behavior is required. Ensure you reference the existing uses of globby and prompt.confirm in the test file when moving the mocks.code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts (1)
37-45: ⚡ Quick winSimplify the import detection to avoid the static-analysis
regexp-from-variablewarning.
TANSTACK_ROUTER_PACKAGESis a static list, so there's no actual ReDoS risk, but thenew RegExp(...)construction still triggers the warning. A plain string check covers every real-world import style equally well:♻️ Proposed simplification
const fileLooksLikeTanstackRouterDecorator = (content: string): boolean => { - const importsTanstackRouter = TANSTACK_ROUTER_PACKAGES.some((pkg) => - new RegExp(`from\\s+['"]${pkg.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\$&')}['"]`).test(content) - ); + const importsTanstackRouter = TANSTACK_ROUTER_PACKAGES.some( + (pkg) => content.includes(`from '${pkg}'`) || content.includes(`from "${pkg}"`) + ); if (!importsTanstackRouter) { return false; } return TANSTACK_ROUTER_DECORATOR_MARKERS.some((marker) => content.includes(marker)); };🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts` around lines 37 - 45, The function fileLooksLikeTanstackRouterDecorator uses new RegExp(...) against each pkg from TANSTACK_ROUTER_PACKAGES which triggers the static-analysis regexp-from-variable warning; replace the RegExp test with a plain string check (e.g., content.includes(pkg) or content.indexOf(pkg) !== -1) to detect imports, keep the existing early return and the subsequent TANSTACK_ROUTER_DECORATOR_MARKERS.some(...) check unchanged so the function still returns true only when a package import and a decorator marker are present.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.ts`:
- Around line 15-40: Update the four vi.mock calls to use the spy form
(vi.mock('module', { spy: true })) instead of providing factory functions;
remove the inline factory objects for 'node:fs/promises',
'storybook/internal/node-logger', 'storybook/internal/common', and 'globby' and
instead set default mock behavior in beforeEach using
vi.mocked(readFile).mockResolvedValue(...),
vi.mocked(writeFile).mockResolvedValue(...),
vi.mocked(logger.step).mockImplementation(...)/vi.mocked(logger.error).mockImplementation(...)/vi.mocked(prompt.confirm).mockResolvedValue(...),
vi.mocked(transformImportFiles).mockResolvedValue([]), and
vi.mocked(globby).mockResolvedValue([]) so each export becomes a tracked spy
while preserving per-test configuration.
In
`@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts`:
- Around line 404-413: The clipboard write call await writeText(aiPrompt) can
throw in headless/CI environments and must be wrapped in a try-catch so the
overall run doesn't reject after a successful migration; inside the
wantsAiPrompt branch (where buildAiMigrationPrompt is called) wrap
writeText(aiPrompt) in try { await writeText(aiPrompt); logger.logBox(...) }
catch (err) { logger.warn(`Could not copy AI prompt to clipboard:
${String(err)}`); logger.logBox(...) } so the migration file writes remain
successful and a clear warning is logged instead of letting writeText propagate
an exception.
- Around line 363-366: The run function's file-scan uses globby without guarding
for configDir and without the same filters as detectTanstackRouterDecorator, so
add a guard to skip globby when configDir is falsy and apply the same glob
pattern/filters (restrict to relevant extensions and ignore node_modules/dist)
used in detectTanstackRouterDecorator; specifically update the block that
imports globby and builds configFiles/ allFiles (references: configDir, globby,
configFiles, allFiles, storiesPaths, run) to early-return or treat configFiles
as [] when configDir is undefined and pass the extension pattern and ignore
options to globby to match the check path behavior.
---
Nitpick comments:
In
`@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.ts`:
- Around line 155-156: Move inline mock setups for globby and prompt.confirm out
of individual tests into a shared beforeEach (or a nested describe with its own
beforeEach): import or require globby at the top of the test module, then in
beforeEach call vi.mocked(globby).mockResolvedValue(...) instead of
mockResolvedValueOnce inside the test, and similarly set
vi.mocked(prompt).confirm.mockResolvedValue(...) (or
prompt.confirm.mockResolvedValue) in beforeEach; update tests that relied on
per-test one-off values to adjust expectations or reconfigure mocks within
nested beforeEach if a single-test behavior is required. Ensure you reference
the existing uses of globby and prompt.confirm in the test file when moving the
mocks.
In
`@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts`:
- Around line 37-45: The function fileLooksLikeTanstackRouterDecorator uses new
RegExp(...) against each pkg from TANSTACK_ROUTER_PACKAGES which triggers the
static-analysis regexp-from-variable warning; replace the RegExp test with a
plain string check (e.g., content.includes(pkg) or content.indexOf(pkg) !== -1)
to detect imports, keep the existing early return and the subsequent
TANSTACK_ROUTER_DECORATOR_MARKERS.some(...) check unchanged so the function
still returns true only when a package import and a decorator marker are
present.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 9e182563-d782-46de-87b1-54f3b15d2b27
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (5)
MIGRATION.mdcode/lib/cli-storybook/package.jsoncode/lib/cli-storybook/src/automigrate/fixes/index.tscode/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.tscode/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts
Package BenchmarksCommit: The following packages have significant changes to their size or dependencies:
|
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 186 | 186 | 0 |
| Self size | 79 KB | 79 KB | 🚨 +48 B 🚨 |
| Dependency size | 32.92 MB | 32.94 MB | 🚨 +16 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
@storybook/ember
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 190 | 190 | 0 |
| Self size | 15 KB | 15 KB | 0 B |
| Dependency size | 29.64 MB | 29.65 MB | 🚨 +16 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
@storybook/nextjs
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 536 | 536 | 0 |
| Self size | 651 KB | 651 KB | 0 B |
| Dependency size | 61.04 MB | 61.05 MB | 🚨 +16 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
@storybook/react-webpack5
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 273 | 273 | 0 |
| Self size | 23 KB | 23 KB | 0 B |
| Dependency size | 45.59 MB | 45.60 MB | 🚨 +16 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
@storybook/server-webpack5
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 198 | 198 | 0 |
| Self size | 16 KB | 16 KB | 0 B |
| Dependency size | 34.18 MB | 34.20 MB | 🚨 +16 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
@storybook/cli
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 194 | 194 | 0 |
| Self size | 890 KB | 906 KB | 🚨 +16 KB 🚨 |
| Dependency size | 84.49 MB | 84.48 MB | 🎉 -1 KB 🎉 |
| Bundle Size Analyzer | Link | Link |
@storybook/preset-react-webpack
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 166 | 166 | 0 |
| Self size | 18 KB | 18 KB | 0 B |
| Dependency size | 31.93 MB | 31.94 MB | 🚨 +16 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
Contributor
There was a problem hiding this comment.
♻️ Duplicate comments (2)
code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts (1)
363-366:⚠️ Potential issue | 🟠 Major | ⚡ Quick winGuard
configDirand apply the same filtered globby pattern used incheck.Line 365 currently does an unguarded broad glob (
${configDir}/**/*). This can degrade scan behavior and skip intended rewrite targets whenconfigDiris absent/invalid. Mirror the guarded, extension-filtered scan used indetectTanstackRouterDecorator.🛡️ Targeted fix
-// eslint-disable-next-line depend/ban-dependencies -const { globby } = await import('globby'); -const configFiles = await globby([`${configDir}/**/*`]); +// eslint-disable-next-line depend/ban-dependencies +const { globby } = await import('globby'); +const configFiles = configDir + ? await globby([`${configDir}/**/*.{ts,tsx,js,jsx,mjs,cjs}`], { + ignore: ['**/node_modules/**', '**/dist/**'], + }) + : []; const allFiles = [...storiesPaths, ...configFiles].filter(Boolean) as string[];#!/bin/bash target="code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts" # Compare globby usage in check vs run blocks rg -n "detectTanstackRouterDecorator|const configFiles =|globby\\(" "$target" -C 3🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts` around lines 363 - 366, The current unguarded glob using globby for `${configDir}/**/*` can run when configDir is absent or invalid and misses extension filtering; update the block that defines configFiles (the const configFiles = await globby(...) usage) to first guard that configDir is truthy and only call globby when it is, and use the same extension-filtered glob pattern and options used by detectTanstackRouterDecorator (i.e., limit to relevant file extensions and any ignore patterns), then merge with storiesPaths into allFiles as before; ensure references to configDir, configFiles, storiesPaths, and allFiles are preserved so the downstream logic remains unchanged.code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.ts (1)
15-44:⚠️ Potential issue | 🟠 Major | ⚡ Quick winSwitch these Vitest mocks to
spy: trueand move default implementations intobeforeEach.At Line 15-44, mocks are still factory-based, and at Line 35/39/43/53-54 default behaviors are defined outside
beforeEach. This is still violating the repo’s Vitest mock policy.♻️ Minimal alignment patch
-vi.mock('node:fs/promises', () => ({ - readFile: vi.fn(), - writeFile: vi.fn(), -})); +vi.mock('node:fs/promises', { spy: true }); -vi.mock('storybook/internal/node-logger', () => ({ - logger: { - step: vi.fn(), - debug: vi.fn(), - warn: vi.fn(), - log: vi.fn(), - error: vi.fn(), - logBox: vi.fn(), - }, - prompt: { - confirm: vi.fn(), - }, -})); +vi.mock('storybook/internal/node-logger', { spy: true }); -vi.mock('storybook/internal/common', () => ({ - transformImportFiles: vi.fn().mockResolvedValue([]), -})); +vi.mock('storybook/internal/common', { spy: true }); -vi.mock('globby', () => ({ - globby: vi.fn().mockResolvedValue([]), -})); +vi.mock('globby', { spy: true }); -vi.mock('tinyclip', () => ({ - writeText: vi.fn().mockResolvedValue(undefined), -})); +vi.mock('tinyclip', { spy: true });#!/bin/bash target="code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.ts" # 1) Find factory-style vi.mock calls (should be none after fix) rg -nP "vi\.mock\([^,]+,\s*\(\)\s*=>" "$target" # 2) Spot inline default mock implementations outside beforeEach (quick signal) rg -n "mockResolvedValue\(" "$target"As per coding guidelines, "Use
vi.mock()with thespy: trueoption for all package and file mocks in Vitest tests", "Implement mock behaviors inbeforeEachblocks in Vitest tests", and "Avoid mock implementations outside ofbeforeEachblocks in Vitest tests."Also applies to: 53-63
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.ts` around lines 15 - 44, Replace the factory-style vi.mock calls with spy-based mocks (add { spy: true } to each vi.mock for 'node:fs/promises', 'storybook/internal/node-logger', 'storybook/internal/common', 'globby', and 'tinyclip') and remove their inline factory implementations; then move all default mock behaviors (readFile/writeFile, logger.step/debug/warn/log/error/logBox and prompt.confirm, transformImportFiles, globby, and tinyclip.writeText) into a beforeEach block where you set up the spies (e.g., vi.mocked(...).mockResolvedValue / mockImplementation as needed) so no mockResolvedValue or default implementations exist outside beforeEach and all vi.mock calls use the spy:true option.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Duplicate comments:
In
`@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.ts`:
- Around line 15-44: Replace the factory-style vi.mock calls with spy-based
mocks (add { spy: true } to each vi.mock for 'node:fs/promises',
'storybook/internal/node-logger', 'storybook/internal/common', 'globby', and
'tinyclip') and remove their inline factory implementations; then move all
default mock behaviors (readFile/writeFile,
logger.step/debug/warn/log/error/logBox and prompt.confirm,
transformImportFiles, globby, and tinyclip.writeText) into a beforeEach block
where you set up the spies (e.g., vi.mocked(...).mockResolvedValue /
mockImplementation as needed) so no mockResolvedValue or default implementations
exist outside beforeEach and all vi.mock calls use the spy:true option.
In
`@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts`:
- Around line 363-366: The current unguarded glob using globby for
`${configDir}/**/*` can run when configDir is absent or invalid and misses
extension filtering; update the block that defines configFiles (the const
configFiles = await globby(...) usage) to first guard that configDir is truthy
and only call globby when it is, and use the same extension-filtered glob
pattern and options used by detectTanstackRouterDecorator (i.e., limit to
relevant file extensions and any ignore patterns), then merge with storiesPaths
into allFiles as before; ensure references to configDir, configFiles,
storiesPaths, and allFiles are preserved so the downstream logic remains
unchanged.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: d6899a7c-6f0c-43ba-b8ff-3ceb15680393
📒 Files selected for processing (2)
code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.tscode/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts`:
- Around line 365-370: The current allFiles array (built from storiesPaths and
configFiles) omits previewConfigPath so preview imports may not be rewritten;
modify the code that builds allFiles (referencing configDir, configFiles,
storiesPaths, and allFiles) to also include previewConfigPath (if defined) in
the spread, e.g. [...storiesPaths, ...configFiles, previewConfigPath], then
dedupe/filter falsy values as before so the preview file is always considered
for import-rewrite even when configDir is missing or unexpected.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: b92242f6-7289-46f0-b3bb-7caaf8695ec3
📒 Files selected for processing (2)
code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.tscode/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts
🚧 Files skipped from review as they are similar to previous changes (1)
- code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.test.ts
…stack-react.ts Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts (1)
37-45: ⚡ Quick winExport
fileLooksLikeTanstackRouterDecoratorto enable direct unit testing.This function encapsulates non-trivial two-step detection logic (package import + marker matching) that deserves targeted unit tests independent of the file I/O in
detectTanstackRouterDecorator. As per coding guidelines, "Export functions that need direct tests to ensure they can be unit tested."♻️ Proposed change
-const fileLooksLikeTanstackRouterDecorator = (content: string): boolean => { +export const fileLooksLikeTanstackRouterDecorator = (content: string): boolean => {As per coding guidelines: "Export functions that need direct tests to ensure they can be unit tested."
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts` around lines 37 - 45, The function fileLooksLikeTanstackRouterDecorator currently is unexported and should be exported so it can be unit-tested directly; update its declaration to export the function (export const fileLooksLikeTanstackRouterDecorator = ...) and ensure any existing imports/exports in the module remain consistent (adjust any default export or index re-exports if needed) so tests can import fileLooksLikeTanstackRouterDecorator and exercise its two-step logic (TANSTACK_ROUTER_PACKAGES and TANSTACK_ROUTER_DECORATOR_MARKERS checks).
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts`:
- Around line 294-309: The loop collects packageJsonFiles but those values
(packageJsonFiles, result.packageJsonFiles, result.hasReactVitePackage,
result.hasTanstackRouter) are never used by check/run, causing unnecessary I/O;
either remove the packageJsonFiles array and its field from the check result and
stop reading package.json files in check, or wire the collected packageJsonFiles
into run (e.g., pass result.packageJsonFiles to
packageManager.removeDependencies) and update run to scope removals to only
those package.json paths; locate the collection in the function containing the
packageJsonFiles variable and the consumers check/run that inspect
result.hasTanstackRouterDecorator and packageManager.removeDependencies to
implement one of these two fixes.
---
Nitpick comments:
In
`@code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts`:
- Around line 37-45: The function fileLooksLikeTanstackRouterDecorator currently
is unexported and should be exported so it can be unit-tested directly; update
its declaration to export the function (export const
fileLooksLikeTanstackRouterDecorator = ...) and ensure any existing
imports/exports in the module remain consistent (adjust any default export or
index re-exports if needed) so tests can import
fileLooksLikeTanstackRouterDecorator and exercise its two-step logic
(TANSTACK_ROUTER_PACKAGES and TANSTACK_ROUTER_DECORATOR_MARKERS checks).
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 76170a44-2459-49b6-af28-a953a8f1ac69
📒 Files selected for processing (1)
code/lib/cli-storybook/src/automigrate/fixes/react-vite-to-tanstack-react.ts
Co-authored-by: Copilot <copilot@github.com>
…ookjs/storybook into feat/tanstack_automigrate
Contributor
|
@huang-julien — Please also update the docs to include the equivalent of this section of the |
Co-authored-by: Copilot <copilot@github.com>
…ookjs/storybook into feat/tanstack_automigrate
8 tasks
Co-authored-by: Copilot <copilot@github.com>
JReinhold
changed the title
JReinhold
requested changes
May 7, 2026
JReinhold
approved these changes
May 7, 2026
15 tasks
8 tasks
32 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
#34284
What I did
This PR adds the automigration from react(-vite to tanstack-react.
It does the basics from migration then ask if the user needs an AI prompt to migrate the whole project. It also update thhe migration.md file
Checklist for Contributors
Testing
The changes in this PR are covered in the following automated tests:
Manual testing
Verify on any OSS tanstack start/router project that the command works correctly
Caution
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 pull request has been released as version
0.0.0-pr-34718-sha-a8323eee. Try it out in a new sandbox by runningnpx storybook@0.0.0-pr-34718-sha-a8323eee sandboxor in an existing project withnpx storybook@0.0.0-pr-34718-sha-a8323eee upgrade.More information
0.0.0-pr-34718-sha-a8323eeefeat/tanstack_automigratea8323eee1778059553)To request a new release of this pull request, mention the
@storybookjs/coreteam.core team members can create a new canary release here or locally with
gh workflow run --repo storybookjs/storybook publish.yml --field pr=34718Summary by CodeRabbit
New Features
Documentation
Tests
Chores