effect-start 0.9.0

package/src/HttpAppExtra.ts

@@ -0,0 +1,127 @@
+import {
+  HttpRouter,
+  HttpServerResponse,
+} from "@effect/platform"
+import * as HttpApp from "@effect/platform/HttpApp"
+import * as HttpMiddleware from "@effect/platform/HttpMiddleware"
+import {
+  RequestError,
+  RouteNotFound,
+} from "@effect/platform/HttpServerError"
+import {
+  Cause,
+  Effect,
+  Option,
+  ParseResult,
+  Record,
+} from "effect"
+
+/**
+ * Groups: function, path
+ */
+const StackLinePattern = /^at (.*?) \((.*?)\)/
+
+type GraciousError =
+  | RouteNotFound
+  | ParseResult.ParseError
+  | RequestError
+  | ParseResult.ParseError
+
+export const renderError = (
+  error: unknown,
+) =>
+  Effect.gen(function*() {
+    let unwrappedError: GraciousError | undefined
+
+    if (Cause.isCause(error)) {
+      const failure = Cause.failureOption(error).pipe(Option.getOrUndefined)
+
+      if (failure?.["_tag"]) {
+        unwrappedError = failure as GraciousError
+      }
+
+      yield* Effect.logError(error)
+    }
+
+    switch (unwrappedError?._tag) {
+      case "RouteNotFound":
+        return yield* HttpServerResponse.unsafeJson({
+          error: {
+            _tag: unwrappedError._tag,
+          },
+        }, {
+          status: 404,
+        })
+      case "RequestError": {
+        const message = unwrappedError.reason === "Decode"
+          ? "Request body is invalid"
+          : undefined
+
+        return yield* HttpServerResponse.unsafeJson({
+          error: {
+            _tag: unwrappedError._tag,
+            reason: unwrappedError.reason,
+            message,
+          },
+        }, {
+          status: 400,
+        })
+      }
+      case "ParseError": {
+        const issues = yield* ParseResult.ArrayFormatter.formatIssue(
+          unwrappedError.issue,
+        )
+        const cleanIssues = issues.map(v => Record.remove(v, "_tag"))
+
+        return yield* HttpServerResponse.unsafeJson({
+          error: {
+            _tag: unwrappedError._tag,
+            issues: cleanIssues,
+          },
+        }, {
+          status: 400,
+        })
+      }
+    }
+
+    return yield* HttpServerResponse.unsafeJson({
+      error: {
+        _tag: "UnexpectedError",
+      },
+    }, {
+      status: 500,
+    })
+  })
+
+function extractPrettyStack(stack: string) {
+  return stack
+    .split("\n")
+    .slice(1)
+    .map((line) => {
+      const match = line.trim().match(StackLinePattern)
+
+      if (!match) return line
+
+      const [_, fn, path] = match
+      const relativePath = path.replace(process.cwd(), ".")
+      return [fn, relativePath]
+    })
+    .filter(Boolean)
+}
+
+export function handleErrors<
+  E,
+  R,
+>(
+  app: HttpApp.Default<E, R>,
+): HttpApp.Default<Exclude<E, RouteNotFound>, R> {
+  return app.pipe(
+    Effect.catchAllCause(renderError),
+  )
+}
+
+export const withErrorHandled = HttpMiddleware.make(app => {
+  return app.pipe(
+    Effect.catchAllCause(renderError),
+  )
+})

package/src/Hyper.ts

