@kestack/web-platform 0.0.0-stage → 0.0.1

package/src/recipes/thumb-picker/lock.ts

@@ -0,0 +1,86 @@
+import { type Pointer, useGesture } from '../../input/index.ts';
+import { useRef } from 'react';
+import type { TreeWalk } from '@kestack/use-gesture';
+
+// The thumb lands on this part of the screen's width, from the left.
+const THUMB_PART = 0.5;
+// How far, in px, the thumb may drift and still be still.
+const STILL = 14;
+
+/**
+ * The Thumb Lock of the nearest Gesture Zone: the left thumb resting still
+ * while another finger moves. It reports the Lock as it holds, the other
+ * finger as it moves, from where it landed, and the end: lifted, when the
+ * finger lifts first, or called off, when the thumb does. The thumb may
+ * stay for another swipe. A swipe of one finger is left to
+ * the zones and the browser, so the page still scrolls.
+ */
+export function useThumbLock(props: {
+  readonly enabled: boolean;
+  readonly onLock: () => void;
+  readonly onMove: (finger: TreeWalk.Point) => void;
+  readonly onEnd: (lifted: boolean) => void;
+}) {
+  const thumb = useRef<Pointer>(undefined);
+  const mover = useRef<Pointer>(undefined);
+  const stop = useRef<Array<() => void>>([]);
+  // Two fingers own the touch at its first movement; one is left alone.
+  const directions = useRef<'all' | []>([]);
+  const latest = useRef(props);
+  latest.current = props;
+
+  const release = (lifted: boolean) => {
+    if (mover.current === undefined) return;
+    for (const off of stop.current) off();
+    stop.current = [];
+    mover.current = undefined;
+    directions.current = [];
+    latest.current.onEnd(lifted);
+  };
+
+  const follow = (finger: Pointer) => {
+    const moved = () =>
+      latest.current.onMove({ x: finger.dx.get(), y: finger.dy.get() });
+    stop.current.push(
+      finger.dx.on('change', moved),
+      finger.dy.on('change', moved),
+    );
+  };
+
+  useGesture({
+    enabled: props.enabled,
+    get directions() {
+      return directions.current;
+    },
+    onStart: (pointers) => {
+      const [first] = pointers.values();
+      thumb.current =
+        first !== undefined && first.start.x <= window.innerWidth * THUMB_PART
+          ? first
+          : undefined;
+    },
+    onPointer: (pointer) => {
+      const held = thumb.current;
+      if (pointer.end !== undefined) {
+        if (pointer.id === mover.current?.id) release(true);
+        // The thumb lifting first calls the swipe off.
+        else if (pointer.id === held?.id) {
+          thumb.current = undefined;
+          release(false);
+        }
+        return;
+      }
+      if (held === undefined || pointer.id === held.id || mover.current) return;
+      // The thumb is still: the Lock holds from this finger's landing.
+      if (Math.hypot(held.dx.get(), held.dy.get()) > STILL) return;
+      mover.current = pointer;
+      directions.current = 'all';
+      follow(pointer);
+      latest.current.onLock();
+    },
+    onEnd: () => {
+      thumb.current = undefined;
+      release(false);
+    },
+  });
+}

package/src/recipes/thumb-picker/menu.tsx

