@omg-dev/media 0.4.24

package/dist/index.mjs

@@ -0,0 +1,91 @@
+import { AsyncLocalStorage } from "node:async_hooks";
+//#region src/index.ts
+const endUserStore = new AsyncLocalStorage();
+/**
+* Run `fn` with the given end-user id in scope. Any generation submitted
+* (transitively) inside `fn` stamps `X-OMG-User: <userId>` on the proxy call
+* unless an explicit `endUser` option overrides it. Pass a falsy id to opt out.
+*/
+function runWithEndUser(userId, fn) {
+	if (!userId) return fn();
+	return endUserStore.run(userId, fn);
+}
+/** The end-user id currently in scope, or undefined. */
+function getEndUser() {
+	return endUserStore.getStore();
+}
+function mediaBase() {
+	return process.env.OMG_MEDIA_URL || "http://localhost:9090/media";
+}
+function attributedHeaders(explicit) {
+	const h = { "Content-Type": "application/json" };
+	const user = explicit ?? endUserStore.getStore();
+	if (user) h["X-OMG-User"] = user;
+	return h;
+}
+/** Enqueue a generation. Returns immediately with a queued job. */
+async function submit(opts) {
+	const res = await fetch(`${mediaBase()}/submit`, {
+		method: "POST",
+		headers: attributedHeaders(opts.endUser),
+		body: JSON.stringify({
+			provider: opts.provider,
+			model: opts.model,
+			input: opts.input ?? {}
+		})
+	});
+	if (!res.ok) throw new Error(`media submit failed: ${res.status} ${await res.text()}`);
+	return await res.json();
+}
+/** Fetch the current state of a job. */
+async function getJob(jobId) {
+	const res = await fetch(`${mediaBase()}/jobs/${encodeURIComponent(jobId)}`);
+	if (!res.ok) throw new Error(`media getJob failed: ${res.status} ${await res.text()}`);
+	return await res.json();
+}
+const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
+/** Submit then poll until the job reaches a terminal state (or times out). */
+async function generate(opts) {
+	const interval = opts.pollIntervalMs ?? 1500;
+	const timeout = opts.timeoutMs ?? 3e5;
+	const endUser = opts.endUser ?? endUserStore.getStore();
+	const job = await submit({
+		...opts,
+		endUser
+	});
+	const deadline = Date.now() + timeout;
+	let current = job;
+	while (current.status === "queued" || current.status === "running") {
+		if (Date.now() > deadline) throw new Error(`media generate timed out after ${timeout}ms (job ${job.jobId})`);
+		await sleep(interval);
+		current = await getJob(job.jobId);
+	}
+	if (current.status === "failed") throw new Error(`media generate failed: ${current.error || "unknown error"}`);
+	return current;
+}
+/** Generate one image and return its first result URL plus the full job. */
+async function generateImage(opts) {
+	const job = await generate(opts);
+	const url = job.results?.[0]?.url;
+	if (!url) throw new Error(`media generateImage: job ${job.jobId} produced no result`);
+	return {
+		url,
+		job
+	};
+}
+/** Generate one video and return its first result URL plus the full job. */
+async function generateVideo(opts) {
+	const job = await generate({
+		timeoutMs: 6e5,
+		pollIntervalMs: 3e3,
+		...opts
+	});
+	const url = job.results?.[0]?.url;
+	if (!url) throw new Error(`media generateVideo: job ${job.jobId} produced no result`);
+	return {
+		url,
+		job
+	};
+}
+//#endregion
+export { generate, generateImage, generateVideo, getEndUser, getJob, runWithEndUser, submit };

package/dist/react.mjs

@@ -0,0 +1,53 @@
+import { useEffect, useState } from "react";
+//#region src/react.ts
+/**
+* Poll `pollUrl` (a route on your own app that proxies getJob) until the job
+* is terminal. Pass `null` to stay idle (e.g. before a job exists). The route
+* is expected to return a `Job` shape: `{ status, results?, error? }`.
+*/
+function useMediaJob(pollUrl, opts = {}) {
+	const interval = opts.intervalMs ?? 1500;
+	const [state, setState] = useState({
+		status: "idle",
+		results: []
+	});
+	useEffect(() => {
+		if (!pollUrl) {
+			setState({
+				status: "idle",
+				results: []
+			});
+			return;
+		}
+		let cancelled = false;
+		let timer;
+		const tick = async () => {
+			try {
+				const job = await (await fetch(pollUrl)).json();
+				if (cancelled) return;
+				setState({
+					status: job.status,
+					results: job.results ?? [],
+					error: job.error,
+					job
+				});
+				if (job.status === "queued" || job.status === "running") timer = setTimeout(tick, interval);
+			} catch (e) {
+				if (cancelled) return;
+				setState((s) => ({
+					...s,
+					error: String(e)
+				}));
+				timer = setTimeout(tick, interval);
+			}
+		};
+		tick();
+		return () => {
+			cancelled = true;
+			clearTimeout(timer);
+		};
+	}, [pollUrl, interval]);
+	return state;
+}
+//#endregion
+export { useMediaJob };

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@omg-dev/media",
+  "version": "0.4.24",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./src/index.ts",
+      "default": "./dist/index.mjs"
+    },
+    "./react": {
+      "types": "./src/react.ts",
+      "default": "./dist/react.mjs"
+    }
+  },
+  "peerDependencies": {
+    "react": "^18 || ^19"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    }
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/BennyKok/vibes.git"
+  },
+  "homepage": "https://docs.omg.dev",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  }
+}

package/src/index.ts

@@ -0,0 +1,167 @@
+// @omg-dev/media — zero-config media generation (image / video / audio) for
+// omg-deployed apps. Server-only entry.
+//
+// What this gives you:
+//   - `submit` / `getJob` — the raw async job API: enqueue a generation on a
+//     curated model, then poll for the result. Video can take minutes, so the
+//     model is fundamentally async (submit returns a jobId immediately).
+//   - `generateImage` / `generateVideo` — sugar that submits then polls to
+//     completion, so the simple case reads synchronously.
+//   - `runWithEndUser(userId, fn)` — wraps a handler so generations inside are
+//     attributed to the end-user (`X-OMG-User`), same pattern as @omg-dev/ai.
+//
+// No baseURL or key from your code: the omg infra orchestrator injects
+// `OMG_MEDIA_URL` into the sandbox, the host-side media proxy holds the
+// provider key, bills your omg credits (pass-through, no margin), and uploads
+// the result to a durable CDN. You just pick a model and pass params.
+//
+//   import { generateImage } from "@omg-dev/media"
+//   const { url } = await generateImage({
+//     model: "wavespeed-ai/flux-dev",
+//     input: { prompt: "a corgi astronaut, studio lighting" },
+//   })
+
+import { AsyncLocalStorage } from "node:async_hooks"
+
+// ── End-user attribution ─────────────────────────────────────────────────────
+
+const endUserStore = new AsyncLocalStorage<string>()
+
+/**
+ * Run `fn` with the given end-user id in scope. Any generation submitted
+ * (transitively) inside `fn` stamps `X-OMG-User: <userId>` on the proxy call
+ * unless an explicit `endUser` option overrides it. Pass a falsy id to opt out.
+ */
+export function runWithEndUser<T>(
+  userId: string | undefined | null,
+  fn: () => T | Promise<T>,
+): T | Promise<T> {
+  if (!userId) return fn()
+  return endUserStore.run(userId, fn)
+}
+
+/** The end-user id currently in scope, or undefined. */
+export function getEndUser(): string | undefined {
+  return endUserStore.getStore()
+}
+
+// ── Types ────────────────────────────────────────────────────────────────────
+
+export type JobStatus = "queued" | "running" | "succeeded" | "failed"
+
+export interface ResultRef {
+  url: string
+  contentType?: string
+}
+
+export interface Job {
+  jobId: string
+  status: JobStatus
+  model?: string
+  results?: ResultRef[]
+  error?: string
+}
+
+export interface SubmitOptions {
+  /** Curated model id, e.g. "wavespeed-ai/flux-dev". */
+  model: string
+  /** Model-specific params (prompt, image, duration, num_images, …). */
+  input?: Record<string, unknown>
+  /** Provider override; inferred from the model when omitted. */
+  provider?: string
+  /** Attribution override; defaults to the runWithEndUser context. */
+  endUser?: string
+}
+
+export interface GenerateOptions extends SubmitOptions {
+  /** Poll interval in ms (default 1500). */
+  pollIntervalMs?: number
+  /** Give up after this many ms (default 300_000 = 5 min). */
+  timeoutMs?: number
+}
+
+// ── Transport ────────────────────────────────────────────────────────────────
+
+// Base injected by the orchestrator. Falls back to a localhost guess so the
+// package is importable outside a sandbox (calls will just fail to connect).
+function mediaBase(): string {
+  return process.env.OMG_MEDIA_URL || "http://localhost:9090/media"
+}
+
+function attributedHeaders(explicit?: string): Record<string, string> {
+  const h: Record<string, string> = { "Content-Type": "application/json" }
+  const user = explicit ?? endUserStore.getStore()
+  if (user) h["X-OMG-User"] = user
+  return h
+}
+
+/** Enqueue a generation. Returns immediately with a queued job. */
+export async function submit(opts: SubmitOptions): Promise<Job> {
+  const res = await fetch(`${mediaBase()}/submit`, {
+    method: "POST",
+    headers: attributedHeaders(opts.endUser),
+    body: JSON.stringify({
+      provider: opts.provider,
+      model: opts.model,
+      input: opts.input ?? {},
+    }),
+  })
+  if (!res.ok) {
+    throw new Error(`media submit failed: ${res.status} ${await res.text()}`)
+  }
+  return (await res.json()) as Job
+}
+
+/** Fetch the current state of a job. */
+export async function getJob(jobId: string): Promise<Job> {
+  const res = await fetch(`${mediaBase()}/jobs/${encodeURIComponent(jobId)}`)
+  if (!res.ok) {
+    throw new Error(`media getJob failed: ${res.status} ${await res.text()}`)
+  }
+  return (await res.json()) as Job
+}
+
+const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms))
+
+/** Submit then poll until the job reaches a terminal state (or times out). */
+export async function generate(opts: GenerateOptions): Promise<Job> {
+  const interval = opts.pollIntervalMs ?? 1500
+  const timeout = opts.timeoutMs ?? 300_000
+  // Capture attribution now so polling outside the ALS scope still attributes.
+  const endUser = opts.endUser ?? endUserStore.getStore()
+  const job = await submit({ ...opts, endUser })
+  const deadline = Date.now() + timeout
+  let current = job
+  while (current.status === "queued" || current.status === "running") {
+    if (Date.now() > deadline) {
+      throw new Error(`media generate timed out after ${timeout}ms (job ${job.jobId})`)
+    }
+    await sleep(interval)
+    current = await getJob(job.jobId)
+  }
+  if (current.status === "failed") {
+    throw new Error(`media generate failed: ${current.error || "unknown error"}`)
+  }
+  return current
+}
+
+/** Generate one image and return its first result URL plus the full job. */
+export async function generateImage(
+  opts: GenerateOptions,
+): Promise<{ url: string; job: Job }> {
+  const job = await generate(opts)
+  const url = job.results?.[0]?.url
+  if (!url) throw new Error(`media generateImage: job ${job.jobId} produced no result`)
+  return { url, job }
+}
+
+/** Generate one video and return its first result URL plus the full job. */
+export async function generateVideo(
+  opts: GenerateOptions,
+): Promise<{ url: string; job: Job }> {
+  // Video is slower; default the timeout up if the caller didn't set one.
+  const job = await generate({ timeoutMs: 600_000, pollIntervalMs: 3000, ...opts })
+  const url = job.results?.[0]?.url
+  if (!url) throw new Error(`media generateVideo: job ${job.jobId} produced no result`)
+  return { url, job }
+}

package/src/react.ts

@@ -0,0 +1,92 @@
+// Browser-safe entry — a polling hook for media jobs.
+//
+// `@omg-dev/media` (the root entry) is server-only: it imports
+// `node:async_hooks` and talks to the in-VM media proxy (OMG_MEDIA_URL), which
+// is not reachable from the browser. So the client flow is:
+//
+//   1. Your `functions/api/<name>.ts` route calls `submit()` (server) and
+//      returns the `{ jobId }` to the browser.
+//   2. The browser hook below polls YOUR route (which calls `getJob()` server
+//      side) until the job is terminal, then hands you the result URLs.
+//
+//   import { useMediaJob } from "@omg-dev/media/react"
+//   const { status, results } = useMediaJob(jobId ? `/api/media-status?id=${jobId}` : null)
+
+import { useEffect, useState } from "react"
+
+export type JobStatus = "queued" | "running" | "succeeded" | "failed"
+
+export interface ResultRef {
+  url: string
+  contentType?: string
+}
+
+export interface Job {
+  jobId: string
+  status: JobStatus
+  results?: ResultRef[]
+  error?: string
+}
+
+export interface UseMediaJobOptions {
+  /** Poll interval in ms (default 1500). */
+  intervalMs?: number
+}
+
+export interface UseMediaJobState {
+  status: JobStatus | "idle"
+  results: ResultRef[]
+  error?: string
+  job?: Job
+}
+
+/**
+ * Poll `pollUrl` (a route on your own app that proxies getJob) until the job
+ * is terminal. Pass `null` to stay idle (e.g. before a job exists). The route
+ * is expected to return a `Job` shape: `{ status, results?, error? }`.
+ */
+export function useMediaJob(
+  pollUrl: string | null,
+  opts: UseMediaJobOptions = {},
+): UseMediaJobState {
+  const interval = opts.intervalMs ?? 1500
+  const [state, setState] = useState<UseMediaJobState>({ status: "idle", results: [] })
+
+  useEffect(() => {
+    if (!pollUrl) {
+      setState({ status: "idle", results: [] })
+      return
+    }
+    let cancelled = false
+    let timer: ReturnType<typeof setTimeout>
+
+    const tick = async () => {
+      try {
+        const res = await fetch(pollUrl)
+        const job = (await res.json()) as Job
+        if (cancelled) return
+        setState({
+          status: job.status,
+          results: job.results ?? [],
+          error: job.error,
+          job,
+        })
+        if (job.status === "queued" || job.status === "running") {
+          timer = setTimeout(tick, interval)
+        }
+      } catch (e) {
+        if (cancelled) return
+        setState((s) => ({ ...s, error: String(e) }))
+        timer = setTimeout(tick, interval)
+      }
+    }
+    tick()
+
+    return () => {
+      cancelled = true
+      clearTimeout(timer)
+    }
+  }, [pollUrl, interval])
+
+  return state
+}