@@ -0,0 +1,194 @@
+import * as HttpApp from "@effect/platform/HttpApp"
+import * as HttpServerResponse from "@effect/platform/HttpServerResponse"
+import * as Context from "effect/Context"
+import * as Effect from "effect/Effect"
+import * as Effectable from "effect/Effectable"
+import * as Fiber from "effect/Fiber"
+import * as Function from "effect/Function"
+import * as Layer from "effect/Layer"
+import * as Option from "effect/Option"
+import * as Pipeable from "effect/Pipeable"
+import { YieldWrap } from "effect/Utils"
+import * as HyperHtml from "./HyperHtml.ts"
+import type { JSX } from "./jsx.d.ts"
+import { HyperHooks } from "./x/datastar/index.ts"
+
+const TypeId = Symbol.for("~hyper/TypeId")
+const LayoutTypeId = Symbol.for("~hyper/LayoutTypeId")
+
+type Elements = JSX.IntrinsicElements
+
+type Children = JSX.Children
+
+export type {
+  Children,
+  Elements,
+  JSX,
+}
+
+export class Hyper extends Context.Tag("Hyper")<Hyper, {
+  hooks: typeof HyperHooks | undefined
+}>() {}
+
+export function layer(opts: {
+  hooks: typeof HyperHooks
+}) {
+  return Layer.sync(Hyper, () => {
+    return {
+      hooks: opts.hooks,
+    }
+  })
+}
+
+/**
+ * Accepts Effect that returns a HyperNode
+ * to a HttpApp.
+ * TODO: Implement Hyper.page that returns Hyper.Element
+ */
+export function handle<E, R>(
+  handler: Effect.Effect<
+    JSX.Children | HttpServerResponse.HttpServerResponse,
+    E,
+    R
+  >,
+): HttpApp.Default<E, R>
+export function handle(
+  handler: () => Generator<
+    never,
+    JSX.Children | HttpServerResponse.HttpServerResponse,
+    any
+  >,
+): HttpApp.Default<never, never>
+export function handle<Eff extends YieldWrap<Effect.Effect<any, any, any>>>(
+  handler: () => Generator<
+    Eff,
+    JSX.Children | HttpServerResponse.HttpServerResponse,
+    any
+  >,
+): HttpApp.Default<
+  [Eff] extends [YieldWrap<Effect.Effect<infer _A, infer E, infer _R>>] ? E
+    : never,
+  [Eff] extends [YieldWrap<Effect.Effect<infer _A, infer _E, infer R>>] ? R
+    : never
+>
+export function handle(
+  handler:
+    | Effect.Effect<
+      JSX.Children | HttpServerResponse.HttpServerResponse,
+      any,
+      any
+    >
+    | (() => Generator<
+      YieldWrap<Effect.Effect<any, any, any>>,
+      JSX.Children | HttpServerResponse.HttpServerResponse,
+      any
+    >),
+): HttpApp.Default<any, any> {
+  return Effect.gen(function*() {
+    const hyper = yield* Effect.serviceOption(Hyper).pipe(
+      Effect.andThen(Option.getOrNull),
+    )
+    const effect = isGenerator(handler) ? Effect.gen(handler) : handler
+    const value = yield* effect
+
+    if (HttpServerResponse.isServerResponse(value)) {
+      return value
+    }
+
+    const html = HyperHtml.renderToString(value, hyper?.hooks)
+
+    return yield* HttpServerResponse.html`${html}`
+  })
+}
+
+function isGenerator<A, E, R>(
+  handler: any,
+): handler is () => Generator<YieldWrap<Effect.Effect<A, E, R>>, any, any> {
+  return typeof handler === "function"
+    && handler.constructor?.name === "GeneratorFunction"
+}
+
+const NoChildren: ReadonlyArray<never> = Object.freeze([])
+
+type Primitive = string | number | boolean | null | undefined
+
+export type HyperType = string | HyperComponent
+
+export type HyperProps = {
+  [key: string]:
+    | Primitive
+    | ReadonlyArray<Primitive>
+    | HyperNode
+    | HyperNode[]
+    | null
+    | undefined
+}
+
+export type HyperComponent = (
+  props: HyperProps,
+) => HyperNode | Primitive
+
+export interface HyperNode {
+  type: HyperType
+  props: HyperProps
+}
+
+export function h(
+  type: HyperType,
+  props: HyperProps,
+): HyperNode {
+  return {
+    type,
+    props: {
+      ...props,
+      children: props.children ?? NoChildren,
+    },
+  }
+}
+
+export function unsafeUse<Value>(tag: Context.Tag<any, Value>) {
+  const currentFiber = Option.getOrThrow(
+    Fiber.getCurrentFiber(),
+  )
+  const context = currentFiber.currentContext
+
+  return Context.unsafeGet(context, tag)
+}
+
+export interface Layout<in out Provides, in out Requires>
+  extends Layer.Layer<Provides, never, Requires>
+{
+  readonly [TypeId]: typeof LayoutTypeId
+}
+
+export function layout<Provides, Requires>(
+  handler:
+    | Effect.Effect<
+      JSX.Children | HttpServerResponse.HttpServerResponse,
+      any,
+      any
+    >
+    | (() => Generator<
+      YieldWrap<Effect.Effect<any, any, any>>,
+      JSX.Children | HttpServerResponse.HttpServerResponse,
+      any
+    >),
+):
+  & Layout<Provides, Requires>
+  & {
+    handler: any
+  }
+{
+  return {
+    [TypeId]: LayoutTypeId,
+    [Layer.LayerTypeId]: {
+      _ROut: Function.identity,
+      _E: Function.identity,
+      _RIn: Function.identity,
+    },
+    handler,
+    pipe() {
+      return Pipeable.pipeArguments(this, arguments)
+    },
+  }
+}

