docs: split i18n guides (router and start) #6363
Conversation
📝 WalkthroughWalkthroughThis PR adds a dedicated React Internationalization (i18n) guide, removes i18n material from the path-params guide, updates Start-specific i18n docs, adjusts navigation entries, and revises Paraglide-centered examples and Vite configs (notably removing Changes
Sequence Diagram(s)(Skipped — changes are documentation and example updates without new multi-component runtime control flow.) Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. 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 |
|
| Command | Status | Duration | Result |
|---|---|---|---|
nx affected --targets=test:eslint,test:unit,tes... |
❌ Failed | 1m 20s | View ↗ |
nx run-many --target=build --exclude=examples/*... |
✅ Succeeded | 2s | View ↗ |
☁️ Nx Cloud last updated this comment at 2026-01-14 14:32:52 UTC
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 6
🤖 Fix all issues with AI agents
In @docs/router/config.json:
- Line 330: The "to" path value contains a typo: change the string
"framework/react/guide/Internationalization-18n" to
"framework/react/guide/Internationalization-i18n" so the navigation link
resolves correctly; update the "to" field where that exact value appears in the
config JSON.
In @docs/start/config.json:
- Line 182: The link target string
"framework/react/guide/Internationalization-i18n" has a capitalization mismatch
with the actual file name; update the config entry to use the lowercase path
"framework/react/guide/internationalization-i18n" so the route matches the
actual filename (adjust the value for the key that currently contains "to":
"framework/react/guide/Internationalization-i18n").
In @docs/start/framework/react/guide/internationalization-i18n.md:
- Around line 47-49: Correct the typo in the documentation heading by changing
"Set the lang atribute in html" to "Set the lang attribute in html" (refers to
the instruction about setting lang in __root.tsx); update the phrase wherever
present in this markdown to replace "atribute" with "attribute".
In @examples/react/i18n-paraglide/README.md:
- Line 47: The README sentence "If you use TanStack Start and do not need
offline capabilities, you don`t need to use the shouldRedirect logic, only
paraglideMiddleware in the TanStack Start Paraglide integration guide." has a
backtick in "don`t" — replace the backtick with a proper apostrophe so it reads
"don't"; update that line in examples/react/i18n-paraglide/README.md where the
sentence appears.
In @examples/react/start-i18n-paraglide/README.md:
- Around line 124-126: Fix the typo in the README sentence: change "Set the lang
atribute in html at __root.tsx:" to "Set the lang attribute in html at
__root.tsx:" so "atribute" is corrected to "attribute" in the HTML Language
Attribute section.
- Line 112: The heading "#### Server Middleware (SSR)" violates the markdown
heading sequence after the "## Type-safe Translated Pathnames" section; change
"#### Server Middleware (SSR)" to "### Server Middleware (SSR)" to restore
proper h2→h3 progression, or alternatively change the subsections under
"Type-safe Translated Pathnames" to be h3 so the current h4 becomes valid—update
the heading text "Server Middleware (SSR)" accordingly in the README.
🧹 Nitpick comments (2)
examples/react/i18n-paraglide/README.md (1)
100-109: Consider adding a comment about the locale order.The examples show English and Spanish locales, but the order might not be obvious to readers. It would be helpful to clarify which locale is the base locale and how the order affects the routing behavior, especially since the vite config changes in this PR remove the
/enprefix.docs/start/framework/react/guide/internationalization-i18n.md (1)
18-18: Verify link format for internal documentation references.Lines 18 and 33 use absolute URLs to tanstack.com. Per the coding guidelines, internal documentation references should use relative links to the
docs/folder format (e.g.,./guide/data-loading). Verify if these should be converted to relative links pointing to the companion i18n guide in the router documentation.Also applies to: 33-33
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (9)
docs/router/config.jsondocs/router/framework/react/guide/internationalization-i18n.mddocs/router/framework/react/guide/path-params.mddocs/start/config.jsondocs/start/framework/react/guide/internationalization-i18n.mde2e/react-start/i18n-paraglide/vite.config.tsexamples/react/i18n-paraglide/README.mdexamples/react/start-i18n-paraglide/README.mdexamples/react/start-i18n-paraglide/vite.config.ts
💤 Files with no reviewable changes (1)
- docs/router/framework/react/guide/path-params.md
🧰 Additional context used
📓 Path-based instructions (3)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Use TypeScript strict mode with extensive type safety for all code
Files:
examples/react/start-i18n-paraglide/vite.config.tse2e/react-start/i18n-paraglide/vite.config.ts
**/*.{js,ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Implement ESLint rules for router best practices using the ESLint plugin router
Files:
examples/react/start-i18n-paraglide/vite.config.tse2e/react-start/i18n-paraglide/vite.config.ts
docs/**/*.{md,mdx}
📄 CodeRabbit inference engine (AGENTS.md)
Use relative links to
docs/folder format (e.g.,./guide/data-loading) for internal documentation references
Files:
docs/start/framework/react/guide/internationalization-i18n.mddocs/router/framework/react/guide/internationalization-i18n.md
🧠 Learnings (9)
📓 Common learnings
Learnt from: schiller-manuel
Repo: TanStack/router PR: 6211
File: e2e/react-start/i18n-paraglide/src/server.ts:6-6
Timestamp: 2025-12-24T22:47:44.320Z
Learning: In TanStack Router projects using `inlang/paraglide-js`, the callback passed to `paraglideMiddleware` should use `() => handler.fetch(req)` (referencing the outer `req`) instead of `({ request }) => handler.fetch(request)`. This is intentional because the router needs the untouched URL to perform its own rewrite logic with `deLocalizeUrl`/`localizeUrl`. The middleware's processed request would delocalize the URL and interfere with the router's rewrite handling.
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-06T15:03:07.223Z
Learning: Applies to **/*.{js,ts,tsx} : Implement ESLint rules for router best practices using the ESLint plugin router
📚 Learning: 2025-12-24T22:47:44.320Z
Learnt from: schiller-manuel
Repo: TanStack/router PR: 6211
File: e2e/react-start/i18n-paraglide/src/server.ts:6-6
Timestamp: 2025-12-24T22:47:44.320Z
Learning: In TanStack Router projects using `inlang/paraglide-js`, the callback passed to `paraglideMiddleware` should use `() => handler.fetch(req)` (referencing the outer `req`) instead of `({ request }) => handler.fetch(request)`. This is intentional because the router needs the untouched URL to perform its own rewrite logic with `deLocalizeUrl`/`localizeUrl`. The middleware's processed request would delocalize the URL and interfere with the router's rewrite handling.
Applied to files:
examples/react/i18n-paraglide/README.mdexamples/react/start-i18n-paraglide/README.mddocs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-21T12:52:35.231Z
Learnt from: Sheraff
Repo: TanStack/router PR: 6171
File: packages/router-core/src/new-process-route-tree.ts:898-898
Timestamp: 2025-12-21T12:52:35.231Z
Learning: In `packages/router-core/src/new-process-route-tree.ts`, the matching logic intentionally allows paths without trailing slashes to match index routes with trailing slashes (e.g., `/a` can match `/a/` route), but not vice-versa (e.g., `/a/` cannot match `/a` layout route). This is implemented via the condition `!pathIsIndex || node.kind === SEGMENT_TYPE_INDEX` and is a deliberate design decision to provide better UX by being permissive with missing trailing slashes.
Applied to files:
examples/react/i18n-paraglide/README.mdexamples/react/start-i18n-paraglide/README.mddocs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-09-28T21:41:45.233Z
Learnt from: nlynzaad
Repo: TanStack/router PR: 5284
File: e2e/react-start/basic/server.js:50-0
Timestamp: 2025-09-28T21:41:45.233Z
Learning: In Express v5, catch-all routes must use named wildcards. Use `/*splat` to match everything except root path, or `/{*splat}` (with braces) to match including root path. The old `*` syntax is not allowed and will cause "Missing parameter name" errors. This breaking change requires explicit naming of wildcard parameters.
Applied to files:
examples/react/i18n-paraglide/README.mdexamples/react/start-i18n-paraglide/README.md
📚 Learning: 2025-10-14T18:59:33.990Z
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.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-09-22T00:56:53.426Z
Learnt from: nlynzaad
Repo: TanStack/router PR: 5182
File: e2e/react-router/basic-file-based/tests/non-nested-paths.spec.ts:167-172
Timestamp: 2025-09-22T00:56:53.426Z
Learning: In TanStack Router, underscores are intentionally stripped from route segments during path parsing, but preserved in base path segments. This is the expected behavior implemented in PR #5182.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-06T15:03:07.223Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-06T15:03:07.223Z
Learning: Applies to **/*.{js,ts,tsx} : Implement ESLint rules for router best practices using the ESLint plugin router
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-06T15:03:07.223Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-06T15:03:07.223Z
Learning: Implement type-safe routing with search params and path params
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-10-01T18:30:26.591Z
Learnt from: schiller-manuel
Repo: TanStack/router PR: 5330
File: packages/router-core/src/router.ts:2231-2245
Timestamp: 2025-10-01T18:30:26.591Z
Learning: In `packages/router-core/src/router.ts`, the `resolveRedirect` method intentionally strips the router's origin from redirect URLs when they match (e.g., `https://foo.com/bar` → `/bar` for same-origin redirects) while preserving the full URL for cross-origin redirects. This logic should not be removed or simplified to use `location.publicHref` directly.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
🪛 LanguageTool
docs/start/framework/react/guide/internationalization-i18n.md
[style] ~47-~47: This phrase is redundant (‘L’ stands for ‘language’). Use simply “HTML”.
Context: ...=> handler.fetch(req)) }, } ``` #### HTML Language Attribute Set the lang atribute in htm...
(ACRONYM_TAUTOLOGY)
[grammar] ~49-~49: Ensure spelling is correct
Context: ...# HTML Language Attribute Set the lang atribute in html at __root.tsx: ```tsx import...
(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_1)
examples/react/start-i18n-paraglide/README.md
[style] ~124-~124: This phrase is redundant (‘L’ stands for ‘language’). Use simply “HTML”.
Context: ...=> handler.fetch(req)) }, } ``` #### HTML Language Attribute Set the lang atribute in htm...
(ACRONYM_TAUTOLOGY)
[grammar] ~126-~126: Ensure spelling is correct
Context: ...# HTML Language Attribute Set the lang atribute in html at __root.tsx: ```tsx import...
(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_1)
docs/router/framework/react/guide/internationalization-i18n.md
[grammar] ~147-~147: Use a hyphen to join words.
Context: ... also create more sophisticated language switching logic: ```tsx function Advanc...
(QB_NEW_EN_HYPHEN)
🪛 markdownlint-cli2 (0.18.1)
examples/react/start-i18n-paraglide/README.md
112-112: Heading levels should only increment by one level at a time
Expected: h3; Actual: h4
(MD001, heading-increment)
🔇 Additional comments (6)
e2e/react-start/i18n-paraglide/vite.config.ts (1)
20-20: LGTM! English locale now uses root paths without prefix.The changes simplify English URL paths by removing the
/enprefix, making English the default/base locale. This is a common i18n pattern where the primary locale is served without a prefix while other locales (like German at/de) retain their prefix.Also applies to: 27-27, 34-34
examples/react/i18n-paraglide/README.md (1)
54-55: Verify the import path is correct.The import uses
@reland/i18n/runtimewhich doesn't match the Paraglide setup shown earlier in the document (which uses./paraglide/runtime). This might be example code from a different project or could be a mistake.Should this import be
./paraglide/runtimeto match the setup in lines 23 and 37, or is@reland/i18n/runtimean intentional path alias/package reference?examples/react/start-i18n-paraglide/vite.config.ts (1)
20-20: LGTM! Consistent with e2e configuration.The URL localization changes match the updates in
e2e/react-start/i18n-paraglide/vite.config.ts, establishing a consistent pattern where English serves as the default locale without a URL prefix while German retains the/deprefix.Also applies to: 27-27, 34-34
examples/react/start-i18n-paraglide/README.md (1)
39-39: Verify the@reland/i18n/runtimeimport.The code imports from
@reland/i18n/runtime, which doesn't appear to be a valid package in the TanStack ecosystem. This import statement appears in multiple places (lines 39, 402, 440 in File 3). Verify if this should reference Paraglide's locale utilities instead or if it's a placeholder that needs to be corrected.🤔 What should this import be?
Based on the Paraglide integration context, this might need to be:
- A custom locale type definition
- An import from
@inlang/paraglide-jsor similar- Or left as-is if it's a custom application module
Please verify and update if necessary.
Also applies to: 402-402, 440-440
docs/router/framework/react/guide/internationalization-i18n.md (2)
402-402: Verify the@reland/i18n/runtimeimport.The code imports from
@reland/i18n/runtime(lines 402, 448-456), which doesn't appear to be a valid package. This same import issue appears in File 2 as well. Verify if this should reference a custom locale type, Paraglide's utilities, or another source. Ensure the import is updated to match your actual i18n library setup.Also applies to: 448-456
147-147: Minor grammar note: Consider hyphenation in "language switching".Static analysis suggests "language switching" could be hyphenated as "language-switching" in certain contexts. However, this is a stylistic choice and not critical. The current usage is acceptable in documentation.
| - Compiler feedback for routing mistakes | ||
| You can use the `localizeHref` function to map the routes to localized versions and import into the pages option in the TanStack Start plugin. For this to work you will need to compile paraglide before the build with the CLI. | ||
| #### Server Middleware (SSR) |
There was a problem hiding this comment.
Fix markdown heading level structure.
Line 112 starts a section with #### Server Middleware (SSR), but this violates the markdown heading increment rule (MD001). The preceding section "## Type-safe Translated Pathnames" is at h2, so the next heading should be h3, not h4. This creates a gap in the heading hierarchy.
📝 Proposed fix
-#### Server Middleware (SSR)
+### Server Middleware (SSR)Alternatively, restructure the "Type-safe Translated Pathnames" section to use h3 headings for its subsections.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| #### Server Middleware (SSR) | |
| ### Server Middleware (SSR) |
🧰 Tools
🪛 markdownlint-cli2 (0.18.1)
112-112: Heading levels should only increment by one level at a time
Expected: h3; Actual: h4
(MD001, heading-increment)
🤖 Prompt for AI Agents
In @examples/react/start-i18n-paraglide/README.md at line 112, The heading "####
Server Middleware (SSR)" violates the markdown heading sequence after the "##
Type-safe Translated Pathnames" section; change "#### Server Middleware (SSR)"
to "### Server Middleware (SSR)" to restore proper h2→h3 progression, or
alternatively change the subsections under "Type-safe Translated Pathnames" to
be h3 so the current h4 becomes valid—update the heading text "Server Middleware
(SSR)" accordingly in the README.
There was a problem hiding this comment.
Actionable comments posted: 10
🤖 Fix all issues with AI agents
In `@docs/router/framework/react/guide/internationalization-i18n.md`:
- Line 395: The sentence contains a typographical error: replace the backtick in
"don`t" with a proper apostrophe so the phrase reads "don't"; update the text
"If you use TanStack Start and do not need offline capabilities, you don`t need
to use the shouldRedirect logic, only paraglideMiddleware in the TanStack Start
Paraglide integration guide." to use "don't" instead of "don`t".
- Line 399: The fragment "If you use translated pathnames." is incomplete—merge
it with the following sentence so it reads as a single, complete sentence; for
example, change the two lines to: "If you use translated pathnames, you can
ensure every route has translations by deriving translated pathnames directly
from the TanStack Router route tree." Make the edit where the exact phrases "If
you use translated pathnames." and "To ensure every route has translations, you
can derive translated pathnames directly from the TanStack Router route tree."
appear.
- Around line 448-457: The code sample for translatedPathnames using
createTranslatedPathnames is missing the closing characters; update the example
by adding the missing closing "})" (i.e., close the object and the function
call) so the createTranslatedPathnames({ ... }) invocation for
translatedPathnames is syntactically complete.
In `@docs/start/framework/react/guide/internationalization-i18n.md`:
- Line 20: The fragment "If you already set up the TanStack Router with i18n."
is an incomplete sentence; merge it with the following line to form a complete
clause (e.g., "If you already set up the TanStack Router with i18n, this guide
will be suitable when:") by updating the text in the document where the sentence
fragment appears so the two parts read as a single complete sentence.
- Line 33: The link for "TanStack Router + Paraglide integration guide" uses an
absolute URL; update that markdown link to a relative docs path (pointing to the
corresponding Router guide and anchor) so internal references use the docs/
relative format instead of https://tanstack.com/.... Locate the link text
"TanStack Router + Paraglide integration guide" in internationalization-i18n.md
and replace the full external URL with the proper relative path to the Router
guide and its anchor (verify the exact relative path/anchor within the docs
folder before committing).
- Line 18: Fix the typo "TansTack" to "TanStack" in the sentence that begins
"The base of this guide is built with TansTack Router..." and replace the
absolute URL in the link text "[i18n in TanStack
Router](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n)"
with the repository's relative path to the TanStack Router guide (use the local
docs path for the Router guide so it remains an internal link); keep the visible
link text unchanged.
In `@examples/react/i18n-paraglide/README.md`:
- Around line 100-109: The code block defining translatedPathnames calling
createTranslatedPathnames is missing the closing braces and parenthesis plus the
closing triple backticks; fix the call to translatedPathnames by adding the
closing "})" to complete createTranslatedPathnames({...}) and then close the
fenced code block with "```" so the snippet becomes a valid code block and the
createTranslatedPathnames invocation is syntactically complete.
- Line 51: Replace the sentence fragment "If you use translated pathnames." with
a complete sentence by merging it with the following sentence so it reads
something like: "If you use translated pathnames, derive translated pathnames
directly from the TanStack Router route tree to ensure every route has
translations." Update the README line so the fragment is removed and the
combined sentence is grammatically correct.
In `@examples/react/start-i18n-paraglide/README.md`:
- Line 36: The sentence fragment "If you use translated pathnames." is
incomplete; replace it with a full sentence such as: "If you use translated
pathnames, ensure every route has translations by deriving translated pathnames
directly from the TanStack Router route tree." Update the README.md line
containing that fragment (around the sentence starting with "If you use
translated pathnames") to this rephrased complete sentence so the guidance reads
clearly and flows with the following sentence.
- Around line 85-94: The example’s createTranslatedPathnames call is missing its
closing characters, breaking the code block; update the example where exported
translatedPathnames is defined to properly close the object and function call
(add the missing "})" and terminate the statement) so the
createTranslatedPathnames({...}) invocation for translatedPathnames is
syntactically complete.
♻️ Duplicate comments (1)
examples/react/start-i18n-paraglide/README.md (1)
112-112: Fix markdown heading level structure.The heading
#### Server Middleware (SSR)at line 112 violates the MD001 heading increment rule. The previous section uses##(h2) level headings, so this should be###(h3) instead of####(h4).📝 Proposed fix
-#### Server Middleware (SSR) +### Server Middleware (SSR)Also update the other h4 headings for consistency:
- Line 124:
#### HTML Language Attribute→### HTML Language Attribute- Line 146:
#### Prerendering Localized Routes→### Prerendering Localized Routes
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
docs/router/config.jsondocs/router/framework/react/guide/internationalization-i18n.mddocs/start/config.jsondocs/start/framework/react/guide/internationalization-i18n.mdexamples/react/i18n-paraglide/README.mdexamples/react/start-i18n-paraglide/README.md
🧰 Additional context used
📓 Path-based instructions (1)
docs/**/*.{md,mdx}
📄 CodeRabbit inference engine (AGENTS.md)
Use relative links to
docs/folder format (e.g.,./guide/data-loading) for internal documentation references
Files:
docs/router/framework/react/guide/internationalization-i18n.mddocs/start/framework/react/guide/internationalization-i18n.md
🧠 Learnings (9)
📚 Learning: 2025-12-24T22:47:44.320Z
Learnt from: schiller-manuel
Repo: TanStack/router PR: 6211
File: e2e/react-start/i18n-paraglide/src/server.ts:6-6
Timestamp: 2025-12-24T22:47:44.320Z
Learning: In TanStack Router projects using `inlang/paraglide-js`, the callback passed to `paraglideMiddleware` should use `() => handler.fetch(req)` (referencing the outer `req`) instead of `({ request }) => handler.fetch(request)`. This is intentional because the router needs the untouched URL to perform its own rewrite logic with `deLocalizeUrl`/`localizeUrl`. The middleware's processed request would delocalize the URL and interfere with the router's rewrite handling.
Applied to files:
examples/react/start-i18n-paraglide/README.mdexamples/react/i18n-paraglide/README.mddocs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-21T12:52:35.231Z
Learnt from: Sheraff
Repo: TanStack/router PR: 6171
File: packages/router-core/src/new-process-route-tree.ts:898-898
Timestamp: 2025-12-21T12:52:35.231Z
Learning: In `packages/router-core/src/new-process-route-tree.ts`, the matching logic intentionally allows paths without trailing slashes to match index routes with trailing slashes (e.g., `/a` can match `/a/` route), but not vice-versa (e.g., `/a/` cannot match `/a` layout route). This is implemented via the condition `!pathIsIndex || node.kind === SEGMENT_TYPE_INDEX` and is a deliberate design decision to provide better UX by being permissive with missing trailing slashes.
Applied to files:
examples/react/start-i18n-paraglide/README.mdexamples/react/i18n-paraglide/README.mddocs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-09-28T21:41:45.233Z
Learnt from: nlynzaad
Repo: TanStack/router PR: 5284
File: e2e/react-start/basic/server.js:50-0
Timestamp: 2025-09-28T21:41:45.233Z
Learning: In Express v5, catch-all routes must use named wildcards. Use `/*splat` to match everything except root path, or `/{*splat}` (with braces) to match including root path. The old `*` syntax is not allowed and will cause "Missing parameter name" errors. This breaking change requires explicit naming of wildcard parameters.
Applied to files:
examples/react/start-i18n-paraglide/README.mdexamples/react/i18n-paraglide/README.md
📚 Learning: 2025-09-22T00:56:49.237Z
Learnt from: nlynzaad
Repo: TanStack/router PR: 5182
File: e2e/react-router/basic-file-based/src/routes/non-nested/named/$baz_.bar.tsx:3-5
Timestamp: 2025-09-22T00:56:49.237Z
Learning: In TanStack Router, underscores are intentionally stripped from route segments (e.g., `$baz_` becomes `baz` in generated types) but should be preserved in base path segments. This is the correct behavior as of the fix in PR `#5182`.
Applied to files:
docs/start/config.json
📚 Learning: 2025-10-14T18:59:33.990Z
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.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-09-22T00:56:53.426Z
Learnt from: nlynzaad
Repo: TanStack/router PR: 5182
File: e2e/react-router/basic-file-based/tests/non-nested-paths.spec.ts:167-172
Timestamp: 2025-09-22T00:56:53.426Z
Learning: In TanStack Router, underscores are intentionally stripped from route segments during path parsing, but preserved in base path segments. This is the expected behavior implemented in PR `#5182`.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-06T15:03:07.223Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-06T15:03:07.223Z
Learning: Applies to **/*.{js,ts,tsx} : Implement ESLint rules for router best practices using the ESLint plugin router
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-06T15:03:07.223Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-06T15:03:07.223Z
Learning: Implement type-safe routing with search params and path params
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-10-01T18:30:26.591Z
Learnt from: schiller-manuel
Repo: TanStack/router PR: 5330
File: packages/router-core/src/router.ts:2231-2245
Timestamp: 2025-10-01T18:30:26.591Z
Learning: In `packages/router-core/src/router.ts`, the `resolveRedirect` method intentionally strips the router's origin from redirect URLs when they match (e.g., `https://foo.com/bar` → `/bar` for same-origin redirects) while preserving the full URL for cross-origin redirects. This logic should not be removed or simplified to use `location.publicHref` directly.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
🪛 LanguageTool
examples/react/start-i18n-paraglide/README.md
[style] ~124-~124: This phrase is redundant (‘L’ stands for ‘language’). Use simply “HTML”.
Context: ...=> handler.fetch(req)) }, } ``` #### HTML Language Attribute Set the lang attribute in ht...
(ACRONYM_TAUTOLOGY)
docs/router/framework/react/guide/internationalization-i18n.md
[grammar] ~147-~147: Use a hyphen to join words.
Context: ... also create more sophisticated language switching logic: ```tsx function Advanc...
(QB_NEW_EN_HYPHEN)
docs/start/framework/react/guide/internationalization-i18n.md
[style] ~47-~47: This phrase is redundant (‘L’ stands for ‘language’). Use simply “HTML”.
Context: ...=> handler.fetch(req)) }, } ``` #### HTML Language Attribute Set the lang attribute in ht...
(ACRONYM_TAUTOLOGY)
⏰ 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). (2)
- GitHub Check: Test
- GitHub Check: Preview
🔇 Additional comments (3)
docs/router/framework/react/guide/internationalization-i18n.md (1)
1-477: Well-structured i18n guide - LGTM overall.The guide provides comprehensive coverage of i18n patterns with TanStack Router, including prefix-based routing, type safety, SEO considerations, and Paraglide integration. The progression from library-agnostic patterns to specific Paraglide integration is well organized.
Minor issues noted separately (typo, grammar, incomplete code block).
docs/start/config.json (1)
179-183: LGTM - Navigation entry correctly added.The new i18n guide navigation entry is properly configured with correct lowercase path casing that matches the actual filename.
docs/router/config.json (1)
327-331: LGTM - Navigation entry correctly added.The new i18n guide navigation entry is properly configured with the correct path (typo "18n" → "i18n" has been fixed).
✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.
|
|
||
| # Integration with TanStack Router | ||
|
|
||
| The base of this guide is built with TansTack Router. Check out the guide on integrating [i18n in TanStack Router](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n). |
There was a problem hiding this comment.
Fix typo and use correct relative link to Router guide.
Line 18 has multiple issues:
- Typo: "TansTack" should be "TanStack"
- The link URL contains
startbut the text references "TanStack Router" - this should point to the Router guide - Per coding guidelines, use relative links instead of absolute URLs for internal documentation
📝 Proposed fix
-The base of this guide is built with TansTack Router. Check out the guide on integrating [i18n in TanStack Router](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n).
+The base of this guide is built with TanStack Router. Check out the guide on integrating [i18n in TanStack Router](../../../../router/framework/react/guide/internationalization-i18n).Note: Adjust the relative path if the Router guide is located at a different path in the repository.
Based on coding guidelines, internal documentation references should use relative links.
🤖 Prompt for AI Agents
In `@docs/start/framework/react/guide/internationalization-i18n.md` at line 18,
Fix the typo "TansTack" to "TanStack" in the sentence that begins "The base of
this guide is built with TansTack Router..." and replace the absolute URL in the
link text "[i18n in TanStack
Router](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n)"
with the repository's relative path to the TanStack Router guide (use the local
docs path for the Router guide so it remains an internal link); keep the visible
link text unchanged.
| **GitHub example:** | ||
| [https://github.com/TanStack/router/tree/main/examples/react/start-i18n-paraglide](https://github.com/TanStack/router/tree/main/examples/react/start-i18n-paraglide) | ||
|
|
||
| First, check out [TanStack Router + Paraglide integration guide](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n#tanstack-router-paraglide) |
There was a problem hiding this comment.
Use relative link for internal documentation reference.
Per coding guidelines, internal documentation links should use relative paths instead of absolute URLs.
📝 Proposed fix
-First, check out [TanStack Router + Paraglide integration guide](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n#tanstack-router-paraglide)
+First, check out [TanStack Router + Paraglide integration guide](../../../../router/framework/react/guide/internationalization-i18n#tanstack-router-paraglide)Note: Verify the correct relative path and anchor based on the actual location of the Router guide.
Based on coding guidelines, internal documentation references should use relative links to docs/ folder format.
🤖 Prompt for AI Agents
In `@docs/start/framework/react/guide/internationalization-i18n.md` at line 33,
The link for "TanStack Router + Paraglide integration guide" uses an absolute
URL; update that markdown link to a relative docs path (pointing to the
corresponding Router guide and anchor) so internal references use the docs/
relative format instead of https://tanstack.com/.... Locate the link text
"TanStack Router + Paraglide integration guide" in internationalization-i18n.md
and replace the full external URL with the proper relative path to the Router
guide and its anchor (verify the exact relative path/anchor within the docs
folder before committing).
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In `@docs/router/framework/react/guide/internationalization-i18n.md`:
- Line 477: Replace the absolute external URL in the sentence "Check out the
guide on integrating [i18n in TanStack
Start](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n)."
with a relative documentation link pointing into the docs/ folder (e.g., change
the href to docs/framework/react/guide/internationalization-i18n.md or a
root-relative /docs/framework/react/guide/internationalization-i18n.md) so the
internal reference uses a relative path per guidelines.
♻️ Duplicate comments (2)
docs/start/framework/react/guide/internationalization-i18n.md (2)
18-18: Fix incorrect link and use relative path.The link text mentions "TanStack Router" but the URL points to the Start guide (contains
/start/in the path). Since this is the Start guide referring to the Router guide as its "base," the link should point to the Router i18n documentation. Per coding guidelines, use a relative path instead of an absolute URL.📝 Proposed fix
-The base of this guide is built with TanStack Router. Check out the guide on integrating [i18n in TanStack Router](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n). +The base of this guide is built with TanStack Router. Check out the guide on integrating [i18n in TanStack Router](../../../../router/framework/react/guide/internationalization-i18n).Based on coding guidelines, internal documentation references should use relative links to
docs/folder format.
33-33: Use relative link for internal documentation reference.Per coding guidelines, internal documentation links should use relative paths instead of absolute URLs. Additionally, verify that the anchor
#tanstack-router-paraglideexists in the target Router guide.📝 Proposed fix
-First, check out [TanStack Router + Paraglide integration guide](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n#tanstack-router-paraglide) +First, check out [TanStack Router + Paraglide integration guide](../../../../router/framework/react/guide/internationalization-i18n#tanstack-router-paraglide)Note: Verify the anchor exists in the Router guide before applying this change.
Based on coding guidelines, internal documentation references should use relative links to
docs/folder format.
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
docs/router/framework/react/guide/internationalization-i18n.mddocs/start/framework/react/guide/internationalization-i18n.mdexamples/react/i18n-paraglide/README.mdexamples/react/start-i18n-paraglide/README.md
🧰 Additional context used
📓 Path-based instructions (1)
docs/**/*.{md,mdx}
📄 CodeRabbit inference engine (AGENTS.md)
Use relative links to
docs/folder format (e.g.,./guide/data-loading) for internal documentation references
Files:
docs/start/framework/react/guide/internationalization-i18n.mddocs/router/framework/react/guide/internationalization-i18n.md
🧠 Learnings (11)
📚 Learning: 2025-12-06T15:03:07.223Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-06T15:03:07.223Z
Learning: Applies to docs/**/*.{md,mdx} : Use relative links to `docs/` folder format (e.g., `./guide/data-loading`) for internal documentation references
Applied to files:
docs/start/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-24T22:47:44.320Z
Learnt from: schiller-manuel
Repo: TanStack/router PR: 6211
File: e2e/react-start/i18n-paraglide/src/server.ts:6-6
Timestamp: 2025-12-24T22:47:44.320Z
Learning: In TanStack Router projects using `inlang/paraglide-js`, the callback passed to `paraglideMiddleware` should use `() => handler.fetch(req)` (referencing the outer `req`) instead of `({ request }) => handler.fetch(request)`. This is intentional because the router needs the untouched URL to perform its own rewrite logic with `deLocalizeUrl`/`localizeUrl`. The middleware's processed request would delocalize the URL and interfere with the router's rewrite handling.
Applied to files:
docs/start/framework/react/guide/internationalization-i18n.mdexamples/react/start-i18n-paraglide/README.mdexamples/react/i18n-paraglide/README.mddocs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-09-22T00:56:49.237Z
Learnt from: nlynzaad
Repo: TanStack/router PR: 5182
File: e2e/react-router/basic-file-based/src/routes/non-nested/named/$baz_.bar.tsx:3-5
Timestamp: 2025-09-22T00:56:49.237Z
Learning: In TanStack Router, underscores are intentionally stripped from route segments (e.g., `$baz_` becomes `baz` in generated types) but should be preserved in base path segments. This is the correct behavior as of the fix in PR `#5182`.
Applied to files:
examples/react/start-i18n-paraglide/README.mddocs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-21T12:52:35.231Z
Learnt from: Sheraff
Repo: TanStack/router PR: 6171
File: packages/router-core/src/new-process-route-tree.ts:898-898
Timestamp: 2025-12-21T12:52:35.231Z
Learning: In `packages/router-core/src/new-process-route-tree.ts`, the matching logic intentionally allows paths without trailing slashes to match index routes with trailing slashes (e.g., `/a` can match `/a/` route), but not vice-versa (e.g., `/a/` cannot match `/a` layout route). This is implemented via the condition `!pathIsIndex || node.kind === SEGMENT_TYPE_INDEX` and is a deliberate design decision to provide better UX by being permissive with missing trailing slashes.
Applied to files:
examples/react/start-i18n-paraglide/README.mdexamples/react/i18n-paraglide/README.mddocs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-09-28T21:41:45.233Z
Learnt from: nlynzaad
Repo: TanStack/router PR: 5284
File: e2e/react-start/basic/server.js:50-0
Timestamp: 2025-09-28T21:41:45.233Z
Learning: In Express v5, catch-all routes must use named wildcards. Use `/*splat` to match everything except root path, or `/{*splat}` (with braces) to match including root path. The old `*` syntax is not allowed and will cause "Missing parameter name" errors. This breaking change requires explicit naming of wildcard parameters.
Applied to files:
examples/react/start-i18n-paraglide/README.mdexamples/react/i18n-paraglide/README.md
📚 Learning: 2025-09-22T00:56:53.426Z
Learnt from: nlynzaad
Repo: TanStack/router PR: 5182
File: e2e/react-router/basic-file-based/tests/non-nested-paths.spec.ts:167-172
Timestamp: 2025-09-22T00:56:53.426Z
Learning: In TanStack Router, underscores are intentionally stripped from route segments during path parsing, but preserved in base path segments. This is the expected behavior implemented in PR `#5182`.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-17T02:17:55.086Z
Learnt from: schiller-manuel
Repo: TanStack/router PR: 6120
File: packages/router-generator/src/generator.ts:654-657
Timestamp: 2025-12-17T02:17:55.086Z
Learning: In `packages/router-generator/src/generator.ts`, pathless_layout routes must receive a `path` property when they have a `cleanedPath`, even though they are non-path routes. This is necessary because child routes inherit the path from their parent, and without this property, child routes would not have the correct full path at runtime.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-10-14T18:59:33.990Z
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.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-06T15:03:07.223Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-06T15:03:07.223Z
Learning: Applies to **/*.{js,ts,tsx} : Implement ESLint rules for router best practices using the ESLint plugin router
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-12-06T15:03:07.223Z
Learnt from: CR
Repo: TanStack/router PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-06T15:03:07.223Z
Learning: Implement type-safe routing with search params and path params
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
📚 Learning: 2025-10-01T18:30:26.591Z
Learnt from: schiller-manuel
Repo: TanStack/router PR: 5330
File: packages/router-core/src/router.ts:2231-2245
Timestamp: 2025-10-01T18:30:26.591Z
Learning: In `packages/router-core/src/router.ts`, the `resolveRedirect` method intentionally strips the router's origin from redirect URLs when they match (e.g., `https://foo.com/bar` → `/bar` for same-origin redirects) while preserving the full URL for cross-origin redirects. This logic should not be removed or simplified to use `location.publicHref` directly.
Applied to files:
docs/router/framework/react/guide/internationalization-i18n.md
🪛 LanguageTool
docs/start/framework/react/guide/internationalization-i18n.md
[style] ~47-~47: This phrase is redundant (‘L’ stands for ‘language’). Use simply “HTML”.
Context: ...=> handler.fetch(req)) }, } ``` #### HTML Language Attribute Set the lang attribute in ht...
(ACRONYM_TAUTOLOGY)
examples/react/start-i18n-paraglide/README.md
[style] ~124-~124: This phrase is redundant (‘L’ stands for ‘language’). Use simply “HTML”.
Context: ...=> handler.fetch(req)) }, } ``` #### HTML Language Attribute Set the lang attribute in ht...
(ACRONYM_TAUTOLOGY)
docs/router/framework/react/guide/internationalization-i18n.md
[grammar] ~147-~147: Use a hyphen to join words.
Context: ... also create more sophisticated language switching logic: ```tsx function Advanc...
(QB_NEW_EN_HYPHEN)
⏰ 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). (2)
- GitHub Check: Preview
- GitHub Check: Test
✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.
| ## Looking for i18n with SSR/TanStack Start? | ||
| [https://nikuscs.com/blog/13-tanstackstart-i18n/](https://nikuscs.com/blog/13-tanstackstart-i18n/) | ||
| Check out the guide on integrating [i18n in TanStack Start](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n). |
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major
Use relative link for internal documentation reference.
Per coding guidelines, internal documentation links should use relative paths instead of absolute URLs.
📝 Proposed fix
-Check out the guide on integrating [i18n in TanStack Start](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n).
+Check out the guide on integrating [i18n in TanStack Start](../../../../start/framework/react/guide/internationalization-i18n).Based on coding guidelines, internal documentation references should use relative links to docs/ folder format.
🤖 Prompt for AI Agents
In `@docs/router/framework/react/guide/internationalization-i18n.md` at line 477,
Replace the absolute external URL in the sentence "Check out the guide on
integrating [i18n in TanStack
Start](https://tanstack.com/start/latest/docs/framework/react/guide/internationalization-i18n)."
with a relative documentation link pointing into the docs/ folder (e.g., change
the href to docs/framework/react/guide/internationalization-i18n.md or a
root-relative /docs/framework/react/guide/internationalization-i18n.md) so the
internal reference uses a relative path per guidelines.
1 participant
Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.