@@ -0,0 +1,105 @@
+import { AnimatePresence, motion, useReducedMotion } from 'motion/react';
+import { useEffect, useRef } from 'react';
+import { createPortal } from 'react-dom';
+import type { TreeWalk } from '@kestack/use-gesture';
+import type { Choice } from './choice.ts';
+import { List } from './list.tsx';
+
+const EASE = [0.23, 1, 0.32, 1] as const;
+const SPRING = { type: 'spring', duration: 0.18, bounce: 0.15 } as const;
+const SLIDE = { type: 'spring', duration: 0.28, bounce: 0.1 } as const;
+const FADE = { duration: 0.16, ease: EASE } as const;
+const AT_ONCE = { duration: 0 } as const;
+// How far, in px, each list behind the open one sits to the top left.
+const BEHIND = { x: -104, y: -28 } as const;
+// A Wrong Way: the menu shakes side to side, once.
+const SHAKE = [0, -6, 5, -3, 2, 0].map((x) => `translateX(${x}px)`);
+
+type Column = TreeWalk.Column<Choice>;
+
+/**
+ * Where letting go will take you, at the top centre of the screen and
+ * never under the fingers, over everything else dimmed and blurred: the
+ * open list in the middle, and each list it was opened from drawn back to
+ * the top left, smaller and fainter. It zooms in as it shows; an opened
+ * list slides in from the right and slides back out as the swipe goes
+ * back. Each time `shakes` counts up, the menu shakes once. None of it
+ * moves for those who ask for less motion.
+ */
+export function Menu(props: {
+  readonly columns: ReadonlyArray<Column> | undefined;
+  readonly shakes: number;
+}) {
+  const still = useReducedMotion() === true;
+  const shaking = useRef<HTMLDivElement>(null);
+  useEffect(() => {
+    if (props.shakes === 0 || still) return;
+    shaking.current?.animate(
+      { transform: SHAKE },
+      { duration: 320, easing: 'ease-out' },
+    );
+  }, [props.shakes, still]);
+  if (typeof document === 'undefined') return null;
+  const columns = props.columns ?? [];
+  const last = columns.length - 1;
+  return createPortal(
+    <AnimatePresence>
+      {props.columns !== undefined && (
+        <motion.div
+          key="scrim"
+          aria-hidden="true"
+          initial={{ opacity: 0 }}
+          animate={{ opacity: 1 }}
+          exit={{ opacity: 0 }}
+          transition={still ? AT_ONCE : FADE}
+          className="pointer-events-none fixed inset-0 z-[99] bg-black/40 backdrop-blur-sm"
+        />
+      )}
+      {props.columns !== undefined && (
+        <motion.div
+          key="menu"
+          aria-live="polite"
+          initial={{ opacity: 0, scale: 0.94 }}
+          animate={{ opacity: 1, scale: 1 }}
+          exit={{ opacity: 0, scale: 0.97 }}
+          transition={still ? AT_ONCE : FADE}
+          className="pointer-events-none fixed top-[calc(env(safe-area-inset-top)+6rem)] left-1/2 z-[100] origin-top text-sm text-popover-foreground"
+        >
+          <div ref={shaking}>
+            <AnimatePresence initial={false}>
+              {columns.map((column, depth) => {
+                const back = last - depth;
+                return (
+                  <motion.div
+                    key={column.id}
+                    style={{ zIndex: depth }}
+                    initial={{ opacity: 0, x: 56, scale: 0.96 }}
+                    animate={{
+                      opacity: back === 0 ? 1 : 0.5,
+                      x: back * BEHIND.x,
+                      y: back * BEHIND.y,
+                      scale: 1 - back * 0.1,
+                    }}
+                    exit={{ opacity: 0, x: 56, scale: 0.96 }}
+                    transition={still ? AT_ONCE : SLIDE}
+                    // Centred by `translate`, apart from the motion's `transform`.
+                    className="absolute top-0 left-0 origin-top-left -translate-x-1/2 rounded-2xl border bg-popover shadow-lg"
+                  >
+                    <List
+                      id={column.id}
+                      choices={column.choices}
+                      marked={column.marked}
+                      here={column.here}
+                      move={still ? AT_ONCE : SPRING}
+                    />
+                  </motion.div>
+                );
+              })}
+            </AnimatePresence>
+          </div>
+        </motion.div>
+      )}
+    </AnimatePresence>,
+    document.body,
+  );
+}

package/src/recipes/thumb-picker/thumb-picker.tsx

