feat(react-router): add @aura-stack/react-router package #142
Merged
Conversation
Contributor
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning Rate limit exceeded
Your organization is not enrolled in usage-based pricing. Contact your admin to enable usage-based pricing to continue reviews beyond the rate limit, or try again in 40 minutes and 7 seconds. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. 📝 WalkthroughWalkthroughAdds a new Changes
Sequence Diagram(s)sequenceDiagram
participant Browser
participant RouteLoader as Route Loader
participant ReactRouterAPI as React-Router API
participant AuthCore as Auth Core (createAuth().core)
participant Storage as Storage/DB
Browser->>RouteLoader: Request page (with headers)
RouteLoader->>ReactRouterAPI: api.getSession({ headers })
ReactRouterAPI->>AuthCore: core.api.getSession(headers)
AuthCore->>Storage: validate session / fetch user
Storage-->>AuthCore: session data
AuthCore-->>ReactRouterAPI: session (or null)
ReactRouterAPI-->>RouteLoader: return session
RouteLoader-->>Browser: render with session
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
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}
There was a problem hiding this comment.
Actionable comments posted: 8
🧹 Nitpick comments (3)
packages/react-router/package.json (1)
5-5: Empty description.Consider adding a meaningful package description for npm discoverability.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/react-router/package.json` at line 5, The package.json has an empty "description" field which hurts npm discoverability; update the "description" property in packages/react-router/package.json (the "description" key) to a concise, meaningful sentence describing the package (e.g., what react-router provides, its main purpose and audience), keeping it under 200 characters and consistent with README wording and npm keyword usage.packages/react-router/src/lib/api.ts (1)
29-33: Type includesrequest: Requestbut it's not used.The
signInwrapper declaresoptions?: Prettify<SignInOptions & { request: Request }>but never accessesoptions.request. The options are passed directly toapi.signIn(). Consider removing the{ request: Request }intersection if not needed, or use{ headers: Headers }for consistency with the caller pattern.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/react-router/src/lib/api.ts` around lines 29 - 33, The signIn wrapper types include an unused `{ request: Request }`; update the options type used by signIn({ api }: AuthInstance) so it no longer references `request`. Replace `options?: Prettify<SignInOptions & { request: Request }>` with either `options?: Prettify<SignInOptions>` or, to match the caller pattern, `options?: Prettify<SignInOptions & { headers?: Headers }>` and leave the implementation calling `api.signIn(providerId, options)` unchanged; adjust any related imports/types if you choose the `headers` variant.apps/react-router/app/lib/auth.ts (1)
1-1: Consider using@aura-stack/react-routerfor React Router-specific integration.The
@aura-stack/react-routerpackage provides a wrapper aroundcreateAuththat returns React Router-aware API helpers usingdata()andredirect()from react-router. Since this is the React Router demo app, importing from@aura-stack/react-routerwould better showcase the integration and provide proper response handling. This would require adding@aura-stack/react-routerto the app's dependencies and updating the import accordingly.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/react-router/app/lib/auth.ts` at line 1, Replace the plain createAuth import with the React Router-aware wrapper from `@aura-stack/react-router`: add `@aura-stack/react-router` to dependencies, import the router-specific helper instead of createAuth (so the module returns React Router-aware API helpers that use data() and redirect()), and update any uses of createAuth in this file to use the router wrapper symbol (preserving existing options/handlers) so responses are produced via react-router utilities. Ensure tests/build include the new dependency.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@apps/react-router/app/routes/auth-layout.tsx`:
- Around line 9-13: The loader currently returns the raw value from
api.getSession which drops response headers; change the loader in
auth-layout.tsx so it captures both the response body and headers from
api.getSession (e.g., const { body: sessionBody, headers: sessionHeaders } =
await api.getSession(...)) and return them using React Router's data utility
(import and call data(sessionBody, { headers: sessionHeaders })) so Set-Cookie
and other headers are forwarded.
In `@apps/react-router/app/routes/index.tsx`:
- Around line 9-10: The call to api.getSession is passing the entire Request
object instead of the expected GetSessionOptions shape; update the call in
routes/index.tsx to pass an object with the request headers (e.g. call
api.getSession({ headers: request.headers })) so api.getSession receives
GetSessionOptions; ensure the returned variable name (session) and subsequent
access to session.authenticated/session.session remain unchanged.
In `@packages/react-router/deno.json`:
- Line 6: The "dev" npm script currently references a non-existent file
"src/index.tsx"; update the dev script (the "dev" key in deno.json) to point to
the actual entry point "src/index.ts" (or create a new src/index.tsx if JSX is
intended) so the deno run --watch command uses the correct file; adjust the
"dev" value to use "src/index.ts" to match the existing main entry.
- Line 10: The export entry named "./client" points to a non-existent source
"./src/client.ts"; update the export to reference the actual module name used in
the codebase (to-client.ts) so module resolution matches package.json's mapping
to ./dist/to-client.* — specifically change the "./client" export target to
"./src/to-client.ts" (or rename the source to client.ts) and ensure any
corresponding type/dist entries mirror that same module name.
In `@packages/react-router/src/`@types/index.ts:
- Line 1: The public type re-export line using the internal alias `export type *
from "@/@types/core"` must be replaced with a relative path re-export so
downstream consumers can resolve types; update the export statement in this file
to point to the actual relative location of the core types file (e.g., the
relative path to the `@types/core` module in this package), then verify TypeScript
builds and tsup declaration bundling succeed.
In `@packages/react-router/src/createAuth.ts`:
- Around line 6-11: The returned object from createAuth currently exposes core
and api but not handlers, causing callers expecting { api, handlers } to get
undefined; update createAuth (which calls createAuthInstance and api) to include
a top-level handlers property that forwards to the underlying auth.handlers
(e.g., return { core: auth, api: api<ShapeToObject<Identity>>(auth), handlers:
auth.handlers }) and ensure the export's type reflects handlers so consumers can
destructure handlers directly.
In `@packages/react-router/src/index.ts`:
- Line 1: Replace the path-alias import with a relative import to avoid relying
on tsup/esbuild path resolution: update the package entry export that re-exports
createAuth (the line exporting createAuth) to import from the local relative
module (e.g., "./createAuth") instead of "@/createAuth"; ensure any other
entrypoint exports use relative paths as well so the published bundle doesn't
depend on tsconfig path aliases.
In `@packages/react-router/src/lib/api.ts`:
- Around line 67-81: The signOut wrapper's parameter shape doesn't match its
caller: update the signOut function (export const signOut) to accept headers
directly instead of requiring a Request; change the options type from
SignOutOptions & { request: Request } to SignOutOptions & { headers?:
HeadersInit } (keep Prettify and DefaultUser generics) and use options?.headers
when calling api.signOut; ensure you update any local references from
options.request.headers to options?.headers so the wrapper aligns with the
caller in index.tsx.
---
Nitpick comments:
In `@apps/react-router/app/lib/auth.ts`:
- Line 1: Replace the plain createAuth import with the React Router-aware
wrapper from `@aura-stack/react-router`: add `@aura-stack/react-router` to
dependencies, import the router-specific helper instead of createAuth (so the
module returns React Router-aware API helpers that use data() and redirect()),
and update any uses of createAuth in this file to use the router wrapper symbol
(preserving existing options/handlers) so responses are produced via
react-router utilities. Ensure tests/build include the new dependency.
In `@packages/react-router/package.json`:
- Line 5: The package.json has an empty "description" field which hurts npm
discoverability; update the "description" property in
packages/react-router/package.json (the "description" key) to a concise,
meaningful sentence describing the package (e.g., what react-router provides,
its main purpose and audience), keeping it under 200 characters and consistent
with README wording and npm keyword usage.
In `@packages/react-router/src/lib/api.ts`:
- Around line 29-33: The signIn wrapper types include an unused `{ request:
Request }`; update the options type used by signIn({ api }: AuthInstance) so it
no longer references `request`. Replace `options?: Prettify<SignInOptions & {
request: Request }>` with either `options?: Prettify<SignInOptions>` or, to
match the caller pattern, `options?: Prettify<SignInOptions & { headers?:
Headers }>` and leave the implementation calling `api.signIn(providerId,
options)` unchanged; adjust any related imports/types if you choose the
`headers` variant.
🪄 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: defaults
Review profile: CHILL
Plan: Pro
Run ID: e51308b0-a599-4e0f-981a-146ec3a3864a
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (23)
apps/react-router/app/actions/auth-server.tsapps/react-router/app/components/auth-client.tsxapps/react-router/app/components/header.tsxapps/react-router/app/lib/auth-client.tsapps/react-router/app/lib/auth.tsapps/react-router/app/routes/auth-layout.tsxapps/react-router/app/routes/index.tsxpackages/react-router/CHANGELOG.mdpackages/react-router/README.mdpackages/react-router/deno.jsonpackages/react-router/package.jsonpackages/react-router/src/@types/core.tspackages/react-router/src/@types/index.tspackages/react-router/src/_core/crypto.tspackages/react-router/src/_core/identity.tspackages/react-router/src/_core/shared.tspackages/react-router/src/createAuth.tspackages/react-router/src/index.tspackages/react-router/src/lib/api.tspackages/react-router/src/oauth/index.tspackages/react-router/src/to-client.tspackages/react-router/tsconfig.jsonpackages/react-router/tsup.config.ts
💤 Files with no reviewable changes (1)
- apps/react-router/app/actions/auth-server.ts
halvaradop
changed the title
@aura-stack/react-router package
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
packages/react-router/src/lib/api.ts (1)
69-73: Remove redundantskipCSRFCheckforwarding insignOut.This wrapper forwards
skipCSRFCheck, but the core API layer already enforces it for sign-out. Keeping it here suggests configurability that currently does not exist.Suggested cleanup
const response = await api.signOut({ headers: options.headers, redirectTo: options?.redirectTo, - skipCSRFCheck: true, })🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/react-router/src/lib/api.ts` around lines 69 - 73, In the signOut wrapper in packages/react-router/src/lib/api.ts, remove the redundant forwarding of skipCSRFCheck to api.signOut since the core API already enforces it; update the call site that currently passes skipCSRFCheck: true in the object (within the signOut wrapper) to omit that property and only forward headers and redirectTo (e.g., the options.headers and options?.redirectTo used when calling api.signOut).
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@packages/react-router/src/lib/api.ts`:
- Around line 53-57: The call to api.updateSession currently forces
skipCSRFCheck: true, which disables CSRF validation by default; change the
invocation in this code to not hardcode skipCSRFCheck so the core default (CSRF
checked) is preserved—either remove the skipCSRFCheck property entirely or pass
options.skipCSRFCheck so callers opt out explicitly; update any callsites that
relied on the hardcoded behavior to explicitly set skipCSRFCheck=true only for
trusted internal flows, and ensure the updateSession signature/type continues to
accept skipCSRFCheck as an optional flag.
- Around line 17-21: The code currently returns only session.session (dropping
session.headers) after calling api.getSession; update the return to preserve the
API response headers so cookie/header propagation works—either return the full
session object from api.getSession (e.g., return session) or return a merged
object that includes session.session plus session.headers; adjust the logic in
the same function that calls api.getSession (referencing api.getSession and the
local variable session) so downstream callers receive headers intact.
---
Nitpick comments:
In `@packages/react-router/src/lib/api.ts`:
- Around line 69-73: In the signOut wrapper in
packages/react-router/src/lib/api.ts, remove the redundant forwarding of
skipCSRFCheck to api.signOut since the core API already enforces it; update the
call site that currently passes skipCSRFCheck: true in the object (within the
signOut wrapper) to omit that property and only forward headers and redirectTo
(e.g., the options.headers and options?.redirectTo used when calling
api.signOut).
🪄 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: defaults
Review profile: CHILL
Plan: Pro
Run ID: 63d719db-b825-464d-bb6e-5ecf56733f1c
⛔ Files ignored due to path filters (2)
bun.lockis excluded by!**/*.lockpnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (27)
apps/react-router/app/components/auth-client.tsxapps/react-router/app/components/header.tsxapps/react-router/app/contexts/auth.tsxapps/react-router/app/lib/auth.client.tsapps/react-router/app/lib/auth.tsapps/react-router/app/root.tsxapps/react-router/app/routes/auth-layout.tsxapps/react-router/app/routes/index.tsxapps/react-router/package.jsonpackages/elysia/package.jsonpackages/express/package.jsonpackages/hono/package.jsonpackages/next/package.jsonpackages/rate-limiter/package.jsonpackages/rate-limiter/src/algorithms/index.tspackages/rate-limiter/src/algorithms/token-bucket.tspackages/rate-limiter/src/index.tspackages/rate-limiter/src/memory.tspackages/rate-limiter/src/rate-limiter.tspackages/rate-limiter/src/utils.tspackages/react-router/deno.jsonpackages/react-router/package.jsonpackages/react-router/src/@types/index.tspackages/react-router/src/client.tspackages/react-router/src/lib/api.tspackages/react-router/tsup.config.tspackages/react/package.json
✅ Files skipped from review due to trivial changes (19)
- packages/elysia/package.json
- apps/react-router/app/root.tsx
- packages/react-router/src/@types/index.ts
- packages/next/package.json
- packages/rate-limiter/src/rate-limiter.ts
- apps/react-router/app/components/header.tsx
- apps/react-router/app/components/auth-client.tsx
- packages/hono/package.json
- packages/rate-limiter/src/memory.ts
- packages/react/package.json
- apps/react-router/app/lib/auth.client.ts
- packages/react-router/tsup.config.ts
- packages/rate-limiter/src/utils.ts
- packages/rate-limiter/src/algorithms/token-bucket.ts
- apps/react-router/app/contexts/auth.tsx
- packages/react-router/src/client.ts
- packages/express/package.json
- packages/react-router/deno.json
- packages/react-router/package.json
🚧 Files skipped from review as they are similar to previous changes (2)
- apps/react-router/app/routes/index.tsx
- apps/react-router/app/routes/auth-layout.tsx
There was a problem hiding this comment.
♻️ Duplicate comments (1)
packages/react-router/src/lib/api.ts (1)
14-25:⚠️ Potential issue | 🟠 MajorReturn the full
api.getSessionresponse to avoid dropping headers.At Line 21, returning
session.sessionstrips response headers fromapi.getSession, which can break cookie/header propagation in SSR flows.Suggested fix
export const getSession = <DefaultUser extends User = User>({ api }: AuthInstance<DefaultUser>) => { - return async (options: GetSessionOptions): Promise<Session<DefaultUser> | null> => { + return async (options: GetSessionOptions) => { try { const session = await api.getSession(options) - if (!session.authenticated) { - return null - } - return session.session + return session } catch { console.error("[error:server] getSession - Failed to retrieve session") - return null + return { session: null, headers: new Headers(), authenticated: false } } } }Use this to verify the core return shape before applying the fallback object:
#!/bin/bash set -euo pipefail # 1) Inspect AuthInstance/getSession type contracts in repo packages. rg -n --type=ts -C3 'AuthInstance|getSession\s*\(' packages # 2) Inspect current getSession callsites in app/package code. rg -n --type=ts -C2 '\bapi\.getSession\s*\(' apps packages🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/react-router/src/lib/api.ts` around lines 14 - 25, In getSession (the exported function in packages/react-router/src/lib/api.ts) you are currently returning session.session which strips headers; change it to return the full result from api.getSession (the object returned by api.getSession) so SSR cookie/header propagation remains intact, preserve the existing try/catch but log the caught error (include the error) before returning null, and ensure the returned Promise type aligns with AuthInstance/Session/GetSessionOptions contracts so callers still receive the full response object rather than only session.session.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Duplicate comments:
In `@packages/react-router/src/lib/api.ts`:
- Around line 14-25: In getSession (the exported function in
packages/react-router/src/lib/api.ts) you are currently returning
session.session which strips headers; change it to return the full result from
api.getSession (the object returned by api.getSession) so SSR cookie/header
propagation remains intact, preserve the existing try/catch but log the caught
error (include the error) before returning null, and ensure the returned Promise
type aligns with AuthInstance/Session/GetSessionOptions contracts so callers
still receive the full response object rather than only session.session.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 0dfa4de1-0d98-4969-b7fd-67424cda7696
⛔ Files ignored due to path filters (3)
bun.lockis excluded by!**/*.lockdeno.lockis excluded by!**/*.lockpnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (4)
packages/rate-limiter/test/index.test.tspackages/react-router/package.jsonpackages/react-router/src/lib/api.tspackages/react-router/tsconfig.json
✅ Files skipped from review due to trivial changes (3)
- packages/react-router/tsconfig.json
- packages/rate-limiter/test/index.test.ts
- packages/react-router/package.json
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
1 participant
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.
Description
This pull request introduces the
@aura-stack/react-routerpackage, providing seamless integration with React Router applications. The package supports both client-side rendering (CSR) and server-side rendering (SSR) through dedicated utilities tailored for each rendering strategy.The package builds on top of
@aura-stack/reactfor client-side authentication state management and adds an additional server-side layer for React Router loaders, actions, and route handlers.Note
The
@aura-stack/react-routerpackage uses@aura-stack/reactinternally for CSR support and extends it with server-side APIs for React Router applications.Key Changes
@aura-stack/react-routerintegration package@aura-stack/reactclient-side provider and hooksapps/react-routerintegration example to use the new package ✨@aura-stack/react-router/oauthUsage
Server-Side Rendering (SSR)
Client Side Rendering (CSR)
@coderabbitai pause
Summary by CodeRabbit
New Features
Refactoring
Chores