diff --git a/playgrounds/astro/src/middlewares/auth.ts b/playgrounds/astro/src/middlewares/auth.ts index ae3dfa69f..5f4897abe 100644 --- a/playgrounds/astro/src/middlewares/auth.ts +++ b/playgrounds/astro/src/middlewares/auth.ts @@ -1,11 +1,11 @@ import type { User } from '../schemas/user' -import { os } from '@orpc/server' +import { ORPCError, os } from '@orpc/server' export const requiredAuthMiddleware = os .$context<{ session?: { user?: User } }>() .middleware(async ({ context, next }) => { if (!context.session || !context.session.user) { - throw new Error('UNAUTHORIZED') + throw new ORPCError('UNAUTHORIZED') } return next({ diff --git a/playgrounds/browser-extension/entrypoints/background/middlewares/auth.ts b/playgrounds/browser-extension/entrypoints/background/middlewares/auth.ts index a392694e6..97af93354 100644 --- a/playgrounds/browser-extension/entrypoints/background/middlewares/auth.ts +++ b/playgrounds/browser-extension/entrypoints/background/middlewares/auth.ts @@ -1,5 +1,5 @@ import type { User } from '../schemas/user' -import { os } from '@orpc/server' +import { ORPCError, os } from '@orpc/server' export const requiredAuthMiddleware = os .$context<{ session?: { user?: User } }>() @@ -12,7 +12,7 @@ export const requiredAuthMiddleware = os const session = context.session ?? await getSession() if (!session.user) { - throw new Error('UNAUTHORIZED') + throw new ORPCError('UNAUTHORIZED') } return next({ diff --git a/playgrounds/cloudflare-worker/package.json b/playgrounds/cloudflare-worker/package.json index 046ceeeb9..5e448a6f4 100644 --- a/playgrounds/cloudflare-worker/package.json +++ b/playgrounds/cloudflare-worker/package.json @@ -15,7 +15,13 @@ "@cloudflare/vite-plugin": "^1.9.6", "@orpc/client": "next", "@orpc/experimental-durable-event-iterator": "next", + "@orpc/json-schema": "next", + "@orpc/openapi": "next", "@orpc/server": "next", + "@orpc/tanstack-query": "next", + "@orpc/zod": "next", + "@scalar/api-reference-react": "^0.7.34", + "@tanstack/react-query": "^5.83.0", "@types/react": "^19.1.8", "@types/react-dom": "^19.1.5", "@vitejs/plugin-react": "^4.6.0", diff --git a/playgrounds/cloudflare-worker/src/App.tsx b/playgrounds/cloudflare-worker/src/App.tsx index d06ea35ba..1115812e4 100644 --- a/playgrounds/cloudflare-worker/src/App.tsx +++ b/playgrounds/cloudflare-worker/src/App.tsx @@ -1,9 +1,36 @@ import { ChatRoom } from './components/chat-room' +import { CreatePlanetMutationForm } from './components/orpc-mutation' +import { ListPlanetsQuery } from './components/orpc-query' +import '@scalar/api-reference-react/style.css' +import { ApiReferenceReact } from '@scalar/api-reference-react' export default function App() { + if (location.pathname === '/api') { + return ( + + ) + } + return ( -
+
+

ORPC Playground

+

+ You can visit the + {' '} + Scalar API Reference + {' '} + page. +

+
+ +
+ +
-
+ ) } diff --git a/playgrounds/cloudflare-worker/src/components/chat-room.tsx b/playgrounds/cloudflare-worker/src/components/chat-room.tsx index e72f54d53..712d352ba 100644 --- a/playgrounds/cloudflare-worker/src/components/chat-room.tsx +++ b/playgrounds/cloudflare-worker/src/components/chat-room.tsx @@ -3,13 +3,13 @@ import { client } from '../lib/orpc' export function ChatRoom() { const [messages, setMessages] = useState([]) - const [iterator, setIterator] = useState> | null>(null) + const [iterator, setIterator] = useState> | null>(null) useEffect(() => { const controller = new AbortController() void (async () => { - const iterator = await client.onMessage(undefined, { signal: controller.signal }) + const iterator = await client.message.on(undefined, { signal: controller.signal }) setIterator(iterator) for await (const message of iterator) { @@ -28,7 +28,9 @@ export function ChatRoom() { const form = new FormData(e.target as HTMLFormElement) const message = form.get('message') as string - await client.sendMessage({ message }) + await client.message.send({ message }) + // or --- + // await iterator?.publishMessageRPC({ message }) } return ( diff --git a/playgrounds/cloudflare-worker/src/components/orpc-mutation.tsx b/playgrounds/cloudflare-worker/src/components/orpc-mutation.tsx new file mode 100644 index 000000000..69aed1040 --- /dev/null +++ b/playgrounds/cloudflare-worker/src/components/orpc-mutation.tsx @@ -0,0 +1,58 @@ +import { useMutation, useQueryClient } from '@tanstack/react-query' +import { orpc } from '../lib/orpc' + +export function CreatePlanetMutationForm() { + const queryClient = useQueryClient() + + const { mutate } = useMutation( + orpc.planet.create.mutationOptions({ + onSuccess() { + queryClient.invalidateQueries({ + queryKey: orpc.planet.key(), + }) + }, + onError(error) { + console.error(error) + alert(error.message) + }, + }), + ) + + return ( +
+

oRPC and Tanstack Query | Create Planet example

+ +
{ + e.preventDefault() + const form = new FormData(e.target as HTMLFormElement) + + const name = form.get('name') as string + const description + = (form.get('description') as string | null) ?? undefined + const image = form.get('image') as File + + mutate({ + name, + description, + image: image.size > 0 ? image : undefined, + }) + }} + > + +