@@ -0,0 +1,84 @@
+import { TreeWalk } from '@kestack/use-gesture';
+import { useRef, useState } from 'react';
+import type { Choice } from './choice.ts';
+import { useThumbLock } from './lock.ts';
+import { Menu } from './menu.tsx';
+
+export type { Choice } from './choice.ts';
+
+/**
+ * A Thumb Lock that picks from a tree of choices: the left thumb resting
+ * still while another finger swipes. The walk starts on the choice `start`
+ * names; nothing shows until the finger has gone `reveal` px, then the
+ * choices show over everything else, dimmed and blurred. Each `step` px
+ * the finger goes from where it last moved something makes one move. Up and down Step
+ * through a list; right opens the marked choice's own choices, starting
+ * on the one last marked there in this swipe, and left goes back. Lifting
+ * the finger chooses the marked choice, unless it is where the swipe began
+ * or on the way to it; lifting the thumb first chooses nothing. A Wrong
+ * Way shakes the menu. Each Lock, Step, opening, going back and Wrong Way
+ * is told, for sound
+ * and touch to follow.
+ */
+export function ThumbPicker(props: {
+  readonly tree: ReadonlyArray<Choice>;
+  /** The ids of the choices the swipe begins at, top to bottom. */
+  readonly start: ReadonlyArray<string>;
+  readonly onFeedback?: (feedback: 'lock' | TreeWalk.Event) => void;
+  readonly enabled?: boolean;
+  /** How far, in px, the finger goes before anything shows: 14 unless told. */
+  readonly reveal?: number;
+  /** How far, in px, the finger goes for each move: 30 unless told. */
+  readonly step?: number;
+}) {
+  const [walk, setWalk] = useState<TreeWalk.Walk>();
+  // How many Wrong Ways the menu has shaken for.
+  const [shakes, setShakes] = useState(0);
+  // The walk as the finger left it, ahead of the next render.
+  const walking = useRef<TreeWalk.Walk>(undefined);
+  const latest = useRef(props);
+  latest.current = props;
+
+  const show = (next: TreeWalk.Walk | undefined) => {
+    walking.current = next;
+    setWalk(next);
+  };
+
+  useThumbLock({
+    enabled: props.enabled !== false,
+    onLock: () => {
+      const { tree, start, onFeedback } = latest.current;
+      show(TreeWalk.begin(tree, start));
+      onFeedback?.('lock');
+    },
+    onMove: (finger) => {
+      const { tree, start, onFeedback, reveal, step } = latest.current;
+      if (walking.current === undefined) return;
+      const after = TreeWalk.move(walking.current, tree, start, finger, {
+        reveal: reveal ?? TreeWalk.DISTANCES.reveal,
+        step: step ?? TreeWalk.DISTANCES.step,
+      });
+      for (const event of after.events) onFeedback?.(event);
+      if (after.events.includes('wrong')) setShakes((count) => count + 1);
+      if (after.walk !== walking.current) show(after.walk);
+    },
+    onEnd: (lifted) => {
+      const last = walking.current;
+      show(undefined);
+      if (!lifted || last === undefined) return;
+      const { tree, start } = latest.current;
+      TreeWalk.chosen(last, tree, start)?.onSelect?.();
+    },
+  });
+
+  return (
+    <Menu
+      shakes={shakes}
+      columns={
+        walk === undefined || !walk.shown
+          ? undefined
+          : TreeWalk.columns(walk, props.tree, props.start)
+      }
+    />
+  );
+}

package/src/server/index.ts

@@ -0,0 +1,21 @@
+// A web app's server: its APIs and its pages from one fetch handler, its
+// Live Objects, and the stages alchemy deploys it to.
+export {
+  type CloudBackend,
+  createServer,
+  type LiveNamespace,
+  type ServerConfig,
+} from './serve/index.ts';
+export {
+  type LiveAuth,
+  type LiveBackend,
+  type LiveObject,
+  liveObject,
+} from './live/index.ts';
+export {
+  assertStageIsSafe,
+  devConfigFor,
+  domainFor,
+  isDeployedStage,
+} from './stage/index.ts';
+export { type Handle, webServer } from './worker/index.ts';

package/src/server/live/index.ts

@@ -0,0 +1,9 @@
+export {
+  forOwner,
+  type LiveAuth,
+  type LiveBackend,
+  type LiveObject,
+  liveObject,
+  liveUser,
+  ownedBy,
+} from './live.ts';

package/src/server/live/live.ts

