@playfast/reform-remote 1.0.2 → 1.2.0

package/src/server.test.ts

@@ -2,8 +2,14 @@ import { createElement, Fragment, type ReactNode } from 'react'
 import { renderToStaticMarkup } from 'react-dom/server'
 import { expect, test } from 'vitest'
 import { Option } from 'effect'
-import { Ui, Wire } from '@playfast/reform'
-import type { WireNode, WirePatch, WireProp, WireTree } from '@playfast/reform'
+import { Ui } from '@playfast/reform'
+import {
+  Wire,
+  type WireNode,
+  type WirePatch,
+  type WireProp,
+  type WireTree,
+} from '@playfast/reform/internal'
 import { makeRemoteServer } from './server'
 import { remoteViews, renderWireTree } from './client'
 import {
@@ -17,15 +23,20 @@ import {
   structureCounterScene,
 } from './fixtures'
 
-const draw = (node: ReactNode): void => void renderToStaticMarkup(createElement(Fragment, null, node))
+const draw = (node: ReactNode): void =>
+  void renderToStaticMarkup(createElement(Fragment, null, node))
 
 const dataOf = (node: WireNode, name: string): WireProp | undefined =>
   node.props.find((prop) => prop._tag === 'Data' && prop.name === name)
 
 const eventOf = (node: WireNode, name: string): Extract<WireProp, { _tag: 'Event' }> | undefined =>
-  node.props.find((prop): prop is Extract<WireProp, { _tag: 'Event' }> => prop._tag === 'Event' && prop.name === name)
+  node.props.find(
+    (prop): prop is Extract<WireProp, { _tag: 'Event' }> =>
+      prop._tag === 'Event' && prop.name === name,
+  )
 
-const byId = (tree: WireTree, id: string): WireNode | undefined => tree.find((node) => node.id === id)
+const byId = (tree: WireTree, id: string): WireNode | undefined =>
+  tree.find((node) => node.id === id)
 
 const upsertIds = (patches: ReadonlyArray<WirePatch>): ReadonlyArray<string> =>
   patches.flatMap((patch) => (patch._tag === 'Upsert' ? [patch.node.id] : []))
@@ -62,7 +73,6 @@ test('invoking a trigger handle dispatches into the runtime and the next render
   }
 })
 
