feat: adds react-query automatic proxy package#2440
Conversation
📝 WalkthroughWalkthroughAdds a new package Changes
Sequence Diagram(s)sequenceDiagram
autonumber
participant Consumer as Consumer Component
participant Proxy as Hooks Proxy
participant RQ as React Query
participant SDK as SDK Method
Consumer->>Proxy: access api.user.get
note right of Proxy: returns HooksProxy with getKey/useQuery/useMutation
alt useQuery flow
Consumer->>Proxy: call useQuery(input, opts)
Proxy->>Proxy: compute queryKey (path + inputToKey(input))
Proxy->>RQ: call useQuery({ queryKey, queryFn })
RQ->>SDK: invoke queryFn -> SDK.user.get(input)
SDK-->>RQ: return data
RQ-->>Consumer: provide data/status
end
alt useMutation flow
Consumer->>Proxy: call useMutation(opts)
Proxy->>Proxy: compute mutationKey (path)
Proxy->>RQ: call useMutation({ mutationKey, mutationFn })
Consumer->>RQ: trigger mutate(input)
RQ->>SDK: call mutationFn -> SDK.user.update(input)
SDK-->>RQ: return result
RQ-->>Consumer: mutation result/status
end
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Suggested reviewers
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
📜 Recent review detailsConfiguration used: defaults Review profile: CHILL Plan: Pro 📒 Files selected for processing (4)
✅ Files skipped from review due to trivial changes (2)
🧰 Additional context used📓 Path-based instructions (1)**/*.{ts,tsx,js}📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
Files:
🧠 Learnings (4)📚 Learning: 2025-11-25T17:45:44.790ZApplied to files:
📚 Learning: 2025-11-25T17:45:52.965ZApplied to files:
📚 Learning: 2026-01-15T12:29:45.510ZApplied to files:
📚 Learning: 2025-11-25T17:45:58.258ZApplied to files:
🧬 Code graph analysis (1)packages/react-query-proxy/jest.config.ts (1)
⏰ 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). (12)
🔇 Additional comments (2)
✏️ Tip: You can disable this entire section by setting Comment |
| @@ -8511,6 +8511,10 @@ | |||
| "resolved": "apps/provider-proxy", | |||
There was a problem hiding this comment.
🔄 Carefully review the package-lock.json diff
Resolve the comment if everything is ok
+ node_modules/@akashnetwork/react-query-proxy link:packages/react-query-proxy
+ packages/react-query-proxy 1.0.0
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #2440 +/- ##
==========================================
- Coverage 50.89% 50.88% -0.01%
==========================================
Files 1063 1063
Lines 29417 29417
Branches 6512 6495 -17
==========================================
- Hits 14971 14970 -1
- Misses 14026 14038 +12
+ Partials 420 409 -11
🚀 New features to boost your workflow:
|
02225eb to
dcc5410
Compare
There was a problem hiding this comment.
Actionable comments posted: 7
🧹 Nitpick comments (1)
packages/react-query-proxy/package.json (1)
4-4: Add a description for the package.The
descriptionfield is empty. Adding a meaningful description will help users understand the package's purpose.🔎 Proposed fix
- "description": "", + "description": "Wrap any async service into fully-typed TanStack React Query hooks at runtime",
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (4)
packages/react-query-proxy/README.mdpackages/react-query-proxy/package.jsonpackages/react-query-proxy/src/createProxy/createProxy.spec.tspackages/react-query-proxy/src/createProxy/createProxy.ts
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{ts,tsx,js}
📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
**/*.{ts,tsx,js}: Never use typeanyor cast to typeany. Always define the proper TypeScript types.
Never use deprecated methods from libraries.
Don't add unnecessary comments to the code.
Files:
packages/react-query-proxy/src/createProxy/createProxy.spec.tspackages/react-query-proxy/src/createProxy/createProxy.ts
**/*.spec.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/no-jest-mock.mdc)
Don't use
jest.mock()in test files. Instead, usejest-mock-extendedto create mocks and pass mocks as dependencies to the service under testUse
setupfunction instead ofbeforeEachin test files. Thesetupfunction must be at the bottom of the rootdescribeblock, should create an object under test and return it, accept a single parameter with inline type definition, avoid shared state, and not have a specified return type.
**/*.spec.{ts,tsx}: Use<Subject>.namein the root describe suite description instead of hardcoded class/service name strings to enable automated refactoring tools to find all references
Use either a method name or a condition starting with 'when' for nested suite descriptions in tests
Use present simple, 3rd person singular for test descriptions without prepending 'should'
Files:
packages/react-query-proxy/src/createProxy/createProxy.spec.ts
🧠 Learnings (2)
📚 Learning: 2025-11-25T17:45:52.965Z
Learnt from: CR
Repo: akash-network/console PR: 0
File: .cursor/rules/setup-instead-of-before-each.mdc:0-0
Timestamp: 2025-11-25T17:45:52.965Z
Learning: Applies to **/*.spec.{ts,tsx} : Use `setup` function instead of `beforeEach` in test files. The `setup` function must be at the bottom of the root `describe` block, should create an object under test and return it, accept a single parameter with inline type definition, avoid shared state, and not have a specified return type.
Applied to files:
packages/react-query-proxy/src/createProxy/createProxy.spec.ts
📚 Learning: 2025-11-25T17:45:44.790Z
Learnt from: CR
Repo: akash-network/console PR: 0
File: .cursor/rules/no-jest-mock.mdc:0-0
Timestamp: 2025-11-25T17:45:44.790Z
Learning: Applies to **/*.spec.{ts,tsx} : Don't use `jest.mock()` in test files. Instead, use `jest-mock-extended` to create mocks and pass mocks as dependencies to the service under test
Applied to files:
packages/react-query-proxy/src/createProxy/createProxy.spec.ts
🧬 Code graph analysis (1)
packages/react-query-proxy/src/createProxy/createProxy.spec.ts (1)
packages/react-query-proxy/src/createProxy/createProxy.ts (1)
createProxy(4-6)
⏰ 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). (17)
- GitHub Check: validate (apps/log-collector) / validate-unsafe
- GitHub Check: validate (apps/stats-web) / validate-unsafe
- GitHub Check: validate (apps/api) / validate-unsafe
- GitHub Check: validate / validate-app
- GitHub Check: test-build
- GitHub Check: validate / validate-app
- GitHub Check: test-build
- GitHub Check: test-build
- GitHub Check: validate / validate-app
- GitHub Check: test-build
- GitHub Check: validate / validate-app
- GitHub Check: test-build
- GitHub Check: validate / validate-app
- GitHub Check: test-build
- GitHub Check: test-build
- GitHub Check: Validate local packages
- GitHub Check: Analyze (javascript-typescript)
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (2)
packages/react-query-proxy/src/createProxy/createProxy.ts (2)
4-4: Replaceanytypes with proper TypeScript types.The coding guidelines state: "Never use type
anyor cast to typeany. Always define the proper TypeScript types."This was already flagged in previous reviews.
Also applies to: 15-15, 32-32, 50-50, 61-61, 77-77, 80-80
As per coding guidelines.
54-56: Critical bug: mutationKey mutates the shared fullPath array.This was already flagged in previous reviews.
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (4)
packages/react-query-proxy/README.mdpackages/react-query-proxy/package.jsonpackages/react-query-proxy/src/createProxy/createProxy.spec.tspackages/react-query-proxy/src/createProxy/createProxy.ts
🚧 Files skipped from review as they are similar to previous changes (3)
- packages/react-query-proxy/package.json
- packages/react-query-proxy/src/createProxy/createProxy.spec.ts
- packages/react-query-proxy/README.md
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{ts,tsx,js}
📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
**/*.{ts,tsx,js}: Never use typeanyor cast to typeany. Always define the proper TypeScript types.
Never use deprecated methods from libraries.
Don't add unnecessary comments to the code.
Files:
packages/react-query-proxy/src/createProxy/createProxy.ts
🧠 Learnings (2)
📚 Learning: 2025-11-25T17:45:39.561Z
Learnt from: CR
Repo: akash-network/console PR: 0
File: .cursor/rules/general.mdc:0-0
Timestamp: 2025-11-25T17:45:39.561Z
Learning: Applies to **/*.{ts,tsx,js} : Never use type `any` or cast to type `any`. Always define the proper TypeScript types.
Applied to files:
packages/react-query-proxy/src/createProxy/createProxy.ts
📚 Learning: 2025-11-25T17:45:39.561Z
Learnt from: CR
Repo: akash-network/console PR: 0
File: .cursor/rules/general.mdc:0-0
Timestamp: 2025-11-25T17:45:39.561Z
Learning: Applies to **/*.{ts,tsx,js} : Never use deprecated methods from libraries.
Applied to files:
packages/react-query-proxy/src/createProxy/createProxy.ts
⏰ 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). (9)
- GitHub Check: provider-proxy-ci
- GitHub Check: validate / validate-app
- GitHub Check: test-build
- GitHub Check: validate / validate-app
- GitHub Check: test-build
- GitHub Check: test-build
- GitHub Check: test-build
- GitHub Check: validate / validate-app
- GitHub Check: test-build
| const sdk = { | ||
| alerts: { | ||
| async list(input?: { page?: number }) { | ||
| return fetchAlerts(input) | ||
| }, | ||
|
|
||
| async create(input: { name: string }) { | ||
| return createAlert(input) | ||
| }, | ||
| }, | ||
| } |
There was a problem hiding this comment.
question: how would this be defined? with the auto generation code from this pr? https://github.com/akash-network/console/pull/2437/changes
There was a problem hiding this comment.
these are 2 conflicting approaches. Here is the key difference:
react-query hooks inference (this PR):
- it doesn't care how you generate SDK, it can be protobuf based sdk, REST based sdk or even self-written service. It just wraps that service and expose react-query hooks for its methods.
- we have clear layer separation: SDK on service layer and this proxy acts as a glue to expose any SDK/service to react world (i.e., in View).
qraft PR:
- works only with OpenAPI defined APIs. Cannot be applied to chain-sdk or self-written services
- no clear separation between view and service layer, since it was written to support react and react SSR. This potentially may cause react & react-query libs to leak into server side bundle (in console-api/etc). IMO, this is code "smell"
dcc5410 to
95fd181
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In `@packages/react-query-proxy/src/createProxy/createProxy.ts`:
- Around line 39-51: getKey currently builds keys from fullPath which omits the
current property (prop), causing methods like users.get and users.getById to
produce identical queryKeys; update the getKey closure to include prop in the
path (i.e., derive getKey from fullPath.concat(prop) or otherwise prepend/insert
prop into the key construction), then ensure useQuery and
valueByPath[key].getKey call that corrected getKey so queryKey includes the
method name for unique cache keys.
♻️ Duplicate comments (2)
packages/react-query-proxy/src/createProxy/createProxy.ts (2)
53-62: Note: mutationKey also missing method name (in addition to mutation bug).The mutation bug at line 54-56 was already flagged. When fixing it, ensure the method name (
prop) is included in the key, consistent with the queryKey fix above:useMutation: options => { - const mutationKey = fullPath; + const mutationKey = [...methodPath]; if (options?.mutationKey) { mutationKey.push(...(options.mutationKey as PropertyKey[])); }This assumes
methodPathis defined as[...fullPath, prop]per the queryKey fix.
76-96: Type definitions useanyextensively.The type definitions at lines 77, 80, 85, 87, 93, 95 use
anywhich violates the coding guidelines. This was flagged in a previous review - please address it along with the otheranyusages throughout the file.
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (5)
packages/react-query-proxy/README.mdpackages/react-query-proxy/package.jsonpackages/react-query-proxy/src/createProxy/createProxy.spec.tspackages/react-query-proxy/src/createProxy/createProxy.tspackages/react-query-sdk/.eslintrc.js
🚧 Files skipped from review as they are similar to previous changes (3)
- packages/react-query-proxy/src/createProxy/createProxy.spec.ts
- packages/react-query-proxy/README.md
- packages/react-query-proxy/package.json
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{ts,tsx,js}
📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
**/*.{ts,tsx,js}: Never use typeanyor cast to typeany. Always define the proper TypeScript types.
Never use deprecated methods from libraries.
Don't add unnecessary comments to the code.
Files:
packages/react-query-proxy/src/createProxy/createProxy.ts
🧠 Learnings (3)
📚 Learning: 2025-11-25T17:45:39.561Z
Learnt from: CR
Repo: akash-network/console PR: 0
File: .cursor/rules/general.mdc:0-0
Timestamp: 2025-11-25T17:45:39.561Z
Learning: Applies to **/*.{ts,tsx,js} : Never use type `any` or cast to type `any`. Always define the proper TypeScript types.
Applied to files:
packages/react-query-proxy/src/createProxy/createProxy.ts
📚 Learning: 2025-11-25T17:45:39.561Z
Learnt from: CR
Repo: akash-network/console PR: 0
File: .cursor/rules/general.mdc:0-0
Timestamp: 2025-11-25T17:45:39.561Z
Learning: Applies to **/*.{ts,tsx,js} : Never use deprecated methods from libraries.
Applied to files:
packages/react-query-proxy/src/createProxy/createProxy.ts
📚 Learning: 2025-10-31T11:26:42.138Z
Learnt from: stalniy
Repo: akash-network/console PR: 2138
File: apps/api/src/billing/lib/batch-signing-client/batch-signing-client.service.ts:379-382
Timestamp: 2025-10-31T11:26:42.138Z
Learning: In TypeScript/JavaScript, the pattern of checking a cached value and then performing an async operation to fetch it without proper synchronization is race condition unsafe:
```typescript
private async getAddress() {
if (!this.address) {
this.address = await this.wallet.getFirstAddress();
}
return this.address;
}
```
Multiple concurrent calls can all pass the `if (!this.address)` check before any of them sets the value, leading to duplicate async operations. This should be flagged as a race condition. Proper synchronization (mutex, atomic promise caching, or guaranteed single-threaded execution) is required.
Applied to files:
packages/react-query-proxy/src/createProxy/createProxy.ts
🔇 Additional comments (1)
packages/react-query-sdk/.eslintrc.js (1)
1-3: Simplification approved.The removal of the
overridesblock withemitDecoratorMetadataandexperimentalDecoratorsis safe—the package does not use TypeScript decorators. This change appropriately simplifies the ESLint configuration to inherit from the shared dev-config, improving consistency and maintainability.
✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.
dec34fc to
32bb430
Compare

Why
to have a way to automatically convert service into react-query observable hooks
Summary by CodeRabbit
New Features
Documentation
Tests
Chores
✏️ Tip: You can customize this high-level summary in your review settings.