@@ -0,0 +1,219 @@
+import type * as cf from '@cloudflare/workers-types';
+import { Context, Effect, Layer } from 'effect';
+import { HttpServerRequest, HttpServerResponse } from 'effect/http';
+import type { Rpc as EffectRpc } from 'effect/rpc';
+import type { Api } from '../../define/index.ts';
+import { authz } from '@kestack/auth-toolkit/server/cloud';
+import { Authz } from '@kestack/auth-toolkit/guard';
+import { Rpc } from '@kestack/rpc-toolkit/rpc';
+
+/** The shared sign-in service, as a cloud API checks each call with it. */
+export interface LiveAuth {
+  readonly url: string;
+  readonly resource?: string | undefined;
+}
+
+/** One API's handlers in a Live Object, with the services they stand on
+ * given: made once each time the object wakes, from its own storage. */
+export type LiveBackend<Rpcs extends EffectRpc.Any> = Layer.Layer<
+  EffectRpc.ToHandler<Rpcs> | EffectRpc.Middleware<Rpcs>,
+  unknown,
+  // oxlint-disable-next-line no-explicit-any
+  any
+>;
+
+const resolver = (auth: LiveAuth) =>
+  authz.cloud({
+    authWorkerUrl: auth.url,
+    ...(auth.resource !== undefined && { resource: auth.resource }),
+  });
+
+// An Effect response as the runtime sends it: an upgrade is the raw
+// Response carrying its socket, which converting would lose.
+const toWeb = (response: HttpServerResponse.HttpServerResponse): Response => {
+  const { body } = response;
+  return body._tag === 'Raw' && body.body instanceof Response
+    ? body.body
+    : HttpServerResponse.toWeb(response);
+};
+
+// A socket the runtime hands the object, as the RPC server reads it.
+const socketOf = (ws: cf.WebSocket): Rpc.websocket.HibernatingSocket => ({
+  ws,
+  close: (code, reason) => Effect.sync(() => ws.close(code, reason)),
+  serializeAttachment: (value) => ws.serializeAttachment(value),
+  deserializeAttachment: <T>() => ws.deserializeAttachment() as T | null,
+});
+
+/**
+ * Who a WebSocket opening at the cloud is for: the token in its address, as
+ * a browser sets no headers on one, checked as a call's would be. Null
+ * when it names nobody; `unavailable` when the sign-in service could not
+ * be asked.
+ */
+export const liveUser = (
+  request: Request,
+  auth: LiveAuth,
+): Promise<string | null | 'unavailable'> => {
+  const token = new URL(request.url).searchParams.get('access_token');
+  if (token === null) return Promise.resolve(null);
+  const signed = new Request(request.url, {
+    headers: { authorization: `Bearer ${token}` },
+  });
+  return Effect.runPromise(
+    Authz.Resolver.use((found) => found.resolve(signed)).pipe(
+      Effect.map((resolution) => resolution?.current.user.id ?? null),
+      Effect.catch(() => Effect.succeed('unavailable' as const)),
+      Effect.provide(resolver(auth)),
+    ),
+  );
+};
+
+/** The header `createServer` names a Live Object's owner by, set on every
+ * request it forwards there, whatever the caller sent. */
+export const LIVE_OWNER = 'x-kstack-live-owner';
+
+/** `request` as forwarded to the Live Object of `owner`. */
+export const forOwner = (request: Request, owner: string): Request => {
+  const headers = new Headers(request.headers);
+  headers.set(LIVE_OWNER, owner);
+  return new Request(request, { headers });
+};
+
+type Resolver = Context.Service.Identifier<typeof Authz.Resolver>;
+
+// Where the object keeps whom it was opened for, beside the app's own keys.
+const OWNER_KEY = '@kestack/web-platform/live/owner';
+
+/** `found`, narrowed to calls signed by `owner`: any other user's is
+ * signed by nobody. */
+export const ownedBy = (
+  owner: () => Promise<string | undefined>,
+): Layer.Layer<Resolver, never, Resolver> =>
+  Layer.effect(
+    Authz.Resolver,
+    Effect.map(Authz.Resolver, (found) =>
+      Authz.Resolver.of({
+        resolve: (request) =>
+          Effect.flatMap(found.resolve(request), (resolution) =>
+            resolution === null
+              ? Effect.succeed(null)
+              : Effect.map(Effect.promise(owner), (pinned) =>
+                  pinned === resolution.current.user.id ? resolution : null,
+                ),
+          ),
+      }),
+    ),
+  );
+
+/** What the runtime calls on a Live Object. */
+export interface LiveObject {
+  fetch(request: Request): Promise<Response>;
+  webSocketMessage(ws: cf.WebSocket, data: string | ArrayBuffer): Promise<void>;
+  webSocketClose(ws: cf.WebSocket, code: number, reason: string): Promise<void>;
+}
+
+/**
+ * A Live Object: a Durable Object class serving one API over hibernatable
+ * WebSockets, one object per user, its storage theirs alone. It keeps whom
+ * it was first opened for, and refuses a socket opened for anyone else;
+ * every call is still checked, by the token it carries, and refused unless
+ * that token is the same user's. `backend` makes the API's
+ * handlers from the object's own storage, and `streams` where open streams
+ * are kept while it sleeps (in the sockets' own notes, about 2 KB each,
+ * when not given). Export it from the Worker by the name its binding has.
+ */
+export const liveObject = <Rpcs extends EffectRpc.Any, Env>(options: {
+  readonly api: Api<Rpcs>;
+  readonly backend: (
+    env: Env,
+    storage: cf.DurableObjectStorage,
+  ) => LiveBackend<Rpcs>;
+  readonly auth: LiveAuth;
+  readonly streams?: (state: cf.DurableObjectState) => Rpc.StreamStore;
+}): new (state: cf.DurableObjectState, env: Env) => LiveObject =>
+  class implements LiveObject {
+    readonly #served: Promise<{
+      readonly accept: (request: Request) => Promise<Response>;
+      readonly message: (
+        socket: cf.WebSocket,
+        data: string | ArrayBuffer,
+      ) => Promise<void>;
+      readonly close: (
+        socket: cf.WebSocket,
+        code: number,
+        reason: string,
+      ) => Promise<void>;
+    }>;
+
+    readonly #storage: cf.DurableObjectStorage;
+    #owner: Promise<string | undefined> | undefined;
+
+    constructor(state: cf.DurableObjectState, env: Env) {
+      this.#storage = state.storage;
+      const { state: hibernation, upgrade } =
+        Rpc.websocket.fromDurableObjectState(state);
+      const handlers = options
+        .backend(env, state.storage)
+        .pipe(
+          Layer.provide(
+            ownedBy(this.#pinned).pipe(Layer.provide(resolver(options.auth))),
+          ),
+        ) as Layer.Layer<
+        | EffectRpc.ToHandler<Rpcs>
+        | EffectRpc.Middleware<Rpcs>
+        | EffectRpc.ServicesServer<Rpcs>
+      >;
+      this.#served = Effect.runPromise(
+        Effect.gen(function* () {
+          const rpc = yield* Rpc.websocket.server(options.api.group, handlers, {
+            state: hibernation,
+            upgrade,
+            ...(options.streams !== undefined && {
+              streams: options.streams(state),
+            }),
+          });
+          return {
+            accept: (request: Request) =>
+              Effect.runPromise(
+                rpc.accept.pipe(
+                  Effect.provideService(
+                    HttpServerRequest.HttpServerRequest,
+                    HttpServerRequest.fromWeb(request),
+                  ),
+                  Effect.map(toWeb),
+                ),
+              ),
+            message: (ws: cf.WebSocket, data: string | ArrayBuffer) =>
+              Effect.runPromise(rpc.message(socketOf(ws), data)),
+            close: (ws: cf.WebSocket, code: number, reason: string) =>
+              Effect.runPromise(rpc.close(socketOf(ws), code, reason)),
+          };
+        }),
+      );
+    }
+
+    // Whom the object was first opened for, read once per wake.
+    readonly #pinned = () =>
+      (this.#owner ??= this.#storage.get<string>(OWNER_KEY));
+
+    async fetch(request: Request): Promise<Response> {
+      const owner = request.headers.get(LIVE_OWNER);
+      if (owner === null) return new Response('Forbidden', { status: 403 });
+      const pinned = await this.#pinned();
+      if (pinned === undefined) {
+        await this.#storage.put(OWNER_KEY, owner);
+        this.#owner = Promise.resolve(owner);
+      } else if (pinned !== owner)
+        return new Response('Forbidden', { status: 403 });
+      return (await this.#served).accept(request);
+    }
+
+    async webSocketMessage(ws: cf.WebSocket, data: string | ArrayBuffer) {
+      await (await this.#served).message(ws, data);
+    }
+
+    async webSocketClose(ws: cf.WebSocket, code: number, reason: string) {
+      await (await this.#served).close(ws, code, reason);
+    }
+  };

package/src/server/serve/index.ts

@@ -0,0 +1,6 @@
+export {
+  type CloudBackend,
+  createServer,
+  type LiveNamespace,
+  type ServerConfig,
+} from './serve.ts';

package/src/server/serve/serve.ts

@@ -0,0 +1,115 @@
+import { Layer } from 'effect';
+import type { Apis, RpcsOf } from '../../define/index.ts';
+import type { Rpc as EffectRpc } from 'effect/rpc';
+import { authz } from '@kestack/auth-toolkit/server/cloud';
+import { Rpc } from '@kestack/rpc-toolkit/rpc';
+import { forOwner, liveUser } from '../live/index.ts';
+import { webServer } from '../worker/index.ts';
+
+/** One API's handlers on the cloud Backend, with the services they stand
+ * on given; who signed a call is given by `createServer` when the app has
+ * auth. */
+export type CloudBackend<Rpcs extends EffectRpc.Any> = Layer.Layer<
+  EffectRpc.ToHandler<Rpcs> | EffectRpc.Middleware<Rpcs>,
+  unknown,
+  // oxlint-disable-next-line no-explicit-any
+  any
+>;
+
+/** Where a Worker reaches its Live Objects, one per name: a Durable
+ * Object namespace binding. */
+export interface LiveNamespace {
+  readonly getByName: (name: string) => {
+    readonly fetch: (request: Request) => Promise<Response>;
+  };
+}
+
+export interface ServerConfig<A extends Apis, Env> {
+  /** The app's APIs, as its client names them. Each served here is at a
+   * path: an `http` API by `backend`, a `websocket` one by the caller's own
+   * Live Object in `live`. One at a full URL is served elsewhere. */
+  readonly apis: A;
+  /** Every `http` API's handlers on the cloud Backend, made for one request
+   * from the platform's own context, such as a Worker's `env`. */
+  readonly backend?: (env: Env) => {
+    readonly [K in keyof A]?: CloudBackend<RpcsOf<A[K]>>;
+  };
+  /** Every `websocket` API's Live Objects, from the Worker's `env`. A socket
+   * opens at the object named for whoever its token names, so needs `auth`. */
+  readonly live?: (env: Env) => { readonly [K in keyof A]?: LiveNamespace };
+  /** The shared sign-in service, for an app with auth: each call is
+   * checked for the Account its token or cookie names, and the sign-in
+   * cookies refreshed while checking go back on the answer. `resource` is
+   * the audience an Access Token must be for, as a phone's is. */
+  readonly auth?: {
+    readonly url: string;
+    readonly resource?: string | undefined;
+  };
+}
+
+const isUrl = (path: string) => /^[a-z][a-z0-9+.-]*:\/\//i.test(path);
+const normal = (path: string) => `/${path.replace(/^\/+|\/+$/g, '')}`;
+
+/**
+ * A web app's server: each of its `http` APIs at its path, on the cloud
+ * Backend, each `websocket` one at its path in the caller's own Live
+ * Object, and everything else the app's pages, from TanStack Start. A
+ * plain fetch handler, so it is a Cloudflare Worker's default export as it
+ * is.
+ */
+export const createServer = <A extends Apis, Env>(
+  config: ServerConfig<A, Env>,
+) => {
+  const served = Object.entries(config.apis).filter(
+    ([, api]) => !isUrl(api.path),
+  );
+  const { auth } = config;
+  // A socket for the object of whoever its token names.
+  const openLive = async (request: Request, objects: LiveNamespace) => {
+    if (auth === undefined)
+      return new Response('A Live Object needs auth', { status: 500 });
+    const user = await liveUser(request, auth);
+    if (user === null) return new Response('Unauthorized', { status: 401 });
+    if (user === 'unavailable')
+      return new Response('The sign-in service could not be asked', {
+        status: 503,
+      });
+    return objects.getByName(user).fetch(forOwner(request, user));
+  };
+  return webServer<Env>({
+    route: (request, env) => {
+      const path = normal(new URL(request.url).pathname);
+      const found = served.find(([, api]) => normal(api.path) === path);
+      if (found === undefined) return null;
+      const [name, api] = found;
+      if (api.transport === 'websocket') {
+        const objects = config.live?.(env)[name as keyof A];
+        return objects === undefined
+          ? Promise.resolve(new Response('Not found', { status: 404 }))
+          : openLive(request, objects);
+      }
+      const handlers = config.backend?.(env)[name as keyof A];
+      if (handlers === undefined)
+        return Promise.resolve(new Response('Not found', { status: 404 }));
+      const layer = (
+        auth === undefined
+          ? handlers
+          : handlers.pipe(
+              Layer.provide(
+                authz.cloud({
+                  authWorkerUrl: auth.url,
+                  ...(auth.resource !== undefined && {
+                    resource: auth.resource,
+                  }),
+                }),
+              ),
+            )
+      ) as never;
+      return Rpc.http.server(
+        api.group,
+        layer,
+        ...(auth === undefined ? [] : [{ wrap: authz.cookies }]),
+      )(request);
+    },
+  });
+};

package/src/server/stage/index.ts

@@ -0,0 +1,6 @@
+export {
+  assertStageIsSafe,
+  devConfigFor,
+  domainFor,
+  isDeployedStage,
+} from './stage.ts';