@weft-js/start 0.1.0 → 0.1.2

package/src/extension.ts

@@ -25,7 +25,10 @@ export interface ServerExtension {
   /** Merged into `ctx`, after the app's own. */
   context?(ctx: Context): object
   /** Before a function's `run`. Throw to refuse: an error with `answer: { code, message, status }` reaches the client as it is. */
-  guard?(fn: { id: string; kind: string; def: Record<string, unknown> }, ctx: Context): void | Promise<void>
+  guard?(
+    fn: { id: string; kind: string; def: Record<string, unknown> },
+    ctx: Context,
+  ): void | Promise<void>
   /** The `FnOptions` keys it enforces. One no extension claims refuses the call: a guard that isn't there mustn't pass. */
   options?: readonly string[]
   /** The `ctx` keys that differ per user, which a shared cache may not read (Q006). */
@@ -35,4 +38,7 @@ export interface ServerExtension {
 }
 
 /** One extension in the generated list, loaded when first asked for. */
-export interface ExtensionEntry { key: string; load(): Promise<ServerExtension> }
+export interface ExtensionEntry {
+  key: string
+  load(): Promise<ServerExtension>
+}

package/src/first-paint.ts

@@ -4,11 +4,18 @@
 import { markup } from '@weft-js/core/markup'
 
 export interface Pieces {
-  names: string[]; layers: string; wraps: string[]; pieces: [number, number, string, string][]
-  always: number[]; alts: ([string[], string[][]][] | null)[]; deps: number[][]; index: Record<string, number[]>
+  names: string[]
+  layers: string
+  wraps: string[]
+  pieces: [number, number, string, string][]
+  always: number[]
+  alts: ([string[], string[][]][] | null)[]
+  deps: number[][]
+  index: Record<string, number[]>
 }
 
-const GATE = '[data-weft=styled]{visibility:hidden;animation:weft-gate 0s 3s forwards}@keyframes weft-gate{to{visibility:visible}}'
+const GATE =
+  '[data-weft=styled]{visibility:hidden;animation:weft-gate 0s 3s forwards}@keyframes weft-gate{to{visibility:visible}}'
 const depth = (open: string) => open.split('{').length - 1
 
 /**
@@ -19,7 +26,8 @@ export function firstPaint(table: Pieces, sheets: string[], head = '') {
   const rank = new Map(sheets.map((name, i) => [table.names.indexOf(name), i]))
   const sent = new Set<number>()
   const headHas = markup('')
-  for (const [, name, value] of head.matchAll(/dataset\.(\w+)\s*=\s*['"]([^'"]+)['"]/g)) headHas.add(`[data-${name}=${value}]`)
+  for (const [, name, value] of head.matchAll(/dataset\.(\w+)\s*=\s*['"]([^'"]+)['"]/g))
+    headHas.add(`[data-${name}=${value}]`)
   let gated = false
   return (html: string) => {
     const has = markup(html)
@@ -32,13 +40,22 @@ export function firstPaint(table: Pieces, sheets: string[], head = '') {
       table.deps[id]!.forEach(take)
     }
     table.always.forEach(take)
-    for (const key of has) table.index[key]?.forEach(id => {
-      const need = table.alts[id]
-      if (!need || need.some(([all, any]) => all.every(k => has.has(k)) && any.every(l => l.some(k => has.has(k))))) take(id)
-    })
+    for (const key of has)
+      table.index[key]?.forEach((id) => {
+        const need = table.alts[id]
+        if (
+          !need ||
+          need.some(
+            ([all, any]) =>
+              all.every((k) => has.has(k)) && any.every((l) => l.some((k) => has.has(k))),
+          )
+        )
+          take(id)
+      })
     let css = !gated && has.has('[data-weft=styled]') ? ((gated = true), GATE) : ''
     fresh.sort((a, b) => rank.get(table.pieces[a]![0])! - rank.get(table.pieces[b]![0])! || a - b)
-    let open = 0, rule = ''
+    let open = 0,
+      rule = ''
     for (const id of fresh) {
       const [, wrap, selector, body] = table.pieces[id]!
       if (wrap !== open) {

package/src/form/value.ts

@@ -0,0 +1,15 @@
+/** The raw values restored after a failed form submission. */
+export type FormValue = string | string[] | undefined
+
+/** A field's restoration mode. Omit it to retain the raw value. */
+export type FieldKind = 'text' | 'email' | 'multiple' | 'raw'
+
+/** Project a restored value to the declared field kind. */
+export function fieldValue(value: FormValue, kind: 'text' | 'email'): string | undefined
+export function fieldValue(value: FormValue, kind: 'multiple'): string[] | undefined
+export function fieldValue(value: FormValue, kind?: FieldKind): FormValue
+export function fieldValue(value: FormValue, kind?: FieldKind): FormValue {
+  if (kind === 'text' || kind === 'email') return Array.isArray(value) ? value[0] : value
+  if (kind === 'multiple') return value === undefined ? undefined : [value].flat()
+  return value
+}

package/src/form.tsx

@@ -5,15 +5,37 @@
 //
 // Reachable only from routes that import it, so an app without forms doesn't pay.
 
-import { derived, flush, state, untrack, type Derived } from '@weft-js/core'
-import { currentScope, decodeForm, fieldsOf, fnOf, StartError, SUBMIT, type FnError, type Mutation } from './data'
+import { derived, flush, state, untrack, type Derived, type State } from '@weft-js/core'
+import {
+  currentScope,
+  decodeForm,
+  fieldsOf,
+  fnOf,
+  StartError,
+  SUBMIT,
+  type FnError,
+  type Mutation,
+} from './data'
 import type { FormFailure } from './exec'
+import { fieldValue, type FieldKind, type FormValue } from './form/value'
 
-/** What a failed form's page gives back for a field: what was typed. */
-export type FormValue = string | string[] | undefined
+export type { FormValue } from './form/value'
 
 /** A mutation input's field names: `title`, and `a.b` one level down. */
-type Field<I> = I extends object ? { [K in keyof I & string]: NonNullable<I[K]> extends object ? K | `${K}.${keyof NonNullable<I[K]> & string}` : K }[keyof I & string] : string
+type Field<I> = I extends object
+  ? {
+      [K in keyof I & string]: NonNullable<I[K]> extends object
+        ? K | `${K}.${keyof NonNullable<I[K]> & string}`
+        : K
+    }[keyof I & string]
+  : string
+
+type FieldProps<V> = {
+  name: string
+  value?: V
+  'aria-invalid'?: true
+  'aria-describedby'?: string
+}
 
 /** The state and fields `<Form>` gives its children. */
 export interface FormApi<I = unknown, O = unknown> {
@@ -30,7 +52,9 @@ export interface FormApi<I = unknown, O = unknown> {
   /** What was typed, when a no-JS submit came back with errors. */
   value(name: Field<I>): FormValue
   /** Spread on the input: `name`, the value to restore, and the invalid state. */
-  field(name: Field<I>): { name: string; value?: FormValue; 'aria-invalid'?: true; 'aria-describedby'?: string }
+  field(name: Field<I>, kind: 'text' | 'email'): FieldProps<string>
+  field(name: Field<I>, kind: 'multiple'): FieldProps<string[]>
+  field(name: Field<I>, kind?: FieldKind): FieldProps<FormValue>
   /** The field's error text, in a live region that's in the page before it has anything to say. */
   Error(props: { name: Field<I>; class?: string }): unknown
 }
@@ -44,7 +68,7 @@ export interface FormProps<I, O> {
   reset?: boolean
   onSuccess?: (result: O) => void
   onError?: (error: unknown) => void
-  children?: unknown
+  children?: ((form: FormApi<I, O>) => unknown) | string | number | boolean | object | null
   [attr: string]: unknown
 }
 
@@ -67,50 +91,38 @@ function failure(id: string, key?: string): FormFailure | undefined {
   return f
 }
 
-const at = (values: Record<string, unknown> | undefined, name: string) => name.split('.').reduce<unknown>((v, k) => (v as Record<string, unknown> | undefined)?.[k], values) as FormValue
-
-/** A form that posts to a mutation, and works before any code has loaded. */
-export function Form<I, O>({ of, id, reset, onSuccess, onError, children, ...rest }: FormProps<I, O>) {
-  const m = untrack(() => of) as Mutation<I, O> & { [SUBMIT]: (input: unknown, form: true | FormData) => Promise<O> }
-  const key = untrack(() => id)
-  const fnId = fnOf(m)?.$id
-  if (fnOf(m)?.kind !== 'mutation') throw new StartError('F001', '`<Form of>` needs a mutation', '`<Form of={addTodo}>`, with `addTodo` a `mutation()` export of a server module')
-  const seed = failure(fnId, key)
-  const errors = state<Record<string, string>>(seed?.errors ?? {})
-  const message = state(seed?.message)
-  const result = state<O | undefined>(undefined)
-  const calls = state(0)
-  const errorId = (name: string) => `${key ?? fnId}-${name}-error`
-
-  const form: FormApi<I, O> = {
-    pending: derived(() => calls.value > 0),
-    errors,
-    message,
-    result,
-    error: name => errors.get(name),
-    value: name => at(seed?.values, name),
-    field(name) {
-      const value = at(seed?.values, name)
-      const invalid = !!errors.get(name)
-      return { name, ...(value !== undefined && { value }), ...(invalid && { 'aria-invalid': true as const, 'aria-describedby': errorId(name) }) }
-    },
-    Error: props => <p id={errorId(props.name)} class={props.class} role="alert">{errors.get(props.name)}</p>,
-  }
+const at = (values: Record<string, unknown> | undefined, name: string) =>
+  name
+    .split('.')
+    .reduce<unknown>((v, k) => (v as Record<string, unknown> | undefined)?.[k], values) as FormValue
 
-  async function submit(e: SubmitEvent) {
+function createSubmit<O>(
+  m: { [SUBMIT]: (input: unknown, form: true | FormData) => Promise<O> },
+  o: {
+    calls: State<number>
+    errors: State<Record<string, string>>
+    message: State<string | undefined>
+    result: State<O | undefined>
+    reset: () => boolean | undefined
+    onSuccess: () => ((result: O) => void) | undefined
+    onError: () => ((error: unknown) => void) | undefined
+  },
+) {
+  const { calls, errors, message, result, reset, onSuccess, onError } = o
+  return async function submit(e: SubmitEvent) {
     e.preventDefault()
     if (calls.value) return
     const el = e.target as HTMLFormElement
     const data = new FormData(el, e.submitter)
-    const files = [...data.values()].some(v => typeof v !== 'string' && v.size)
+    const files = [...data.values()].some((v) => typeof v !== 'string' && v.size)
     calls.value++
     try {
       const v = await m[SUBMIT](decodeForm(data), files ? data : true)
       errors.value = {}
       message.value = undefined
       result.value = v
-      if (untrack(() => reset) !== false) el.reset()
-      untrack(() => onSuccess)?.(v)
+      if (untrack(reset) !== false) el.reset()
+      untrack(onSuccess)?.(v)
     } catch (err) {
       const issues = (err as FnError).issues
       const f = fieldsOf(issues)
@@ -118,17 +130,94 @@ export function Form<I, O>({ of, id, reset, onSuccess, onError, children, ...res
       message.value = issues ? f.message : (err as Error).message
       flush()
       el.querySelector<HTMLElement>('[aria-invalid="true"]')?.focus()
-      untrack(() => onError)?.(err)
+      untrack(onError)?.(err)
     } finally {
       calls.value--
     }
   }
+}
+
+function invalidMutation() {
+  return new StartError(
+    'F001',
+    '`<Form of>` needs a mutation',
+    '`<Form of={addTodo}>`, with `addTodo` a `mutation()` export of a server module',
+  )
+}
+
+/** A form that posts to a mutation, and works before any code has loaded. */
+export function Form<I, O>({
+  of,
+  id,
+  reset,
+  onSuccess,
+  onError,
+  children,
+  ...rest
+}: FormProps<I, O>) {
+  const m = untrack(() => of) as Mutation<I, O> & {
+    [SUBMIT]: (input: unknown, form: true | FormData) => Promise<O>
+  }
+  const key = untrack(() => id)
+  const fnId = fnOf(m)?.$id
+  if (fnOf(m)?.kind !== 'mutation') throw invalidMutation()
+  const seed = failure(fnId, key)
+  const errors = state<Record<string, string>>(seed?.errors ?? {})
+  const message = state(seed?.message)
+  const result = state<O | undefined>(undefined)
+  const calls = state(0)
+  const errorId = (name: string) => `${key ?? fnId}-${name}-error`
+
+  function field(name: Field<I>, kind: 'text' | 'email'): FieldProps<string>
+  function field(name: Field<I>, kind: 'multiple'): FieldProps<string[]>
+  function field(name: Field<I>, kind?: FieldKind): FieldProps<FormValue>
+  function field(name: Field<I>, kind?: FieldKind): FieldProps<FormValue> {
+    const value = fieldValue(at(seed?.values, name), kind)
+    const invalid = !!errors.get(name)
+    return {
+      name,
+      ...(value !== undefined && { value }),
+      ...(invalid && { 'aria-invalid': true as const, 'aria-describedby': errorId(name) }),
+    }
+  }
+
+  const form: FormApi<I, O> = {
+    pending: derived(() => calls.value > 0),
+    errors,
+    message,
+    result,
+    error: (name) => errors.get(name),
+    value: (name) => at(seed?.values, name),
+    field,
+    Error: (props) => (
+      <p id={errorId(props.name)} class={props.class} role="alert">
+        {errors.get(props.name)}
+      </p>
+    ),
+  }
+
+  const submit = createSubmit(m, {
+    calls,
+    errors,
+    message,
+    result,
+    reset: () => reset,
+    onSuccess: () => onSuccess,
+    onError: () => onError,
+  })
 
   return (
-    <form method="post" {...rest} aria-busy={form.pending.value || undefined} onSubmit={e => void submit(e)}>
+    <form
+      method="post"
+      {...rest}
+      aria-busy={form.pending.value || undefined}
+      onSubmit={(e) => void submit(e)}
+    >
       <input type="hidden" name="$fn" value={fnId} />
       {key !== undefined && <input type="hidden" name="$form" value={key} />}
-      {typeof children === 'function' ? (children as (api: FormApi<I, O>) => unknown)(form) : children}
+      {typeof children === 'function'
+        ? (children as (api: FormApi<I, O>) => unknown)(form)
+        : children}
     </form>
   )
 }

package/src/hub/channels.ts

@@ -0,0 +1,102 @@
+import type { Bus } from '../bus'
+import type { Channel, Ev, Limits } from '../hub'
+
+const VOLATILE = '{"v":1'
+const unref = <T>(t: T) => ((t as { unref?(): void } | null | undefined)?.unref?.(), t)
+
+interface Rings {
+  bus: Bus
+  limits: Limits
+  epoch: string
+  channels: Map<string, Channel>
+  seq: number
+}
+
+function trim(state: Rings, ch: Channel) {
+  const old = Date.now() - state.limits.window
+  let drop = 0
+  while (
+    drop < ch.ring.length &&
+    (ch.ring[drop]!.at < old || ch.ring.length - drop > state.limits.ring)
+  )
+    drop++
+  if (!drop) return
+  ch.floor = ch.ring[drop - 1]!.seq
+  ch.ring.splice(0, drop)
+}
+
+function channel(state: Rings, name: string): Channel {
+  const { channels, bus } = state
+  const ch = channels.get(name)
+  if (ch) {
+    clearTimeout(ch.idle)
+    ch.idle = undefined
+    return ch
+  }
+  const made: Channel = {
+    name,
+    ring: [],
+    floor: state.seq,
+    listeners: new Set(),
+    got: undefined as never,
+    ready: undefined as never,
+  }
+  channels.set(name, made)
+  made.got = (raw) => {
+    const ev = { seq: ++state.seq, at: Date.now(), raw }
+    // Cursors and presence beats are only worth having now: in the ring they'd push out what a resume needs.
+    if (!raw.startsWith(VOLATILE)) {
+      made.ring.push(ev)
+      trim(state, made)
+    }
+    for (const on of made.listeners) on(ev)
+  }
+  made.ready = bus
+    .subscribe(name, made.got, () => {
+      made.ring.length = 0
+      made.floor = state.seq
+      for (const on of made.listeners) on(null)
+    })
+    .then(
+      (stop) => {
+        made.stop = stop
+        made.floor = state.seq
+      },
+      (e) => {
+        channels.delete(name)
+        throw e
+      },
+    )
+  made.ready.catch(() => {})
+  return made
+}
+
+function unlisten(state: Rings, ch: Channel, on: (ev: Ev | null) => void) {
+  ch.listeners.delete(on)
+  if (ch.listeners.size || ch.idle) return
+  ch.idle = unref(
+    setTimeout(() => {
+      ch.stop?.()
+      state.channels.delete(ch.name)
+    }, state.limits.window),
+  )
+}
+
+function replay(state: Rings, ch: Channel, after: string): Ev[] | undefined {
+  const [e, n] = after.split(':')
+  const at = Number(n)
+  trim(state, ch)
+  if (e !== state.epoch || !(at >= ch.floor)) return undefined
+  return ch.ring.filter((ev) => ev.seq > at)
+}
+
+export function createChannels(bus: Bus, limits: Limits, epoch: string) {
+  const state: Rings = { bus, limits, epoch, channels: new Map(), seq: 0 }
+  return {
+    channels: state.channels,
+    seq: () => state.seq,
+    channel: (name: string) => channel(state, name),
+    unlisten: (ch: Channel, on: (ev: Ev | null) => void) => unlisten(state, ch, on),
+    replay: (ch: Channel, after: string) => replay(state, ch, after),
+  }
+}

package/src/hub/connections.ts

@@ -0,0 +1,147 @@
+import { StartError, type Context } from '../data'
+import { createScope, guard, type Scope, type ScopeOptions } from '../exec'
+import type { Source } from '../changes'
+import type { Body, Channel, Conn, HubOptions, Limits, Sink, Sub } from './types'
+
+const unref = <T>(t: T) => ((t as { unref?(): void } | null | undefined)?.unref?.(), t)
+interface Dependencies {
+  conns: Map<string, Conn>
+  limits: Limits
+  epoch: string
+  options: HubOptions
+  source: Source | undefined
+  pokes: () => Channel
+  want: () => Promise<unknown> | undefined
+  rest: () => void
+  cursorOf: (n: number) => string
+  seq: () => number
+  wire: () => { m: string; d?: number }
+  change: (c: Conn, request: Request, opts: ScopeOptions, body: Body) => Promise<void>
+  replayPokes: (c: Conn, after: string) => void
+  fail: (c: Conn, s: Sub, e: unknown) => void
+}
+
+function bye(deps: Dependencies, c: Conn, retry: number) {
+  c.sink.write('b', JSON.stringify({ retry }))
+  close(deps, c)
+}
+
+function close(deps: Dependencies, c: Conn) {
+  const { conns, rest } = deps
+  if (!conns.delete(c.k)) return
+  for (const t of c.timers) clearTimeout(t)
+  for (const s of c.subs.values()) s.ac.abort()
+  c.subs.clear()
+  c.sink.close()
+  rest()
+}
+
+async function recheck(deps: Dependencies, c: Conn) {
+  const { conns, fail } = deps
+  const authed = [...c.subs.values()].filter((s) => s.fn.def.auth)
+  if (!authed.length) return
+  const ctx = await createScope(authed[0]!.request, authed[0]!.options)
+    .ctx()
+    .catch(() => ({}) as Context)
+  if (!conns.has(c.k)) return
+  for (const s of authed) {
+    try {
+      guard(s.fn, ctx)
+    } catch (e) {
+      fail(c, s, e)
+    }
+  }
+}
+
+async function connect(
+  deps: Dependencies,
+  a: { request: Request; scope: Scope; body: Body; sink: Sink; line: boolean },
+) {
+  const { request, scope, body, sink, line } = a
+  const {
+    conns,
+    limits,
+    epoch,
+    options,
+    source,
+    pokes,
+    want,
+    cursorOf,
+    seq,
+    wire,
+    change,
+    replayPokes,
+  } = deps
+  const opts = scope.options
+  const ctx = await scope.ctx()
+  const user = (ctx as { user?: { id?: string } }).user?.id
+  if (
+    !line &&
+    user !== undefined &&
+    [...conns.values()].filter((c) => c.user === user).length >= limits.connections
+  ) {
+    throw new StartError(
+      'R009',
+      `user \`${user}\` already has ${limits.connections} realtime connections`,
+      'close tabs, or raise `limits.connections`',
+      { status: 429 },
+    )
+  }
+  const c: Conn = {
+    k: crypto.randomUUID(),
+    sink,
+    user,
+    subs: new Map(),
+    tags: new Map(),
+    held: new Set(),
+    bytes: 0,
+    timers: [],
+  }
+  conns.set(c.k, c)
+  await pokes().ready.catch((e) => {
+    conns.delete(c.k)
+    throw e
+  })
+  await want() // before `h`: a client that reads next must not miss a change
+  sink.write(
+    'h',
+    JSON.stringify({
+      k: c.k,
+      e: epoch,
+      b: options.build ?? '',
+      c: cursorOf(seq()),
+      ...(source && { l: wire() }),
+    }),
+  )
+  await change(c, request, opts, body)
+  if (body.c) replayPokes(c, body.c)
+  startTimers(deps, c, sink)
+  return c
+}
+
+function startTimers(deps: Dependencies, c: Conn, sink: Sink) {
+  const { limits, options } = deps
+  let ticks = 0
+  const every = Math.max(1, Math.round(limits.session / limits.heartbeat))
+  c.timers.push(
+    unref(
+      setInterval(() => {
+        sink.ping?.()
+        if (++ticks % every === 0) void recheck(deps, c)
+      }, limits.heartbeat),
+    ),
+  )
+  if (options.maxDuration)
+    c.timers.push(
+      unref(setTimeout(() => bye(deps, c, 0), Math.max(1, options.maxDuration - 10) * 1000)),
+    )
+}
+
+export function createConnections(deps: Dependencies) {
+  return {
+    bye: (c: Conn, retry: number) => bye(deps, c, retry),
+    close: (c: Conn) => close(deps, c),
+    connect: (request: Request, scope: Scope, body: Body, sink: Sink, line = false) =>
+      connect(deps, { request, scope, body, sink, line }),
+  }
+}

package/src/hub/delivery.ts

@@ -0,0 +1,62 @@
+import type { Conn, Limits } from '../hub'
+
+type Sub = Conn['subs'] extends Map<number, infer S> ? S : never
+
+const HIGH = 64 * 1024
+
+export function createDelivery(
+  limits: Limits,
+  cursorOf: (n: number) => string,
+  bye: (c: Conn, retry: number) => void,
+) {
+  function poke(c: Conn, tags: string[], at: number) {
+    if (!tags.length) return
+    if (!c.held.size && c.sink.backlog() < HIGH)
+      return c.sink.write('p', JSON.stringify({ t: tags, c: cursorOf(at) }))
+    const p = (c.pokes ??= { t: new Set(), c: '' })
+    for (const t of tags) p.t.add(t)
+    p.c = cursorOf(at)
+  }
+
+  /** Over `queue`: the client gets a bye, reconnects and resumes, rather than this process growing. */
+  function hold(c: Conn, s: Sub, raw: string): boolean {
+    const size = raw.length
+    if (!s.buffer) {
+      for (const x of s.q) c.bytes -= x.size
+      s.q.length = 0
+    } else if (s.q.length >= s.buffer) {
+      for (const x of s.q) c.bytes -= x.size
+      s.q.length = 0
+      return false
+    }
+    s.q.push({ raw, size })
+    c.bytes += size
+    c.held.add(s)
+    if (c.bytes > limits.queue) bye(c, 0)
+    return true
+  }
+
+  /** Written to the client, or held. False: the buffer overflowed, so this stream resets. */
+  function deliver(c: Conn, s: Sub, raw: string): boolean {
+    if (!c.held.size && c.sink.backlog() < HIGH) return (c.sink.write('m', raw), true)
+    return hold(c, s, raw)
+  }
+
+  function drain(c: Conn) {
+    if (c.pokes && c.sink.backlog() < HIGH) {
+      c.sink.write('p', JSON.stringify({ t: [...c.pokes.t], c: c.pokes.c }))
+      c.pokes = undefined
+    }
+    for (const s of c.held) {
+      while (s.q.length && c.sink.backlog() < HIGH) {
+        const x = s.q.shift()!
+        c.bytes -= x.size
+        c.sink.write('m', x.raw)
+      }
+      if (s.q.length) return
+      c.held.delete(s)
+    }
+  }
+
+  return { poke, deliver, drain }
+}