Skip to content

Conversation

@morinokami
Copy link
Contributor

@morinokami morinokami commented Nov 1, 2025

  • Add missing createFileRoute import in the example code
  • Update TanStack logo image URL (the image file was moved in the commit TanStack/tanstack.com@f63b0f0)

Summary by CodeRabbit

  • Documentation
    • Updated the Next.js migration guide with current routing patterns and examples.
    • Refreshed code samples for file-based route creation, dynamic routing, and parameter access.
    • Enhanced documentation on navigation components and data loading approaches.

@github-actions github-actions bot added the documentation Everything documentation related label Nov 1, 2025
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Nov 1, 2025

Walkthrough

This documentation change updates the Next.js migration guide to demonstrate file-based route creation using createFileRoute, parameter access via Route.useParams(), and updated Link component patterns for TanStack Router.

Changes

Cohort / File(s) Change Summary
Migration Guide Update
docs/start/framework/react/migrate-from-next-js.md
Updated code examples to replace Next.js-style page exports with createFileRoute-based Route declarations; switched parameter access from props to Route.useParams(); updated Link component usage from href to to attribute; updated image asset URL reference to TanStack Start public path.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~5 minutes

  • Verify code examples accurately reflect the new createFileRoute API and Route.useParams() patterns
  • Confirm Link component examples use correct to attribute syntax
  • Check image URL update points to valid TanStack Start public asset location

Possibly related PRs

Suggested reviewers

  • LadyBluenotes

Poem

🐰 Routes now flow through files so neat,
createFileRoute makes patterns complete,
Parameters dance with useParams() call,
Links migrate gently—to conquers them all! ✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. You can run @coderabbitai generate docstrings to improve docstring coverage.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check ✅ Passed The title "docs: fix missing import and logo URL in Migrate from Next.js" is directly related to the changeset. The raw summary confirms both changes are present: the addition of a missing createFileRoute import from @tanstack/react-router and an update to the image source URL for the TanStack logo. While the changeset includes additional documentation updates such as new routing patterns and Link usage examples, the title accurately captures two specific and real changes within the pull request.
✨ Finishing touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 1d91138 and 29f7912.

📒 Files selected for processing (1)
  • docs/start/framework/react/migrate-from-next-js.md (2 hunks)
🧰 Additional context used
📓 Path-based instructions (2)
docs/**/*.{md,mdx}

📄 CodeRabbit inference engine (AGENTS.md)

Use internal docs links relative to the docs/ folder (e.g., ./guide/data-loading)

Files:

  • docs/start/framework/react/migrate-from-next-js.md
