experimental-a2 0.16.1 → 0.17.0

package/docs/guides/09-presence.mdx

@@ -48,6 +48,7 @@ export const canvas = a2.contract({
     }),
     'shape.moved': z.object({ id: z.string(), x: z.number(), y: z.number() }),
   },
+  reducer: { name: 'scene', initialState: {}, fold: (state) => state },
   presence: {
     cursor: z.object({ x: z.number(), y: z.number() }),
     dragging: z.object({ shapeId: z.string(), x: z.number(), y: z.number() }),
@@ -96,7 +97,7 @@ nonce, the playground's guest name). State it once on
 or pass it to the provider, whose `participant` prop overrides the
 client's. The hook grows two members. The
 session module is the usual pair from
-[Live UI](/guides/react#the-session-module), bound to a reducer that
+[Live UI](/guides/react#bind-react-once), bound to a reducer that
 carries the canvas contract:
 
 ```ts app/canvas/[canvasId]/session.ts
@@ -105,13 +106,8 @@ import { createClient } from 'experimental-a2/client'
 import { createReact } from 'experimental-a2/react'
 import { canvas } from '@/contracts'
 
-// a minimal scene fold; the real one lives with your reducers
-const sceneReducer = canvas
-  .reducer({ name: 'scene', initialState: {} })
-  .fold((state) => state)
-
 export const canvasClient = createClient({
-  reducer: sceneReducer,
+  contract: canvas,
   api: '/api/canvas-events',
 })
 export const { SessionProvider, useSession } = createReact({

package/docs/guides/10-transports.mdx

@@ -41,7 +41,7 @@ WebSockets take one plain URL because the connection carries more than one
 session.
 
 One wire is missing from `ws` by design: the history lane.
-[`loadHistory`](/guides/react#the-client-component) is a bounded cold
+[`loadHistory`](/guides/react#events-and-history) is a bounded cold
 read and rides plain HTTP. On a `ws` API it throws a `TypeError`.
 
 ## The HTTP route
@@ -147,10 +147,10 @@ export function GET(request: Request): Promise<Response> {
 ```ts app/orders/multiplexed-session.ts
 'use client'
 import { createClient } from 'experimental-a2/client'
-import { ordersReducer } from '@/reducer'
+import { orders } from '@/contracts'
 
 export const ordersClient = createClient({
-  reducer: ordersReducer,
+  contract: orders,
   api: {
     type: 'ws',
     url: '/api/multiplexed-order-events',
@@ -182,10 +182,10 @@ platform capabilities used internally, not options on `server.fetch`.
 'use client'
 import { createClient } from 'experimental-a2/client'
 import { createReact } from 'experimental-a2/react'
-import { ordersReducer } from '@/reducer'
+import { orders } from '@/contracts'
 
 export const ordersClient = createClient({
-  reducer: ordersReducer,
+  contract: orders,
   api: { type: 'ws', url: '/api/order-events' },
 })
 export const { SessionProvider, useSession } = createReact({

package/docs/index.mdx

@@ -34,6 +34,11 @@ export const orders = a2.contract({
     'shop.notified': z.object({}),
     cancelled: z.object({}),
   },
+  reducer: {
+    name: 'order-status',
+    initialState: { status: 'new' },
+    fold: (state, event) => ({ status: event.type === 'shop.notified' ? 'notified' : event.type }),
+  },
 })
 ```
 
@@ -101,28 +106,15 @@ nothing server-only, which is about to matter.
 ```ts reducer.ts
 import { orders } from '@/contracts'
 
-export const orderStatus = orders
-  .reducer({ name: 'order-status', initialState: { status: 'new' } })
-  .fold((state, event) => {
-    switch (event.type) {
-      case 'created':
-        return { status: 'created' }
-      case 'shop.notified':
-        return { status: 'notified' }
-      case 'cancelled':
-        return { status: 'cancelled' }
-      default:
-        return state
-    }
-  })
+export const orderStatus = orders.reducer
 ```
 
 ```ts
 // anywhere on the server:
 import { ordersServer } from '@/server/orders'
-import { orderStatus } from '@/reducer'
+import { orders } from '@/contracts'
 
-const { state } = await ordersServer.session(orderId).state(orderStatus)
+const { state } = await ordersServer.session(orderId).state()
 // state → { status: 'notified' }
 ```
 
@@ -135,10 +127,10 @@ all typed by the one contract:
 ```ts app/orders/[orderId]/session.ts
 'use client'
 import { createReact } from 'experimental-a2/react'
-import { orderStatus } from '@/reducer'
+import { orders } from '@/contracts'
 
 export const { SessionProvider, useSession } = createReact({
-  reducer: orderStatus,
+  contract: orders,
 })
 ```