package/src/HyperHtml.test.ts

@@ -0,0 +1,90 @@
+import * as t from "bun:test"
+import * as HyperHtml from "./HyperHtml.ts"
+import * as HyperNode from "./HyperNode.ts"
+
+t.it("boolean true attributes render without value (React-like)", () => {
+  const node = HyperNode.make("div", {
+    hidden: true,
+    disabled: true,
+    "data-active": true,
+  })
+
+  const html = HyperHtml.renderToString(node)
+
+  t
+    .expect(html)
+    .toBe("<div hidden disabled data-active></div>")
+})
+
+t.it("boolean false attributes are omitted", () => {
+  const node = HyperNode.make("div", {
+    hidden: false,
+    disabled: false,
+    "data-active": false,
+  })
+
+  const html = HyperHtml.renderToString(node)
+
+  t
+    .expect(html)
+    .toBe("<div></div>")
+})
+
+t.it("string attributes render with values", () => {
+  const node = HyperNode.make("div", {
+    id: "test",
+    class: "my-class",
+    "data-value": "hello",
+  })
+
+  const html = HyperHtml.renderToString(node)
+
+  t
+    .expect(html)
+    .toBe("<div id=\"test\" class=\"my-class\" data-value=\"hello\"></div>")
+})
+
+t.it("number attributes render with values", () => {
+  const node = HyperNode.make("input", {
+    type: "number",
+    min: 0,
+    max: 100,
+    value: 50,
+  })
+
+  const html = HyperHtml.renderToString(node)
+
+  t
+    .expect(html)
+    .toBe("<input type=\"number\" min=\"0\" max=\"100\" value=\"50\">")
+})
+
+t.it("null and undefined attributes are omitted", () => {
+  const node = HyperNode.make("div", {
+    id: null,
+    class: undefined,
+    "data-test": "value",
+  })
+
+  const html = HyperHtml.renderToString(node)
+
+  t
+    .expect(html)
+    .toBe("<div data-test=\"value\"></div>")
+})
+
+t.it("mixed boolean and string attributes", () => {
+  const node = HyperNode.make("input", {
+    type: "checkbox",
+    checked: true,
+    disabled: false,
+    name: "test",
+    value: "on",
+  })
+
+  const html = HyperHtml.renderToString(node)
+
+  t
+    .expect(html)
+    .toBe("<input type=\"checkbox\" checked name=\"test\" value=\"on\">")
+})

package/src/HyperHtml.ts