docs/{router,start}/**

📄 CodeRabbit inference engine (AGENTS.md)

Place router docs under docs/router/ and start framework docs under docs/start/

Files:

  • docs/start/framework/react/migrate-from-next-js.md
🧠 Learnings (4)
📓 Common learnings
Learnt from: FatahChan
Repo: TanStack/router PR: 5475
File: e2e/react-start/basic-prerendering/src/routes/redirect/$target/via-beforeLoad.tsx:8-0
Timestamp: 2025-10-14T18:59:33.990Z
Learning: In TanStack Router e2e test files, when a route parameter is validated at the route level (e.g., using zod in validateSearch or param validation), switch statements on that parameter do not require a default case, as the validation ensures only expected values will reach the switch.
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-09-23T17:36:12.598Z
Learning: Applies to docs/{router,start}/** : Place router docs under docs/router/ and start framework docs under docs/start/
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-09-23T17:36:12.598Z
Learning: Applies to docs/**/*.{md,mdx} : Use internal docs links relative to the docs/ folder (e.g., ./guide/data-loading)
📚 Learning: 2025-09-23T17:36:12.598Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-09-23T17:36:12.598Z
Learning: Applies to packages/{react-router,solid-router}/** : Implement React and Solid bindings/components only in packages/react-router/ and packages/solid-router/

Applied to files:

  • docs/start/framework/react/migrate-from-next-js.md
📚 Learning: 2025-09-23T17:36:12.598Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-09-23T17:36:12.598Z
Learning: Applies to docs/{router,start}/** : Place router docs under docs/router/ and start framework docs under docs/start/

Applied to files:

  • docs/start/framework/react/migrate-from-next-js.md
📚 Learning: 2025-09-23T17:36:12.598Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-09-23T17:36:12.598Z
Learning: Applies to **/src/routes/** : Place file-based routes under src/routes/ directories

Applied to files:

  • docs/start/framework/react/migrate-from-next-js.md
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
  • GitHub Check: Preview
🔇 Additional comments (2)
docs/start/framework/react/migrate-from-next-js.md (2)

191-191: Missing import correctly added.

The createFileRoute import is properly added and necessary for the example code that uses it on line 194. The import statement is correctly formatted.


203-203: Logo URL update is valid and verified.

The TanStack logo URL in docs/start/framework/react/migrate-from-next-js.md line 203 correctly points to an accessible image on GitHub. The URL returns a valid 512×512 PNG image as expected, confirming the update aligns with the repository changes.


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.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@nx-cloud
Copy link

nx-cloud bot commented Nov 1, 2025

View your CI Pipeline Execution ↗ for commit 29f7912

Command Status Duration Result
nx affected --targets=test:eslint,test:unit,tes... ✅ Succeeded <1s View ↗
nx run-many --target=build --exclude=examples/*... ✅ Succeeded 4s View ↗

☁️ Nx Cloud last updated this comment at 2025-11-01 08:32:40 UTC

@pkg-pr-new
Copy link

pkg-pr-new bot commented Nov 1, 2025

More templates

@tanstack/arktype-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/arktype-adapter@5718

@tanstack/directive-functions-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/directive-functions-plugin@5718

@tanstack/eslint-plugin-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/eslint-plugin-router@5718

@tanstack/history

npm i https://pkg.pr.new/TanStack/router/@tanstack/history@5718

@tanstack/nitro-v2-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/nitro-v2-vite-plugin@5718

@tanstack/react-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router@5718

@tanstack/react-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-devtools@5718

@tanstack/react-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-ssr-query@5718

@tanstack/react-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start@5718

@tanstack/react-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-client@5718

@tanstack/react-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-server@5718

@tanstack/router-cli

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-cli@5718

@tanstack/router-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-core@5718

@tanstack/router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools@5718

@tanstack/router-devtools-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools-core@5718

@tanstack/router-generator

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-generator@5718

@tanstack/router-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-plugin@5718

@tanstack/router-ssr-query-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-ssr-query-core@5718

@tanstack/router-utils

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-utils@5718

@tanstack/router-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-vite-plugin@5718

@tanstack/server-functions-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/server-functions-plugin@5718

@tanstack/solid-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router@5718

@tanstack/solid-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-devtools@5718

@tanstack/solid-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-ssr-query@5718

@tanstack/solid-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start@5718

@tanstack/solid-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-client@5718

@tanstack/solid-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-server@5718

@tanstack/start-client-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-client-core@5718

@tanstack/start-plugin-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-plugin-core@5718

@tanstack/start-server-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-server-core@5718

@tanstack/start-static-server-functions

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-static-server-functions@5718

@tanstack/start-storage-context

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-storage-context@5718

@tanstack/valibot-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/valibot-adapter@5718

@tanstack/virtual-file-routes

npm i https://pkg.pr.new/TanStack/router/@tanstack/virtual-file-routes@5718

@tanstack/zod-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/zod-adapter@5718

commit: 29f7912

@schiller-manuel schiller-manuel merged commit dd87dbe into TanStack:main Nov 2, 2025
6 checks passed
roduyemi pushed a commit to roduyemi/oss-router that referenced this pull request Nov 19, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentation Everything documentation related

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants