feat(react-query-auth): modernize for React 19 and React Query 5#43
Open
riceharvest wants to merge 78 commits intomainfrom
Open
feat(react-query-auth): modernize for React 19 and React Query 5#43riceharvest wants to merge 78 commits intomainfrom
riceharvest wants to merge 78 commits intomainfrom
Conversation
- Upgraded multiple packages to modern standards (Next.js, Next-auth, PWA, SEO). - Added new utility packages: critters, next-circuit-breaker, next-csrf, next-images, next-json-ld. - Integrated Changesets for versioning. - Updated CI/CD workflows and linting configurations. - Fixed numerous linting and type-checking issues across the monorepo.
- Remove legacy NextAuth adapters and resolve workspace version conflicts - Clean up test warning noise and fix tsconfig/jest setups for next-auth - Update Workbox/Terser dependencies in next-pwa to align with workspace - Synchronize root lockfile to reflect nested package resolutions
Fixes `JWT_AUTO_GENERATED_SIGNING_KEY` and `JWT_AUTO_GENERATED_ENCRYPTION_KEY` warnings properly by supplying JWKs directly in the test suite rather than mocking the logger.
|
You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard. |
ⓘ You are approaching your monthly quota for Qodo. Upgrade your plan Review Summary by QodoComprehensive modernization: React 19/React Query 5 support, Web API session integration, MDX content system, and infrastructure improvements
WalkthroughsDescription• **Modernized React ecosystem support**: Updated react-query-auth to support React 19 and React Query v5, with comprehensive test coverage for authentication flows • **Enhanced session management**: Refactored session decoration to support both traditional Node.js and modern Web APIs (Request/Response), added getWebSession() function and improved utility functions for duration parsing • **Improved CSRF protection**: Added App Router support with verifyCsrfToken, enhanced token extraction and validation, changed default httpOnly to false for client-readable tokens, added comprehensive middleware tests • **MDX content system**: Implemented complete MDX support with node retrieval, file discovery, path generation, configuration loading, table of contents generation, and client-side hydration utilities • **Test infrastructure modernization**: Migrated multiple test suites from Jest/Vitest to Node.js built-in test runner, simplified test coverage in several packages, added comprehensive test suites for new functionality • **OAuth implementation**: Removed external oauth package dependency by implementing native OAuth 2.x client using fetch API • **Critical bug fixes**: Fixed CSS inlining issues in critters, improved container detection robustness, enhanced iron-session crypto handling • **Type system improvements**: Expanded TypeORM adapter type definitions, updated OAuth provider types with new checks property, enhanced session type definitions for duration parsing • **Build configuration updates**: Simplified and optimized build configs across multiple packages, added PWA plugin type definitions, updated critters to generate TypeScript declarations • **Cookie and utility optimizations**: Optimized cookie instance management with singleton pattern, enhanced session utilities for Web API support, improved middleware execution with proper error handling Diagramflowchart LR
A["React 19 & React Query 5"] --> B["react-query-auth"]
C["Web APIs<br/>Request/Response"] --> D["Session Management"]
E["App Router"] --> F["CSRF Protection"]
G["MDX Config"] --> H["MDX System"]
H --> I["Node Retrieval"]
H --> J["Client Hydration"]
K["Native OAuth"] --> L["next-auth"]
M["Node.js Test Runner"] --> N["Test Infrastructure"]
O["TypeScript Types"] --> P["Type Definitions"]
B --> Q["Enhanced Auth"]
D --> Q
F --> Q
L --> Q
N --> Q
P --> Q
File Changes1. packages/next-images/test/index.test.ts
|
Code Review by Qodo
1. vitest.config.js not Prettier-formatted
|
![qodo-code-review[bot]](https://avatars.githubusercontent.com/in/484649?s=60&v=4){kind=small}
Comment on lines
+1
to
+10
| import { defineConfig } from "vitest/config" | ||
|
|
||
| export default defineConfig({ | ||
| test: { | ||
| globals: true, | ||
| env: { | ||
| NEXTAUTH_URL: "http://localhost:3000/api/auth", | ||
| }, | ||
| }, | ||
| }) |
There was a problem hiding this comment.
1. vitest.config.js not prettier-formatted 📘 Rule violation ✓ Correctness
The added vitest.config.js uses double quotes and omits semicolons, conflicting with the repository Prettier standards. This increases diff noise and can cause inconsistent formatting across the monorepo.
Agent Prompt
## Issue description
The added `vitest.config.js` does not follow repository Prettier rules (double quotes + missing semicolons), creating inconsistent formatting.
## Issue Context
Repository standards require Prettier-consistent formatting (including single quotes and semicolons).
## Fix Focus Areas
- vitest.config.js[1-10]
ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools
Comment on lines
+1
to
+4
| import { vi } from 'vitest'; | ||
| import { parsePluginConfig, composePlugins } from '../compose'; | ||
| import { markOptional } from '../optional'; | ||
|
|
There was a problem hiding this comment.
2. compose.test.js wrong extension 📘 Rule violation ⛯ Reliability
A newly added test file uses the .test.js extension instead of *.test.ts or *.test.tsx. This breaks the required test naming convention for discoverability and consistency.
Agent Prompt
## Issue description
A new test file was added with a `.test.js` extension, but the repo requires `*.test.ts` or `*.test.tsx`.
## Issue Context
Test tooling and contributor expectations rely on a consistent naming convention.
## Fix Focus Areas
- packages/next-compose-plugins/src/__tests__/compose.test.js[1-10]
ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools
| "test:cov": "vitest run --coverage", | ||
| "test:coverage": "pnpm test:cov", | ||
| "postbuild": "npm run check:exports", | ||
| "build": "tsup src/index.tsx --config tsup.config.ts", |
There was a problem hiding this comment.
3. react-query-auth entrypoint not index.ts 📘 Rule violation ✓ Correctness
The package build points to src/index.tsx rather than using the standard public entrypoint src/index.ts. This breaks the monorepo convention for consistent package entrypoints.
Agent Prompt
## Issue description
The package entrypoint convention requires `src/index.ts`, but this PR uses `src/index.tsx` as the entrypoint.
## Issue Context
Monorepo tooling and maintainers expect a consistent entrypoint path across packages.
## Fix Focus Areas
- packages/react-query-auth/package.json[41-41]
- packages/react-query-auth/src/index.tsx[1-10]
ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools
Comment on lines
+215
to
+238
| class OAuth1Client { | ||
| constructor(provider) { | ||
| this.provider = provider | ||
| // Note: This is a placeholder for actual OAuth1 signature logic if needed. | ||
| // For now, we will use a small internal helper or inline the logic. | ||
| // Given the complexity of OAuth1 signatures, for the scope of this refactor | ||
| // and to maintain stability, we'll implement the basics or use a lightweight helper. | ||
| // In many cases, OAuth1 is being deprecated, but for this fork we want to keep it. | ||
| } | ||
|
|
||
| async getOAuthRequestToken(params = {}) { | ||
| // Implement OAuth 1.0a request token logic | ||
| throw new Error("OAuth 1.0a is not yet fully implemented in the native client. Please use OAuth 2.0 or contact maintainers.") | ||
| } | ||
|
|
||
| async getOAuthAccessToken(oauth_token, oauth_token_secret, oauth_verifier) { | ||
| // Implement OAuth 1.0a access token logic | ||
| throw new Error("OAuth 1.0a is not yet fully implemented in the native client.") | ||
| } | ||
|
|
||
| async get(url, oauth_token, oauth_token_secret) { | ||
| // Implement OAuth 1.0a authenticated request | ||
| throw new Error("OAuth 1.0a is not yet fully implemented in the native client.") | ||
| } |
There was a problem hiding this comment.
4. Oauth1 flow now broken 🐞 Bug ✓ Correctness
oAuthClient() now returns new OAuth1Client(provider) for any provider that is not OAuth 2.x, but OAuth1Client’s methods throw "not yet fully implemented", so OAuth 1.0a providers (e.g., Twitter) will fail at runtime when trying to sign in.
Agent Prompt
### Issue description
`packages/next-auth/src/server/lib/oauth/client.js` returns an OAuth1Client for OAuth 1.x providers, but OAuth1Client methods currently throw "not yet fully implemented". This breaks OAuth 1.0a providers (e.g., Twitter) at runtime.
### Issue Context
The repo still includes an OAuth 1.0A provider configuration (Twitter), so the unimplemented code path is reachable in production.
### Fix Focus Areas
- packages/next-auth/src/server/lib/oauth/client.js[11-21]
- packages/next-auth/src/server/lib/oauth/client.js[215-238]
- packages/next-auth/src/providers/twitter.js[1-12]
### Expected change
Implement OAuth 1.0a behavior (or restore the previous proven OAuth 1.x client) so that Twitter and any other OAuth1 providers can complete request-token, access-token exchange, and signed API calls without throwing.
ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools
Comment on lines
+13
to
+18
| export interface ReactQueryAuthConfig<User, LoginCredentials, RegisterCredentials> { | ||
| userFn: QueryFunction<User, QueryKey> | ||
| loginFn: MutationFunction<User, LoginCredentials> | ||
| registerFn: MutationFunction<User, RegisterCredentials> | ||
| logoutFn: MutationFunction<unknown, unknown> | ||
| userKey?: QueryKey |
There was a problem hiding this comment.
5. Auth user null mistyped 🐞 Bug ✓ Correctness
In react-query-auth, userFn is typed to return User, but the README and implementation treat an unauthenticated state as null, so consumers can get null at runtime while TypeScript implies a User result.
Agent Prompt
### Issue description
`ReactQueryAuthConfig.userFn` is typed as returning `User`, but the README and implementation expect unauthenticated to be represented as `null`. This makes the library’s TypeScript types unsound.
### Issue Context
- README: `userFn` resolves to user or `null`.
- `AuthLoader` treats missing `data` as unauthenticated.
- `useLogout` writes `null` into the query cache.
### Fix Focus Areas
- packages/react-query-auth/src/index.tsx[13-18]
- packages/react-query-auth/src/index.tsx[30-35]
- packages/react-query-auth/src/index.tsx[67-79]
- packages/react-query-auth/src/index.tsx[82-111]
- packages/react-query-auth/README.md[95-111]
### Expected change
Adjust generics/types so unauthenticated is represented as `User | null` (or introduce a dedicated `AuthenticatedUser` type). Ensure `useUser`/`AuthLoader`/logout cache updates all agree with the docs and runtime behavior.
ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools
Owner
Author
|
|
1 similar comment
Owner
Author
|
|
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.
Closes #22 (roadmap).
reactandreact-domto ^19.0.0 indevDependencies.peerDependenciesto support React 19 and@tanstack/react-queryv5.