@@ -0,0 +1,139 @@
+import * as HyperNode from "./HyperNode.ts"
+import { JSX } from "./jsx"
+
+/**
+ * From: https://github.com/developit/vhtml
+ */
+const EMPTY_TAGS = [
+  "area",
+  "base",
+  "br",
+  "col",
+  "command",
+  "embed",
+  "hr",
+  "img",
+  "input",
+  "keygen",
+  "link",
+  "meta",
+  "param",
+  "source",
+  "track",
+  "wbr",
+]
+
+// escape an attribute
+let esc = (str: any) => String(str).replace(/[&<>"']/g, (s) => `&${map[s]};`)
+let map = {
+  "&": "amp",
+  "<": "lt",
+  ">": "gt",
+  "\"": "quot",
+  "'": "apos",
+}
+
+export function renderToString(
+  node: JSX.Children,
+  hooks?: { onNode?: (node: HyperNode.HyperNode) => void },
+): string {
+  const stack: any[] = [node]
+  let result = ""
+
+  while (stack.length > 0) {
+    const current = stack.pop()!
+
+    if (typeof current === "string") {
+      if (current.startsWith("<") && current.endsWith(">")) {
+        // This is a closing tag, don't escape it
+        result += current
+      } else {
+        result += esc(current)
+      }
+      continue
+    }
+
+    if (typeof current === "number") {
+      result += esc(current)
+      continue
+    }
+
+    if (typeof current === "boolean") {
+      // React-like behavior: booleans render nothing
+      continue
+    }
+
+    if (current === null || current === undefined) {
+      // React-like behavior: null/undefined render nothing
+      continue
+    }
+
+    if (Array.isArray(current)) {
+      // Handle arrays by pushing all items to stack in reverse order
+      for (let i = current.length - 1; i >= 0; i--) {
+        stack.push(current[i])
+      }
+      continue
+    }
+
+    if (current && typeof current === "object" && current.type) {
+      hooks?.onNode?.(current)
+
+      if (typeof current.type === "function") {
+        const componentResult = current.type(current.props)
+        if (componentResult != null) {
+          stack.push(componentResult)
+        }
+        continue
+      }
+
+      const { type, props } = current
+      result += `<${type}`
+
+      for (const key in props) {
+        if (
+          key !== "children"
+          && key !== "innerHTML"
+          && key !== "dangerouslySetInnerHTML"
+          && props[key] !== false
+          && props[key] != null
+        ) {
+          if (props[key] === true) {
+            result += ` ${esc(key)}`
+          } else {
+            const resolvedKey = key === "className" ? "class" : key
+
+            result += ` ${esc(resolvedKey)}="${esc(props[key])}"`
+          }
+        }
+      }
+
+      result += ">"
+
+      if (!EMPTY_TAGS.includes(type)) {
+        stack.push(`</${type}>`)
+
+        const html = props.dangerouslySetInnerHTML?.__html
+          ?? props.innerHTML
+
+        if (html) {
+          result += html
+        } else {
+          const children = props.children
+          if (Array.isArray(children)) {
+            for (let i = children.length - 1; i >= 0; i--) {
+              stack.push(children[i])
+            }
+          } else if (children != null) {
+            stack.push(children)
+          }
+        }
+      }
+    } else if (current && typeof current === "object") {
+      // Handle objects without type property - convert to string or ignore
+      // This prevents [object Object] from appearing
+      continue
+    }
+  }
+  return result
+}

package/src/HyperNode.ts

@@ -0,0 +1,37 @@
+export const TypeId = Symbol.for("effect-start/HyperNode")
+export type TypeId = typeof TypeId
+
+const NoChildren: ReadonlyArray<never> = Object.freeze([])
+
+type Primitive = string | number | boolean | null | undefined
+
+export type Type = string | HyperComponent
+
+export type Props = {
+  [key: string]:
+    | Primitive
+    | HyperNode
+    | Iterable<Primitive | HyperNode>
+}
+
+export type HyperComponent = (
+  props: Props,
+) => HyperNode | Primitive
+
+export interface HyperNode {
+  type: Type
+  props: Props
+}
+
+export function make(
+  type: Type,
+  props: Props,
+): HyperNode {
+  return {
+    type,
+    props: {
+      ...props,
+      children: props.children ?? NoChildren,
+    },
+  }
+}

package/src/JsModule.test.ts

@@ -0,0 +1,14 @@
+import * as t from "bun:test"
+import * as JsModule from "./JsModule.ts"
+
+t.describe("importSource", () => {
+  t.it("imports a string", async () => {
+    const mod = await JsModule.importSource<any>(`
+      export const b = "B"
+    `)
+
+    t
+      .expect(mod.b)
+      .toBe("B")
+  })
+})

package/src/JsModule.ts

@@ -0,0 +1,116 @@
+import * as Array from "effect/Array"
+import * as Function from "effect/Function"
+import * as Iterable from "effect/Iterable"
+import * as Order from "effect/Order"
+import * as Record from "effect/Record"
+import * as NFS from "node:fs"
+import * as NFSP from "node:fs/promises"
+import * as NPath from "node:path"
+import * as process from "node:process"
+
+/**
+ * Imports a blob as a module.
+ * Useful for loading code from build artifacts.
+ *
+ * Temporary files are wrriten to closest node_modules/ for node resolver
+ * to pick up dependencies correctly and to avoid arbitrary file watchers
+ * from detecting them.
+ */
+export async function importBlob<M = unknown>(
+  blob: Blob,
+  entrypoint = "index.js",
+): Promise<M> {
+  return await importBundle({
+    [entrypoint]: blob,
+  }, entrypoint)
+}
+
+/**
+ * Imports an entrypoint from multiple blobs.
+ * Useful for loading code from build artifacts.
+ *
+ * Temporary files are wrriten to closest node_modules/ for node resolver
+ * to pick up dependencies correctly and to avoid arbitrary file watchers
+ * from detecting them.
+ *
+ * WARNING: dynamic imports that happened after this function will fail
+ */
+export async function importBundle<M = unknown>(
+  blobs: {
+    [path: string]: Blob
+  },
+  entrypoint: string,
+  basePath = findNodeModules() + "/.tmp",
+): Promise<M> {
+  const sortedBlobs = Function.pipe(
+    blobs,
+    Record.toEntries,
+    Array.sortWith(v => v[0], Order.string),
+    Array.map(v => v[1]),
+  )
+  const bundleBlob = new Blob(sortedBlobs)
+  const hashPrefix = await hashBuffer(await bundleBlob.arrayBuffer())
+    .then(v => v.slice(0, 8))
+  const dir = `${basePath}/effect-start-${hashPrefix}`
+
+  await NFSP.mkdir(dir, { recursive: true })
+
+  await Promise.all(Function.pipe(
+    blobs,
+    Record.toEntries,
+    Array.map(([path, blob]) => {
+      const fullPath = `${dir}/${path}`
+
+      return blob
+        .arrayBuffer()
+        .then(v => NFSP.writeFile(fullPath, Buffer.from(v)))
+    }),
+  ))
+
+  const bundleModule = await import(`${dir}/${entrypoint}`)
+
+  await NFSP
+    .rmdir(dir, { recursive: true })
+    // if called concurrently, file sometimes may be deleted
+    // safe ignore when this happens
+    .catch(() => {})
+
+  return bundleModule
+}
+
+export function findNodeModules(startDir = process.cwd()) {
+  let currentDir = NPath.resolve(startDir)
+
+  while (currentDir !== NPath.parse(currentDir).root) {
+    const nodeModulesPath = NPath.join(currentDir, "node_modules")
+    if (
+      NFS.statSync(nodeModulesPath).isDirectory()
+    ) {
+      return nodeModulesPath
+    }
+
+    currentDir = NPath.dirname(currentDir)
+  }
+
+  return null
+}
+
+/**
+ * Loads a JS module from a string using data: import
+ */
+export async function importSource<M = unknown>(
+  code: string,
+): Promise<M> {
+  const dataUrl = `data:text/javascript,${encodeURIComponent(code)}`
+  return await import(dataUrl)
+}
+
+async function hashBuffer(buffer: BufferSource) {
+  const hashBuffer = await crypto.subtle.digest("SHA-256", buffer)
+
+  return Function.pipe(
+    new Uint8Array(hashBuffer),
+    Iterable.map(b => b.toString(16).padStart(2, "0")),
+    Iterable.reduce("", (a, b) => a + b),
+  )
+}