Conversation
This follows the similar migrations of Messages and Calendars.
📝 WalkthroughWalkthroughThe frontend is migrated from Next.js (static export) to a Vite SPA with TanStack Router file-based routing. All local development service ports are renumbered (frontend 8980, backend 8981, others 8982–8988). Environment variables move from ChangesNext.js → Vite + TanStack Router Migration
Sequence Diagram(s)sequenceDiagram
participant Browser
participant Caddy
participant index.html
participant main.tsx
participant TanStackRouter as TanStack Router
participant RootShell as __root.tsx
Browser->>Caddy: GET /transfers/abc
Caddy->>index.html: file_server → serve index.html
index.html->>main.tsx: <script type="module" src="/src/main.tsx">
main.tsx->>TanStackRouter: createRouter(routeTree)
main.tsx->>TanStackRouter: ReactDOM.render RouterProvider
TanStackRouter->>RootShell: mount root route component
RootShell->>TanStackRouter: QueryClientProvider + Auth + MainLayout + Outlet
TanStackRouter->>Browser: render matched /_app/transfers/$id page
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
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 |
There was a problem hiding this comment.
Actionable comments posted: 6
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
src/frontend/src/features/i18n/conf.ts (1)
8-13:⚠️ Potential issue | 🟠 Major | ⚡ Quick winValidate
NEXT_PUBLIC_LANGUAGESschema before returning parsed data.A parseable but malformed value (e.g., object or wrong tuple shape) can break startup when
LANGUAGES_ALLOWEDis derived.Proposed fix
function getLanguagesFromEnv() { const languages = import.meta.env.NEXT_PUBLIC_LANGUAGES; if (!languages) return DEFAULT_LANGUAGES; try { - return JSON.parse(languages); + const parsed = JSON.parse(languages); + const isValid = + Array.isArray(parsed) && + parsed.every( + (item) => + Array.isArray(item) && + item.length === 2 && + typeof item[0] === "string" && + typeof item[1] === "string", + ); + return isValid ? parsed : DEFAULT_LANGUAGES; } catch (error) { handle(new Error("Error parsing languages from env."), { extra: { error, languages } }); return DEFAULT_LANGUAGES; } }Also applies to: 19-20
🤖 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 `@src/frontend/src/features/i18n/conf.ts` around lines 8 - 13, The getLanguagesFromEnv() function parses the NEXT_PUBLIC_LANGUAGES environment variable but does not validate that the parsed result matches the expected schema. A JSON value that parses successfully but has an incorrect structure (e.g., wrong object shape or tuple format) will cause issues downstream when LANGUAGES_ALLOWED is derived. Add schema validation after the JSON.parse() call in getLanguagesFromEnv() to ensure the parsed data has the correct shape and type, returning DEFAULT_LANGUAGES if validation fails instead of returning potentially malformed data.src/frontend/README.md (1)
21-46:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winAdd a language tag to the fenced code block.
The block starting on Line 21 should declare a language (e.g.,
text) to satisfy markdownlint MD040.Suggested patch
-``` +```text src/ ├── routes/ # TanStack Router file-based routes ... └── caddy/Caddyfile # Reverse proxy config (XFF propagation, SPA fallbacks)</details> As per coding guidelines, this comment is based on provided static analysis evidence for documentation quality checks. <details> <summary>🤖 Prompt for AI Agents</summary>Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.In
@src/frontend/README.mdaround lines 21 - 46, The fenced code block in
src/frontend/README.md starting at line 21 is missing a language tag, which
violates the markdownlint MD040 rule. Add a language tag (such as "text") to the
opening triple backticks of the code block that contains the directory
structure. Change the opening backticks from triple backticks with no language
identifier to triple backticks followed by "text".</details> <!-- cr-comment:v1:6b8b6afc1cb1c54be30922a3 --> _Source: Linters/SAST tools_ </blockquote></details> </blockquote></details>🤖 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 `@compose.yaml`: - Around line 81-82: There is a port collision in the compose.yaml file where both the backend-dev service (at lines 81-82) and the backend-db service (at lines 101-103) are configured to map their internal port 8000 to the same host port 8981. This causes a bind error when the tools profile is enabled. Fix this by changing one of the port mappings to use a different available host port. For example, keep backend-dev at 8981:8000 and change backend-db to use a different host port such as 8982:8000, ensuring each service has a unique host port binding. In `@src/frontend/.gitignore`: - Line 1: The .gitignore file currently only ignores the `.env` file, which leaves variations such as `.env.local`, `.env.production`, and other suffixed environment files vulnerable to accidental commits. Add a new line with the pattern `.env.*` to the .gitignore file to ensure all environment files with any suffix are properly ignored and prevent sensitive configuration data from being committed. In `@src/frontend/caddy/Caddyfile`: - Around line 42-45: The try_files directive in the SPA fallback configuration is rewriting all missing file requests to index.html, including static assets like JavaScript chunks, which breaks chunk loading by serving 200 status instead of 404 for missing assets. Add a matcher to the try_files directive to scope it to document requests only (typically matching file paths without common static asset extensions like .js, .css, .png, etc.) so that missing static assets return 404 as expected. Apply the same matcher logic to the error handler block at lines 49-53 to ensure it also avoids rewriting static asset 404 responses. In `@src/frontend/package.json`: - Around line 35-36: The TanStack Router packages have misaligned versions across the package.json file. The `@tanstack/react-router` package is pinned to 1.170.8, but `@tanstack/react-router-devtools`, `@tanstack/router-cli`, and `@tanstack/router-plugin` are pinned to older versions (1.167.0, 1.167.13, and 1.168.11 respectively). TanStack Router requires strict version alignment across all packages in the monorepo to avoid build errors and type mismatches. Update `@tanstack/react-router-devtools`, `@tanstack/router-cli`, and `@tanstack/router-plugin` to align with the 1.170.x release series to match the `@tanstack/react-router` version. In `@src/frontend/scripts/print-bundle-stats.mjs`: - Around line 82-83: The TOP_N and TOP_BUCKETS variables are currently parsed directly from environment variables without validation, which can cause silent degradation if the values are non-numeric or non-positive (resulting in empty output). Add validation logic after the Number() conversion for both TOP_N and TOP_BUCKETS to ensure they are positive integers, and clamp them to the safe default values (10 and 8 respectively) if they fall outside acceptable ranges (e.g., if they are NaN, zero, or negative). In `@src/frontend/src/features/i18n/conf.ts`: - Line 22: The BASE_LANGUAGE constant assignment does not validate that NEXT_PUBLIC_DEFAULT_LANGUAGE is actually in the LANGUAGES_ALLOWED array before using it, which means an unsupported language code could be set as the base language. Modify the assignment to check whether the environment variable import.meta.env.NEXT_PUBLIC_DEFAULT_LANGUAGE exists in LANGUAGES_ALLOWED, and only use it if it does; otherwise, fall back to LANGUAGES_ALLOWED[0] to ensure BASE_LANGUAGE is always constrained to a supported language code. --- Outside diff comments: In `@src/frontend/README.md`: - Around line 21-46: The fenced code block in src/frontend/README.md starting at line 21 is missing a language tag, which violates the markdownlint MD040 rule. Add a language tag (such as "text") to the opening triple backticks of the code block that contains the directory structure. Change the opening backticks from triple backticks with no language identifier to triple backticks followed by "text". In `@src/frontend/src/features/i18n/conf.ts`: - Around line 8-13: The getLanguagesFromEnv() function parses the NEXT_PUBLIC_LANGUAGES environment variable but does not validate that the parsed result matches the expected schema. A JSON value that parses successfully but has an incorrect structure (e.g., wrong object shape or tuple format) will cause issues downstream when LANGUAGES_ALLOWED is derived. Add schema validation after the JSON.parse() call in getLanguagesFromEnv() to ensure the parsed data has the correct shape and type, returning DEFAULT_LANGUAGES if validation fails instead of returning potentially malformed data.🪄 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: ASSERTIVE
Plan: Pro
Run ID:
190ab547-57f4-4a3f-91d2-3e60e4a8f65f⛔ Files ignored due to path filters (1)
src/frontend/package-lock.jsonis excluded by!**/package-lock.json📒 Files selected for processing (52)
.dockerignore.gitignoreMakefileREADME.mdcompose.yamlenv.d/development/backend.defaultsenv.d/development/frontend.defaultssrc/backend/core/services/s3.pysrc/backend/transferts/settings.pysrc/frontend/.dockerignoresrc/frontend/.gitignoresrc/frontend/Dockerfilesrc/frontend/README.mdsrc/frontend/caddy/Caddyfilesrc/frontend/eslint.config.mjssrc/frontend/index.htmlsrc/frontend/instrumentation-client.tssrc/frontend/next.config.tssrc/frontend/package.jsonsrc/frontend/scripts/print-bundle-stats.mjssrc/frontend/src/features/api/client.tssrc/frontend/src/features/auth/index.tsxsrc/frontend/src/features/i18n/conf.tssrc/frontend/src/features/layouts/components/main/MainLayout.tsxsrc/frontend/src/features/layouts/components/shell/ShellLayout.tsxsrc/frontend/src/features/layouts/components/shell/Sidebar.tsxsrc/frontend/src/features/layouts/components/shell/TopBar.tsxsrc/frontend/src/features/transfers/components/DownloadView.tsxsrc/frontend/src/features/transfers/components/DriveAttachButton.tsxsrc/frontend/src/features/transfers/components/FileDropZone.tsxsrc/frontend/src/features/transfers/components/HomeLanding.tsxsrc/frontend/src/features/transfers/components/TransferDetail.tsxsrc/frontend/src/features/transfers/components/TransferFailed.tsxsrc/frontend/src/features/transfers/components/TransferForm.tsxsrc/frontend/src/features/transfers/components/TransferSuccess.tsxsrc/frontend/src/features/utils/errors/index.tssrc/frontend/src/main.tsxsrc/frontend/src/pages/_app.tsxsrc/frontend/src/pages/_document.tsxsrc/frontend/src/routes/__root.tsxsrc/frontend/src/routes/_app.tsxsrc/frontend/src/routes/_app/confirm-failed/$id.tsxsrc/frontend/src/routes/_app/confirm/$id.tsxsrc/frontend/src/routes/_app/index.tsxsrc/frontend/src/routes/_app/transfers/$id.tsxsrc/frontend/src/routes/t/$token.tsxsrc/frontend/src/styles/main.scsssrc/frontend/src/styles/views/_index.scsssrc/frontend/tsconfig.jsonsrc/frontend/tsr.config.jsonsrc/frontend/vite.config.tssrc/frontend/vitest.config.ts💤 Files with no reviewable changes (3)
- src/frontend/src/pages/_document.tsx
- src/frontend/src/pages/_app.tsx
- src/frontend/next.config.ts
| "@tanstack/react-router": "1.170.8", | ||
| "@tanstack/react-router-devtools": "1.167.0", |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
set -euo pipefail
python - <<'PY'
import json, subprocess
pkg_path = "src/frontend/package.json"
with open(pkg_path, "r", encoding="utf-8") as f:
pkg = json.load(f)
names = [
"`@tanstack/react-router`",
"`@tanstack/react-router-devtools`",
"`@tanstack/router-cli`",
"`@tanstack/router-plugin`",
]
versions = {}
for name in names:
versions[name] = (
pkg.get("dependencies", {}).get(name)
or pkg.get("devDependencies", {}).get(name)
)
print("Pinned versions:")
for n, v in versions.items():
print(f" {n}: {v}")
print("\nPeer dependency metadata from npm:")
for n, v in versions.items():
if not v:
continue
print(f"\n== {n}@{v} peerDependencies ==")
subprocess.run(["npm", "view", f"{n}@{v}", "peerDependencies", "--json"], check=False)
PYRepository: suitenumerique/transfers
Length of output: 154
🏁 Script executed:
sed -n '30,60p' src/frontend/package.json | cat -nRepository: suitenumerique/transfers
Length of output: 1300
🌐 Web query:
TanStack Router version compatibility @tanstack/react-router @tanstack/router-cli @tanstack/router-plugin``
💡 Result:
TanStack Router maintains a strict version synchronization strategy across its core packages and build tools to ensure compatibility [1][2]. Because the ecosystem is managed as a monorepo, packages such as @tanstack/react-router, @tanstack/router-cli, and @tanstack/router-plugin are released together to keep their dependencies and internal logic aligned [3][1][4]. Key principles for version compatibility include: 1. Version Synchronization: You should always keep the versions of @tanstack/react-router, @tanstack/router-cli, and @tanstack/router-plugin aligned to the same release series [3][1]. For example, if your application uses @tanstack/react-router version 1.170.x, you should use the corresponding 1.16x.x versions for the CLI and plugin packages [3][5]. 2. Monorepo Alignment: The internal packages, such as @tanstack/router-core and @tanstack/router-generator, are automatically updated in tandem with the primary consumer-facing packages [3][4][5]. Using mismatched versions can lead to build errors or type mismatches between the generated route tree and the runtime router [1][2]. 3. Build Tools: While @tanstack/router-plugin provides integration for build tools like Vite or esbuild, and @tanstack/router-cli provides a framework-agnostic command-line interface, both tools depend on the same underlying generation logic [1][2]. They are updated as part of the same release cycles to maintain parity [3][4]. To ensure stability, it is recommended to update all @tanstack/router packages simultaneously in your project's package.json [3][4]. You can verify the most recent release versions via the official TanStack Router GitHub releases page or npm [3][6][7].
Citations:
- 1: https://deepwiki.com/tanstack/router/1.1-package-architecture
- 2: https://deepwiki.com/tanstack/router/4.2-cli-and-build-tool-integration
- 3: https://github.com/TanStack/router/releases
- 4: chore: update chokidar to v5 TanStack/router#7439
- 5: https://github.com/TanStack/router/blob/main/packages/router-plugin/CHANGELOG.md
- 6: https://www.npmjs.com/package/@tanstack/react-router
- 7: https://www.npmjs.com/package/@tanstack/router-plugin
Align TanStack Router package versions to the same release series.
Lines 35–36 and lines 50–51 pin conflicting versions: @tanstack/react-router is at 1.170.8, but @tanstack/react-router-devtools, @tanstack/router-cli, and @tanstack/router-plugin are at 1.167.0, 1.167.13, and 1.168.11 respectively. TanStack Router enforces strict version alignment across its monorepo packages. Mismatched versions cause build errors or type mismatches between generated routes and runtime router. Update all @tanstack/router packages to align with the runtime version (1.170.x series).
🤖 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 `@src/frontend/package.json` around lines 35 - 36, The TanStack Router packages
have misaligned versions across the package.json file. The
`@tanstack/react-router` package is pinned to 1.170.8, but
`@tanstack/react-router-devtools`, `@tanstack/router-cli`, and
`@tanstack/router-plugin` are pinned to older versions (1.167.0, 1.167.13, and
1.168.11 respectively). TanStack Router requires strict version alignment across
all packages in the monorepo to avoid build errors and type mismatches. Update
`@tanstack/react-router-devtools`, `@tanstack/router-cli`, and
`@tanstack/router-plugin` to align with the 1.170.x release series to match the
`@tanstack/react-router` version.
- compose: fix host port collision (backend-db 8981 -> 8989) - frontend/.gitignore: ignore .env.* mode/local files - Caddyfile: scope SPA fallback to HTML document navigations so missing static assets keep their 404 instead of a 200 index.html - package.json: align @tanstack/router-* versions (plugin 1.168.18 peers react-router ^1.170.15, so bump react-router to 1.170.15) - print-bundle-stats: clamp ANALYZE_TOP_N/ANALYZE_TOP_BUCKETS to positive ints - i18n/conf: validate NEXT_PUBLIC_LANGUAGES schema and constrain BASE_LANGUAGE to an allowed language - README: add language tag to fenced layout block (markdownlint MD040)
- compose: fix host port collision (backend-db 8981 -> 8989) - frontend/.gitignore: ignore .env.* mode/local files - Caddyfile: scope SPA fallback to HTML document navigations so missing static assets keep their 404 instead of a 200 index.html - package.json: align @tanstack/router-* versions (plugin 1.168.18 peers react-router ^1.170.15, so bump react-router to 1.170.15) - print-bundle-stats: clamp ANALYZE_TOP_N/ANALYZE_TOP_BUCKETS to positive ints - i18n/conf: validate NEXT_PUBLIC_LANGUAGES schema and constrain BASE_LANGUAGE to an allowed language - README: add language tag to fenced layout block (markdownlint MD040)
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 `@src/frontend/src/features/i18n/conf.ts`:
- Around line 8-18: The isLanguageList type guard function currently accepts
empty arrays, which causes LANGUAGES_ALLOWED[0] to become undefined and produces
an invalid BASE_LANGUAGE. Add a length check to the validation logic to ensure
the array is not empty by requiring that value.length > 0 in addition to the
existing Array.isArray check and the every() validation of tuple structures.
🪄 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: ASSERTIVE
Plan: Pro
Run ID: 11a82220-d598-436c-ae1a-c3d3eac0d5b2
⛔ Files ignored due to path filters (1)
src/frontend/package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (8)
bin/scalingo_postfrontendcompose.yamlsrc/frontend/.gitignoresrc/frontend/README.mdsrc/frontend/caddy/Caddyfilesrc/frontend/package.jsonsrc/frontend/scripts/print-bundle-stats.mjssrc/frontend/src/features/i18n/conf.ts
There was a problem hiding this comment.
♻️ Duplicate comments (1)
src/frontend/package.json (1)
48-51:⚠️ Potential issue | 🟠 Major | ⚡ Quick winAlign TanStack Router package versions with the runtime package.
@tanstack/react-routeris pinned to1.170.15(Line 34), but devtools/CLI/plugin remain on older series (Lines 49–51). This mismatch can cause generated route tree/runtime incompatibilities during build and type-check.#!/bin/bash set -euo pipefail # Verify current pinned TanStack Router package versions in package.json python - <<'PY' import json p="src/frontend/package.json" with open(p, encoding="utf-8") as f: pkg=json.load(f) names=[ "`@tanstack/react-router`", "`@tanstack/react-router-devtools`", "`@tanstack/router-cli`", "`@tanstack/router-plugin`", ] print("Pinned versions:") for n in names: v=pkg.get("dependencies",{}).get(n) or pkg.get("devDependencies",{}).get(n) print(f" {n}: {v}") PY # Check available versions for aligned upgrades (read-only) for pkg in `@tanstack/react-router` `@tanstack/react-router-devtools` `@tanstack/router-cli` `@tanstack/router-plugin`; do echo "== $pkg latest ==" npm view "$pkg" version done🤖 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 `@src/frontend/package.json` around lines 48 - 51, The TanStack Router-related devtools and CLI packages are pinned to older versions than the main `@tanstack/react-router` package (which is at 1.170.15). Update `@tanstack/react-router-devtools`, `@tanstack/router-cli`, and `@tanstack/router-plugin` to match the version of `@tanstack/react-router` to ensure compatibility and prevent route tree generation and type-check issues during the build process.
🤖 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 `@src/frontend/package.json`:
- Around line 48-51: The TanStack Router-related devtools and CLI packages are
pinned to older versions than the main `@tanstack/react-router` package (which is
at 1.170.15). Update `@tanstack/react-router-devtools`, `@tanstack/router-cli`, and
`@tanstack/router-plugin` to match the version of `@tanstack/react-router` to ensure
compatibility and prevent route tree generation and type-check issues during the
build process.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
Run ID: 434915f3-6d24-48d3-91c9-4d44d662c480
⛔ Files ignored due to path filters (1)
src/frontend/package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (8)
bin/scalingo_postfrontendcompose.yamlsrc/frontend/.gitignoresrc/frontend/README.mdsrc/frontend/caddy/Caddyfilesrc/frontend/package.jsonsrc/frontend/scripts/print-bundle-stats.mjssrc/frontend/src/features/i18n/conf.ts
- compose: fix host port collision (backend-db 8981 -> 8989) - frontend/.gitignore: ignore .env.* mode/local files - Caddyfile: scope SPA fallback to HTML document navigations so missing static assets keep their 404 instead of a 200 index.html - package.json: align @tanstack/router-* versions (plugin 1.168.18 peers react-router ^1.170.15, so bump react-router to 1.170.15) - print-bundle-stats: clamp ANALYZE_TOP_N/ANALYZE_TOP_BUCKETS to positive ints - i18n/conf: validate NEXT_PUBLIC_LANGUAGES schema and constrain BASE_LANGUAGE to an allowed language - README: add language tag to fenced layout block (markdownlint MD040)
This follows the similar migrations of Messages and Calendars.
We also move the local ports to the 898x range to avoid conflicts with other LaSuite apps.
Summary by CodeRabbit
Release Notes
New Features
Bug Fixes
Chores