-
 test('a mount(...)-returning body registers its event from structure.events and invoking it dispatches', async () => {
   const server = makeRemoteServer(structureCounterScene())
   try {
@@ -110,7 +120,10 @@ test('renderDiff streams patches a client folds back to the current tree', async
 
 test('end to end: client reconstructs props + event callbacks that drive the server', async () => {
   const server = makeRemoteServer(counterScene())
-  const captured: { props?: Record<string, unknown>; events?: Record<string, (p: { by: number }) => void> } = {}
+  const captured: {
+    props?: Record<string, unknown>
+    events?: Record<string, (p: { by: number }) => void>
+  } = {}
   const sent: Array<[string, unknown]> = []
   try {
     const tree = await server.render()
@@ -149,7 +162,6 @@ test('boot events are applied before the first render', async () => {
   }
 })
 
-
 test('a slotted child renders nested with its own encoded props and handle', async () => {
   const server = makeRemoteServer(slottedScene())
   try {
@@ -197,16 +209,19 @@ test('two events on one node register distinct handles and each fires independen
     expect(eventOf(before, 'clear')?.handle).toBe('0.Main.0:clear')
 
     await server.invoke('0.Main.0:greet', { text: 'hello' })
-    expect(dataOf(byId(await server.render(), '0.Main.0')!, 'greeting')).toMatchObject({ value: 'hello' })
+    expect(dataOf(byId(await server.render(), '0.Main.0')!, 'greeting')).toMatchObject({
+      value: 'hello',
+    })
 
     await server.invoke('0.Main.0:clear', {})
-    expect(dataOf(byId(await server.render(), '0.Main.0')!, 'greeting')).toMatchObject({ value: '' })
+    expect(dataOf(byId(await server.render(), '0.Main.0')!, 'greeting')).toMatchObject({
+      value: '',
+    })
   } finally {
     await server.dispose()
   }
 })
 
-
 test('a list renders one child per item under a single slot, in order', async () => {
   const server = makeRemoteServer(listScene())
   try {
@@ -255,7 +270,6 @@ test("a removed node's handle is revoked — a stale client invocation rejects",
   }
 })
 
-
 test('an Option prop round-trips through JSON as a real Option (symmetric schema decode)', async () => {
   const server = makeRemoteServer(optionScene(Option.some('hi')))
   const captured: { label?: unknown } = {}

package/src/server.ts

@@ -1,241 +1,180 @@
 import {
-  Array as Arr,
   Effect,
-  Match,
+  Layer,
+  ManagedRuntime,
   Option,
   type ParseResult,
-  Record as Rec,
-  Schema,
+  PubSub,
+  Queue,
 } from 'effect'
+import { type CapturedScene, forceSync, publish, type UiContract } from '@playfast/reform'
 import {
-  Composition,
-  type CompositionClass,
-  type CompositionService,
-  isFeatureBinding,
-  isStructure,
-  type RenderEnv,
-  type Scene,
-  type SlotChild,
-  type SlotClass,
-  type SlotFill,
-  type Structure,
-  type Trigger,
+  type AnyScene,
+  Bus,
+  Triggers,
   type TriggerRegistryApi,
-  type UiContract,
-  type UiManifest,
-  type WireNode,
-  type WireProp,
+  Wire,
+  type WirePatch,
   type WireTree,
-} from '@playfast/reform'
-
-// At erased UiContract boundary, event map is Record<never, never> → assignable to Trigger<unknown> without cast.
-const eventsOf = (structure: Structure<UiContract>): Record<string, Trigger<unknown>> =>
-  Option.match(Option.fromNullable(structure.events), {
-    onNone: () => ({}),
-    onSome: (events) => events,
-  })
-
-interface Mounted {
-  readonly comp: CompositionClass<unknown>
-  readonly props: unknown
-  readonly id: string
-  readonly parentId: Option.Option<string>
-  readonly slot: Option.Option<string>
-  readonly childIndex: number
-  readonly key: Option.Option<string>
-}
+} from '@playfast/reform/internal'
+import {
+  capturedSlotProvider,
+  renderCapturedComposition,
+  type RenderSceneToWireOptions,
+  renderSceneWith,
+  serviceFromContext,
+} from './wireRender'
+import { handlesOf, settleDrain } from './wireNode'
 
-const childComposition = (child: SlotChild): CompositionClass<unknown> =>
-  isFeatureBinding(child) ? child.composition : child
+export type { RenderSceneToWireOptions } from './wireRender'
 
-// One-shot render (screenshot): wire still has Event handles; registrar is no-op.
-const noRegister: TriggerRegistryApi['register'] = () => Effect.void
+// oxlint-disable-next-line reform-rules/prefer-effect-fn -- exported binding: Effect.fn's inferred type isn't portable under isolatedDeclarations
+export const renderSceneToWire = <
+  C extends UiContract,
+  S extends ReadonlyArray<unknown>,
+  Services,
+  P,
+  N extends string,
+  Identity,
+>(
+  scene: CapturedScene<C, S, Services, P, N, Identity>,
+  options?: RenderSceneToWireOptions,
+): Effect.Effect<WireTree, ParseResult.ParseError, Services> =>
+  Effect.context<Services>().pipe(
+    Effect.flatMap((context) =>
+      renderSceneWith(
+        scene,
+        options,
+        (slotDefinition) => capturedSlotProvider(context, slotDefinition),
+        (composition, props) => renderCapturedComposition(context, composition, props),
+      ),
+    ),
+  )
 
-const toWireNodeFromStructure = Effect.fn('toWireNodeFromStructure')(function* (
-  mounted: Mounted,
-  structure: Structure<UiContract>,
-  register: TriggerRegistryApi['register'],
-): Effect.fn.Return<WireNode, ParseResult.ParseError> {
-  const manifest: UiManifest = mounted.comp.manifest.ui.manifest
-  const name = manifest.name
+export interface RemoteServer {
+  readonly render: () => Promise<WireTree>
+  readonly renderDiff: () => Promise<ReadonlyArray<WirePatch>>
+  readonly invoke: (handle: string, encodedPayload: unknown) => Promise<void>
+  readonly subscribe: (listener: () => void) => () => void
+  readonly currentTree: () => WireTree
+  readonly dispose: () => Promise<void>
+}
 
-  const encodedProps = yield* Option.match(Option.fromNullable(manifest.props), {
-    onNone: () => Effect.succeed({}),
-    onSome: (schema) => Schema.encodeUnknown(schema)(structure.props),
-  })
-  const dataProps: ReadonlyArray<WireProp> = Rec.toEntries(encodedProps).map(
-    ([propName, propValue]): WireProp => ({ _tag: 'Data', name: propName, value: propValue }),
+const makeCapturedRemoteServer = <
+  C extends UiContract,
+  S extends ReadonlyArray<unknown>,
+  Services,
+  P,
+  N extends string,
+  Identity,
+>(
+  scene: CapturedScene<C, S, Services, P, N, Identity>,
+): RemoteServer => {
+  const layer = scene.provide.reduce((acc, provided) => Layer.merge(acc, provided))
+  const runtime = ManagedRuntime.make(layer)
+  const registry: TriggerRegistryApi = forceSync(() => runtime.runSync(Triggers.make))
+  const context = forceSync(() => runtime.runSync(Effect.context<Services>()))
+  const busFromContext = serviceFromContext(
+    context,
+    Bus,
+    'reform-remote: scene does not provide Bus',
   )
 
-  const eventSchemas = Option.fromNullable(manifest.events)
-  const events = eventsOf(structure)
-  const eventProps: ReadonlyArray<WireProp> = yield* Effect.forEach(Rec.toEntries(events), ([eventName, trigger]) =>
-    Effect.gen(function* () {
-      const schema = Option.flatMap(eventSchemas, (schemas) => Rec.get(schemas, eventName))
-      if (Option.isNone(schema)) {
-        return Option.none<WireProp>()
-      }
-      const handle = `${mounted.id}:${eventName}`
-      yield* register(handle, trigger, schema.value)
-      return Option.some<WireProp>({ _tag: 'Event', name: eventName, handle })
-    }),
-  ).pipe(Effect.map(Arr.getSomes))
+  const renderEffect = settleDrain.pipe(
+    Effect.zipRight(
+      renderSceneWith(
+        scene,
+        { register: registry.register },
+        (slotDefinition) => capturedSlotProvider(context, slotDefinition),
+        (composition, props) => renderCapturedComposition(context, composition, props),
+      ),
+    ),
+  )
 
-  return {
-    id: mounted.id,
-    name,
-    parentId: Option.getOrNull(mounted.parentId),
-    childIndex: mounted.childIndex,
-    slot: Option.getOrNull(mounted.slot),
-    key: Option.getOrNull(mounted.key),
-    props: [...dataProps, ...eventProps],
+  const changeListeners = new Set<() => void>()
+  const notifyChange = (): void => {
+    changeListeners.forEach((listener) => listener())
   }
-})
-
-// Structure erases per-slot fill types; recover SlotFill structurally without `as`.
-const isSlotFill = (candidate: unknown): candidate is SlotFill<unknown> =>
-  typeof candidate === 'object' &&
-  candidate !== null &&
-  '_tag' in candidate &&
-  (candidate._tag === 'Each' || candidate._tag === 'One' || candidate._tag === 'Absent')
+  runtime.runFork(
+    Effect.scoped(
+      Effect.gen(function* () {
+        const bus = yield* busFromContext
+        const subscription = yield* PubSub.subscribe(bus)
+        // The transport debounces; settling here would perturb the drain's scheduling.
+        yield* Queue.take(subscription).pipe(
+          Effect.zipRight(Effect.sync(notifyChange)),
+          Effect.forever,
+        )
+      }),
+    ),
+  )
 
-const structureFills = (structure: Structure<UiContract>): Record<string, SlotFill<unknown>> =>
-  Rec.fromEntries(
-    Rec.toEntries(structure.slots).flatMap(([slotName, fillValue]) =>
-      isSlotFill(fillValue) ? [[slotName, fillValue] as const] : [],
+  runtime.runSync(
+    Effect.forEach(
+      Option.getOrElse(Option.fromNullable(scene.boot), () => []),
+      (event) =>
+        busFromContext.pipe(
+          Effect.flatMap((bus) => publish('High', event).pipe(Effect.provideService(Bus, bus))),
+        ),
     ),
   )
 
-const slotsOf = (comp: CompositionClass<unknown>): Record<string, SlotClass> =>
-  Option.getOrElse(Option.fromNullable(comp.manifest.slots), () => ({}))
+  const frame: { tree: WireTree } = { tree: [] }
 
-const enqueueStructureSlot = (
-  parent: Mounted,
-  slotName: string,
-  child: CompositionClass<unknown>,
-  fill: SlotFill<unknown>,
-): ReadonlyArray<Mounted> =>
-  Match.value(fill).pipe(
-    Match.tag('Each', (each) =>
-      each.items.map(
-        (entry, index): Mounted => ({
-          comp: child,
-          props: entry.props,
-          id: `${parent.id}.${slotName}.${index}`,
-          parentId: Option.some(parent.id),
-          slot: Option.some(slotName),
-          childIndex: index,
-          key: Option.fromNullable(entry.key),
-        }),
+  const render = (): Promise<WireTree> =>
+    runtime.runPromise(
+      renderEffect.pipe(
+        Effect.tap((tree) =>
+          Effect.sync(() => {
+            frame.tree = tree
+          }),
+        ),
       ),
-    ),
-    Match.tag('One', (single) => [
-      {
-        comp: child,
-        props: single.props,
-        id: `${parent.id}.${slotName}.0`,
-        parentId: Option.some(parent.id),
-        slot: Option.some(slotName),
-        childIndex: 0,
-        key: Option.none(),
-      } satisfies Mounted,
-    ]),
-    Match.tag('Absent', () => []),
-    Match.exhaustive,
-  )
+    )
 
-const collect = Effect.fn('collect')(function* (
-  root: CompositionClass<unknown>,
-): Effect.fn.Return<Map<SlotClass, CompositionClass<unknown>>, never, SlotChild> {
-  const bindings = new Map<SlotClass, CompositionClass<unknown>>()
-  // Explicit type so recursive walk references itself cast-free.
-  const walk: (comp: CompositionClass<unknown>) => Effect.Effect<void, never, SlotChild> = Effect.fn(
-    'walk',
-  )(function* (comp: CompositionClass<unknown>): Effect.fn.Return<void, never, SlotChild> {
-    yield* Effect.forEach(Rec.values(slotsOf(comp)), (slotClass) =>
+  const renderDiff = (): Promise<ReadonlyArray<WirePatch>> =>
+    runtime.runPromise(
       Effect.gen(function* () {
-        if (bindings.has(slotClass)) {
-          return
-        }
-        const child = childComposition(yield* slotClass.tag)
-        bindings.set(slotClass, child)
-        yield* walk(child)
+        const next = yield* renderEffect
+        const previous = frame.tree
+        const patches = Wire.diff(previous, next)
+        frame.tree = next
+        const nextIds = new Set(next.map((node) => node.id))
+        const staleHandles = previous.filter((node) => !nextIds.has(node.id)).flatMap(handlesOf)
+        yield* Effect.forEach(staleHandles, (handle) => registry.revoke(handle))
+        return patches
       }),
     )
-  })
-  yield* walk(root)
-  return bindings
-})
 
-// Explicit type so recursive renderLevel references itself cast-free.
-const renderLevel: (
-  frontier: ReadonlyArray<Mounted>,
-  bindings: ReadonlyMap<SlotClass, CompositionClass<unknown>>,
-  register: TriggerRegistryApi['register'],
-) => Effect.Effect<ReadonlyArray<WireNode>, ParseResult.ParseError, CompositionService> = Effect.fn(
-  'renderLevel',
-)(function* (
-  frontier: ReadonlyArray<Mounted>,
-  bindings: ReadonlyMap<SlotClass, CompositionClass<unknown>>,
-  register: TriggerRegistryApi['register'],
-): Effect.fn.Return<ReadonlyArray<WireNode>, ParseResult.ParseError, CompositionService> {
-  if (frontier.length === 0) {
-    return []
+  return {
+    render,
+    renderDiff,
+    invoke: (handle, encodedPayload) =>
+      runtime.runPromise(
+        Effect.gen(function* () {
+          yield* registry.invoke(handle, encodedPayload)
+          yield* settleDrain
+        }),
+      ),
+    subscribe: (listener) => {
+      changeListeners.add(listener)
+      return () => void changeListeners.delete(listener)
+    },
+    currentTree: () => frame.tree,
+    dispose: () => runtime.dispose(),
   }
-  const rendered = yield* Effect.forEach(frontier, (mounted) =>
-    Effect.gen(function* () {
-      const service = yield* mounted.comp.tag
-      const env: RenderEnv = { props: mounted.props, tracker: { add: () => {} } }
-      const frame = yield* Composition.render(service, env)
-      if (!isStructure(frame)) {
-        return yield* Effect.dieMessage(
-          `reform-remote server: composition ${mounted.comp.manifest.name} did not return a Structure`,
-        )
-      }
-      const node = yield* toWireNodeFromStructure(mounted, frame, register)
-      const fills = structureFills(frame)
-      const children = Rec.toEntries(slotsOf(mounted.comp)).flatMap(([slotName, slotClass]) => {
-        const child = bindings.get(slotClass)
-        if (child === undefined) {
-          return []
-        }
-        const fill = fills[slotName]
-        if (fill === undefined) {
-          return []
-        }
-        return enqueueStructureSlot(mounted, slotName, child, fill)
-      })
-      return { node, children }
-    }),
-  )
-  const nodes = rendered.map((entry) => entry.node)
-  const next = rendered.flatMap((entry) => entry.children)
-  const rest = yield* renderLevel(next, bindings, register)
-  return [...nodes, ...rest]
-})
-
-export interface RenderSceneToWireOptions {
-  readonly register: TriggerRegistryApi['register']
 }
 
-// oxlint-disable-next-line reform-rules/prefer-effect-fn -- exported binding: Effect.fn's inferred type isn't portable under isolatedDeclarations
-export const renderSceneToWire = (
-  scene: Scene,
-  options?: RenderSceneToWireOptions,
-): Effect.Effect<WireTree, ParseResult.ParseError, CompositionService | SlotChild> =>
-  Effect.gen(function* () {
-    const register = options?.register ?? noRegister
-    const bindings = yield* collect(scene.composition)
-    const root: Mounted = {
-      comp: scene.composition,
-      props: {},
-      id: '0',
-      parentId: Option.none(),
-      slot: Option.none(),
-      childIndex: 0,
-      key: Option.none(),
-    }
-    return yield* renderLevel([root], bindings, register)
-  })
-
-export { makeRemoteServer, type RemoteServer } from './remote-server'
+export const makeRemoteServer = (scene: AnyScene): RemoteServer =>
+  scene.captureAny<RemoteServer>(
+    <
+      C extends UiContract,
+      S extends ReadonlyArray<unknown>,
+      Services,
+      P,
+      N extends string,
+      Identity,
+    >(
+      exactScene: CapturedScene<C, S, Services, P, N, Identity>,
+    ) => makeCapturedRemoteServer(exactScene),
+  )

package/src/slottedFixtures.ts

@@ -0,0 +1,120 @@
+import { createElement } from 'react'
+import { Effect, Layer, Schema as S } from 'effect'
+import {
+  Composition,
+  Engine,
+  Event,
+  Reducer,
+  State,
+  Ui,
+  mount,
+  one,
+  provide,
+  scene,
+  slot,
+  type CapturedScene,
+  type DerivedContract,
+  type SlotService,
+  ui,
+} from '@playfast/reform'
+import { type CompositionChildSummary, type EngineServices, type WiredUi } from '@playfast/reform/internal'
+
+const GreetingBase: State.StateDefinition<'greeting', string, typeof S.String> = State.make(
+  'greeting',
+  S.String,
+)
+class Greeting extends GreetingBase {}
+class Greeted extends Event.make('Greeted', S.Struct({ text: S.String })) {}
+class Cleared extends Event.make('Cleared', S.Struct({})) {}
+class SetGreeting extends Reducer.make('SetGreeting', {
+  states: [Greeting],
+  events: [Greeted],
+}) {}
+class ClearGreeting extends Reducer.make('ClearGreeting', {
+  states: [Greeting],
+  events: [Cleared],
+}) {}
+const PanelUiBase: WiredUi<
+  DerivedContract<{
+    props: S.Struct<{ greeting: typeof S.String }>
+    events: {
+      greet: S.Struct<{ text: typeof S.String }>
+      clear: S.Struct<{}>
+    }
+  }>,
+  'Panel'
+> = ui('Panel', {
+  props: S.Struct({ greeting: S.String }),
+  events: { greet: S.Struct({ text: S.String }), clear: S.Struct({}) },
+})
+class PanelUi extends PanelUiBase {}
+
+class Panel extends Composition.make('Panel', {
+  title: 'Panel',
+  ui: PanelUi,
+  states: [Greeting],
+})<Panel>() {}
+
+class MainSlot extends slot('Main')<MainSlot, typeof Panel>() {}
+const ShellUiBase: Ui.UiClass<{ props: {}; slots: { Main: MainSlot } }, 'Shell'> = ui('Shell')<{
+  props: {}
+  slots: { Main: MainSlot }
+}>()
+class ShellUi extends ShellUiBase {}
+
+class Shell extends Composition.make('Shell', {
+  title: 'Shell',
+  slots: { Main: MainSlot },
+  ui: ShellUi,
+})<Shell>() {}
+
+type SlottedScene = CapturedScene<
+  typeof ShellUi.Contract,
+  readonly [],
+  | EngineServices
+  | State.StateStore<'greeting', string>
+  | Ui.UiService<'Panel'>
+  | Ui.UiService<'Shell'>
+  | Composition.CompositionId<'Shell', Shell, MainSlot>
+  | Composition.CompositionId<'Panel', Panel, never>
+  | SlotService<'Main', MainSlot, CompositionChildSummary<Panel>>,
+  unknown,
+  'Shell',
+  Shell
+>
+
+const makeSlottedScene = (): SlottedScene => {
+  const presentation = Layer.mergeAll(
+    provide(
+      ShellUi,
+      Ui.make(ShellUi, (_props, slots) => createElement(slots.Main, {})),
+    ),
+    provide(
+      PanelUi,
+      Ui.make(PanelUi, ({ greeting }) => greeting),
+    ),
+    provide(MainSlot, Panel),
+    State.live(Greeting, 'hi'),
+  )
+  const app = Layer.mergeAll(
+    Composition.live(Shell, function* () {
+      yield* Effect.void
+      return mount({ props: {}, slots: { Main: one({}) } })
+    }),
+    Composition.live(Panel, function* () {
+      const greeting = yield* Greeting
+      const greet = yield* Event.trigger(Greeted)
+      const clearTrigger = yield* Event.trigger(Cleared)
+      const clear = (): void => clearTrigger({})
+      return mount({
+        props: { greeting },
+        slots: {},
+        events: { greet, clear },
+      })
+    }),
+    Reducer.live(SetGreeting, (_greeting, event) => event.text),
+    Reducer.live(ClearGreeting, () => ''),
+  ).pipe(Layer.provideMerge(presentation), Layer.provideMerge(Engine))
+  return scene(Shell, { provide: [app] })
+}
+export const slottedScene: typeof makeSlottedScene = makeSlottedScene

package/src/transport.test.ts

@@ -9,7 +9,8 @@ import { inMemoryTransportPair } from './memory'
 import { remoteViews } from './client'
 import { asyncCounterScene, CounterUi, counterScene } from './fixtures'
 
-const draw = (node: ReactNode): void => void renderToStaticMarkup(createElement(Fragment, null, node))
+const draw = (node: ReactNode): void =>
+  void renderToStaticMarkup(createElement(Fragment, null, node))
 
 interface Probe {
   props?: Record<string, unknown>