Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
WalkthroughThis update revises documentation for oRPC adapters across several frameworks, clarifies code comments regarding headers in server-side client context, and restructures the Nuxt playground to use Nuxt plugins for oRPC client/server integration. It also removes static imports of the oRPC client in Nuxt components, replacing them with injected context access. Changes
Sequence Diagram(s)sequenceDiagram
participant NuxtComponent
participant NuxtAppContext
participant orpcPlugin
NuxtComponent->>NuxtAppContext: useNuxtApp()
NuxtAppContext-->>NuxtComponent: provide $orpc
NuxtComponent->>$orpc: perform query/mutation
$orpc->>Server: send RPC request
Server-->>$orpc: return response
$orpc-->>NuxtComponent: resolve query/mutation
Possibly related PRs
Poem
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
Codecov ReportAll modified and coverable lines are covered by tests ✅ 📢 Thoughts on this report? Let us know! |
More templates
@orpc/arktype
@orpc/client
@orpc/contract
@orpc/hey-api
@orpc/nest
@orpc/openapi
@orpc/openapi-client
@orpc/react
@orpc/react-query
@orpc/server
@orpc/shared
@orpc/solid-query
@orpc/standard-server
@orpc/standard-server-aws-lambda
@orpc/standard-server-fetch
@orpc/standard-server-node
@orpc/standard-server-peer
@orpc/svelte-query
@orpc/tanstack-query
@orpc/valibot
@orpc/vue-colada
@orpc/vue-query
@orpc/zod
commit: |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (8)
apps/content/docs/adapters/tanstack-start.md (1)
12-12: Fix grammatical error in documentation header
The sentence uses “setup” as a verb and is missing an article. Please update it to:- You setup oRPC server inside TanStack Start using its [API Routes](https://tanstack.com/start/latest/docs/framework/react/api-routes). + You set up an oRPC server inside TanStack Start using its [API Routes](https://tanstack.com/start/latest/docs/framework/react/api-routes).🧰 Tools
🪛 LanguageTool
[grammar] ~12-~12: The word “setup” is a noun. The verb is spelled with a space.
Context: ...s/adapters/http) guide. ## Server You setup oRPC server inside TanStack Start using...(NOUN_VERB_CONFUSION)
[uncategorized] ~12-~12: You might be missing the article “an” here.
Context: ...ters/http) guide. ## Server You setup oRPC server inside TanStack Start using its ...(AI_EN_LECTOR_MISSING_DETERMINER_AN)
apps/content/docs/adapters/next.md (1)
16-16: Fix grammar issues in the documentation.The static analysis tools have identified grammar issues that should be addressed for better documentation quality.
Apply this diff to fix the grammar:
-You setup oRPC server inside Next.js using its [Route Handlers](https://nextjs.org/docs/app/building-your-application/routing/route-handlers). +You set up an oRPC server inside Next.js using its [Route Handlers](https://nextjs.org/docs/app/building-your-application/routing/route-handlers).🧰 Tools
🪛 LanguageTool
[grammar] ~16-~16: The word “setup” is a noun. The verb is spelled with a space.
Context: ...iguration required. ::: ## Server You setup oRPC server inside Next.js using its [R...(NOUN_VERB_CONFUSION)
[uncategorized] ~16-~16: You might be missing the article “an” here.
Context: ...ion required. ::: ## Server You setup oRPC server inside Next.js using its [Route ...(AI_EN_LECTOR_MISSING_DETERMINER_AN)
playgrounds/nuxt/plugins/orpc.client.ts (1)
7-12: Client plugin initialization and RPCLink configuration.
The.client.tssuffix confines this plugin to the browser, so usingwindow.location.originis safe.Consider externalizing the RPC URL via Nuxt’s runtime config for flexibility across environments, for example:
const config = useRuntimeConfig() const url = config.public.rpcBaseURL ?? `${window.location.origin}/rpc`playgrounds/nuxt/plugins/orpc.server.ts (3)
5-9: JSDoc link is informative.
The comment points to the Optimize SSR docs. Consider adding a one-sentence summary of the plugin’s purpose to improve discoverability.
10-12: Remove or rename unused parameter.
The callback’snuxtparameter is never used. Rename to_nuxtAppor omit it to satisfy linters and clarify intent.
13-17: Server-side client context configuration.
By default, no headers are forwarded. If you need to pass incoming request headers, uncomment and map them correctly, e.g.:- context: { - // headers: event?.headers, - }, + context: { + headers: Object.fromEntries(event.node.req.headers), + },Let me know if you’d like a full snippet for header extraction.
apps/content/docs/adapters/nuxt.md (2)
10-12: Fix verb and article in Server section.
Change “You setup oRPC server inside Nuxt…” to “You set up an oRPC server in Nuxt…” to correct the verb form and include the indefinite article.🧰 Tools
🪛 LanguageTool
[grammar] ~12-~12: The word “setup” is a noun. The verb is spelled with a space.
Context: ...s/adapters/http) guide. ## Server You setup oRPC server inside Nuxt using its [Serv...(NOUN_VERB_CONFUSION)
[uncategorized] ~12-~12: You might be missing the article “an” here.
Context: ...ters/http) guide. ## Server You setup oRPC server inside Nuxt using its [Server Ro...(AI_EN_LECTOR_MISSING_DETERMINER_AN)
50-52: Correct phrasing in Client section.
Update “you need setup client inside [Nuxt Plugin]” to “you need to set up a client inside a Nuxt plugin” to fix the verb form, add the missing preposition “to,” and include the article “a.”🧰 Tools
🪛 LanguageTool
[uncategorized] ~52-~52: You might be missing the article “an” here.
Context: ...custom handler. ::: ## Client To make oRPC client compatible with SSR, you need se...(AI_EN_LECTOR_MISSING_DETERMINER_AN)
[uncategorized] ~52-~52: Possible missing preposition found.
Context: ...PC client compatible with SSR, you need setup client inside [Nuxt Plugin](https://nux...(AI_HYDRA_LEO_MISSING_TO)
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (13)
apps/content/docs/adapters/next.md(3 hunks)apps/content/docs/adapters/nuxt.md(2 hunks)apps/content/docs/adapters/solid-start.md(1 hunks)apps/content/docs/adapters/tanstack-start.md(2 hunks)playgrounds/next/src/lib/orpc.server.ts(1 hunks)playgrounds/nuxt/components/orpc-mutation.vue(1 hunks)playgrounds/nuxt/components/orpc-query.vue(1 hunks)playgrounds/nuxt/lib/orpc.ts(0 hunks)playgrounds/nuxt/plugins/orpc.client.ts(1 hunks)playgrounds/nuxt/plugins/orpc.server.ts(1 hunks)playgrounds/nuxt/server/routes/rpc/[...].ts(1 hunks)playgrounds/solid-start/src/lib/orpc.server.ts(1 hunks)playgrounds/tanstack-start/src/lib/orpc.ts(1 hunks)
💤 Files with no reviewable changes (1)
- playgrounds/nuxt/lib/orpc.ts
🧰 Additional context used
🧬 Code Graph Analysis (1)
playgrounds/nuxt/plugins/orpc.client.ts (4)
packages/client/src/adapters/fetch/rpc-link.ts (1)
RPCLink(16-22)playgrounds/tanstack-start/src/lib/orpc.ts (2)
client(45-45)orpc(47-47)packages/server/src/router-client.ts (1)
RouterClient(15-20)packages/client/src/client.ts (1)
createORPCClient(16-42)
🪛 LanguageTool
apps/content/docs/adapters/tanstack-start.md
[grammar] ~12-~12: The word “setup” is a noun. The verb is spelled with a space.
Context: ...s/adapters/http) guide. ## Server You setup oRPC server inside TanStack Start using...
(NOUN_VERB_CONFUSION)
[uncategorized] ~12-~12: You might be missing the article “an” here.
Context: ...ters/http) guide. ## Server You setup oRPC server inside TanStack Start using its ...
(AI_EN_LECTOR_MISSING_DETERMINER_AN)
apps/content/docs/adapters/next.md
[grammar] ~16-~16: The word “setup” is a noun. The verb is spelled with a space.
Context: ...iguration required. ::: ## Server You setup oRPC server inside Next.js using its [R...
(NOUN_VERB_CONFUSION)
[uncategorized] ~16-~16: You might be missing the article “an” here.
Context: ...ion required. ::: ## Server You setup oRPC server inside Next.js using its [Route ...
(AI_EN_LECTOR_MISSING_DETERMINER_AN)
apps/content/docs/adapters/nuxt.md
[grammar] ~12-~12: The word “setup” is a noun. The verb is spelled with a space.
Context: ...s/adapters/http) guide. ## Server You setup oRPC server inside Nuxt using its [Serv...
(NOUN_VERB_CONFUSION)
[uncategorized] ~12-~12: You might be missing the article “an” here.
Context: ...ters/http) guide. ## Server You setup oRPC server inside Nuxt using its [Server Ro...
(AI_EN_LECTOR_MISSING_DETERMINER_AN)
[uncategorized] ~52-~52: You might be missing the article “an” here.
Context: ...custom handler. ::: ## Client To make oRPC client compatible with SSR, you need se...
(AI_EN_LECTOR_MISSING_DETERMINER_AN)
[uncategorized] ~52-~52: Possible missing preposition found.
Context: ...PC client compatible with SSR, you need setup client inside [Nuxt Plugin](https://nux...
(AI_HYDRA_LEO_MISSING_TO)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: lint
- GitHub Check: publish-commit
🔇 Additional comments (18)
playgrounds/tanstack-start/src/lib/orpc.ts (1)
26-26: Approve header clarification comment
The added inline comment clearly indicates when headers are provided for initial contexts without altering logic.apps/content/docs/adapters/tanstack-start.md (1)
100-100: Approve header provision comment in code example
This comment aligns with similar clarifications across adapters and improves clarity without changing behavior.playgrounds/next/src/lib/orpc.server.ts (1)
21-21: Approve header clarification comment
The inline comment appropriately explains the purpose ofheadersin the initial context.playgrounds/solid-start/src/lib/orpc.server.ts (1)
26-26: Approve header clarification comment
The added comment consistently documents header provision in SSR context.apps/content/docs/adapters/solid-start.md (1)
120-120: Approve header clarification comment in documentation
This mirrors the comment updates in code examples and improves clarity.playgrounds/nuxt/components/orpc-mutation.vue (2)
3-4: LGTM! Clean migration to Nuxt plugin injection.The migration from static imports to using
useNuxtApp()follows Nuxt best practices and enables better SSR support. This aligns with the PR objective of improving Nuxt SSR integration.
8-11: Consistent usage of injected oRPC client.All references to the oRPC client have been properly updated to use
$orpcfrom the Nuxt app context, maintaining the existing functionality while leveraging the new plugin-based approach.playgrounds/nuxt/components/orpc-query.vue (2)
4-6: Excellent migration to plugin-based oRPC access.The consistent use of
useNuxtApp()to access$orpcmaintains the same functionality while enabling better integration with Nuxt's SSR capabilities.
12-12: Perfect addition for SSR support.The
await query.suspense()call ensures the query resolves on the server before rendering, preventing hydration mismatches and improving the SSR experience. This is exactly what's needed for proper Nuxt SSR integration.playgrounds/nuxt/server/routes/rpc/[...].ts (1)
14-14: Appropriate simplification for playground environment.Removing the conditional authorization header check and providing a fixed user context simplifies the playground setup while maintaining the necessary context structure for testing. This is perfect for a demo/playground environment.
apps/content/docs/adapters/next.md (2)
92-92: Good typographical correction.The apostrophe fix in "doesn't" improves the documentation's professional appearance.
180-180: Helpful comment addition for clarity.The comment explaining when to provide headers in the initial context adds valuable guidance for developers implementing server-side clients. This aligns with similar clarifications made across other adapter documentations.
playgrounds/nuxt/plugins/orpc.client.ts (3)
1-5: Imports are correctly set up for the typed ORPC client.
Using type-only imports forRouterClientandrouterensures no runtime overhead, and the client/fetch and tanstack-query packages are appropriately referenced.
13-16: Creating the typed ORPC client and integrating TanStack Query.
createORPCClient(link)followed bycreateTanstackQueryUtils(client)correctly wires up RPC calls with TanStack Query’s caching and hooks.
17-21: Providingorpcvia Nuxt app context.
Injecting theorpcobject under theorpckey makes it available in components throughuseNuxtApp().orpc.playgrounds/nuxt/plugins/orpc.server.ts (3)
1-3: Imports correctly reference server-side ORPC APIs.
UsingcreateRouterClientfrom@orpc/serverandcreateTanstackQueryUtilsis the right approach for SSR integration.
19-20: Integrate TanStack Query utilities.
CreatingorpcviacreateTanstackQueryUtils(client)is correct for enabling SSR-aware queries and mutations.
21-25: Provideorpcin Nuxt app context.
Injectingorpcon the server side ensures that the same query utilities are available during SSR.
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (4)
apps/content/docs/adapters/nuxt.md (4)
50-52: Clarify plugin file scoping and naming conventions.
Consider noting that placing the file asplugins/orpc.tsloads it universally, while suffixing.client.tsor.server.tsenables client-only or server-only loading. This helps prevent unintended SSR or client-side behavior.
73-76: Consistent formatting for the info block.
As a minor nitpick, consider using a::: code-groupwrapper or adding a title to the info block to match the styling of preceding examples.
83-98: Include missing imports and clarify context for client plugin.
The example omits imports forRPCLink,createORPCClient, androuter. Adding these will make the snippet copy-pasta-ready and prevent confusion about dependency origins.diff --git a/apps/content/docs/adapters/nuxt.md b/apps/content/docs/adapters/nuxt.md index def5678..fedcba9 100644 --- a/apps/content/docs/adapters/nuxt.md +++ b/apps/content/docs/adapters/nuxt.md @@ 83,6 +83,8 @@ ```ts [plugins/orpc.client.ts] +import { RPCLink, createORPCClient } from '@orpc/client' +import { router } from '~/server/routes/rpc' export default defineNuxtPlugin(() => { const link = new RPCLink({ url: `${window.location.origin}/rpc`,
100-116: Add explicit imports and unify injection key for server plugin.
Similar to the client plugin, include imports forcreateRouterClientandrouter. Also consider standardizing the injected key name (e.g.,orpc) to match client usage and avoid genericclientcollisions.diff --git a/apps/content/docs/adapters/nuxt.md b/apps/content/docs/adapters/nuxt.md index fedcba9..1234567 100644 --- a/apps/content/docs/adapters/nuxt.md +++ b/apps/content/docs/adapters/nuxt.md @@ 100,6 +100,8 @@ ```ts [plugins/orpc.server.ts] +import { createRouterClient } from '@orpc/client' +import { router } from '~/server/routes/rpc' export default defineNuxtPlugin((nuxtApp) => { const event = useRequestEvent() @@ 111,7 +113,7 @@ return { provide: { - client, + orpc: client, }, } })
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
apps/content/docs/adapters/next.md(3 hunks)apps/content/docs/adapters/nuxt.md(2 hunks)apps/content/docs/adapters/tanstack-start.md(2 hunks)
✅ Files skipped from review due to trivial changes (1)
- apps/content/docs/adapters/tanstack-start.md
🚧 Files skipped from review as they are similar to previous changes (1)
- apps/content/docs/adapters/next.md
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: publish-commit
- GitHub Check: lint
🔇 Additional comments (2)
apps/content/docs/adapters/nuxt.md (2)
10-13: Great rename and clarification in Server section.
The "Server" heading and its accompanying description accurately reflect Nuxt’s Server Routes usage for setting up oRPC.
77-80: Optimize SSR section is clear and actionable.
The new section succinctly explains the benefits of a server-side client and links to deeper best practices.
1 participant
Summary by CodeRabbit
Documentation
Refactor