@liria24/og-image 1.0.0 → 1.0.2

package/server/utils/definePreset.ts

@@ -1,160 +0,0 @@
-import type {
-    ImageNode,
-    ImageSource,
-    ConstructRendererOptions,
-    Node,
-    RenderOptions,
-} from 'takumi-js/wasm'
-import type { GenericSchema, InferOutput } from 'valibot'
-
-type PresetRenderOptions = Omit<RenderOptions, 'width' | 'height' | 'format' | 'devicePixelRatio'>
-type PresetPropsSchema = GenericSchema
-type FontTextValue = string | null | undefined | false
-type FontText = string | readonly FontTextValue[]
-
-export interface GoogleFontConfig {
-    family: string
-    options?: Omit<import('takumi-js/helpers').GoogleFontOptions, 'text'>
-}
-
-interface DefinePresetOptions<TPropsSchema extends PresetPropsSchema> {
-    version: string
-    props: TPropsSchema
-    fonts: readonly GoogleFontConfig[]
-    fontText: (props: InferOutput<TPropsSchema>) => FontText
-    content: (props: InferOutput<TPropsSchema>) => Node
-    width?: number
-    height?: number
-    format?: RenderOptions['format']
-    devicePixelRatio?: number
-    persistentImages?: ConstructRendererOptions['persistentImages']
-    renderOptions?: PresetRenderOptions
-}
-
-interface PresetRenderConfig {
-    width: number
-    height: number
-    format: RenderOptions['format']
-    devicePixelRatio: number
-}
-
-export interface OgImagePreset {
-    slug: string
-    version: string
-    props: PresetPropsSchema
-    fonts: readonly GoogleFontConfig[]
-    fontText: (props: unknown) => string
-    persistentImages?: ConstructRendererOptions['persistentImages']
-    renderOptions: PresetRenderConfig
-    content: (props: unknown) => Node
-}
-
-type DefinedOgImagePreset<TPropsSchema extends PresetPropsSchema> = Omit<
-    OgImagePreset,
-    'slug' | 'props' | 'fontText' | 'content'
-> & {
-    props: TPropsSchema
-    fontText: (props: InferOutput<TPropsSchema>) => string
-    content: (props: InferOutput<TPropsSchema>) => Node
-}
-
-const normalizeFontText = (value: FontText) =>
-    typeof value === 'string'
-        ? value
-        : value.filter((text): text is string => Boolean(text)).join('\n')
-
-export const definePreset = <const TPropsSchema extends PresetPropsSchema>(
-    options: DefinePresetOptions<TPropsSchema>,
-): DefinedOgImagePreset<TPropsSchema> => {
-    const {
-        fontText,
-        width = 1200,
-        height = 630,
-        format = 'png',
-        devicePixelRatio = 1,
-        renderOptions,
-        ...preset
-    } = options
-
-    return {
-        ...preset,
-        fontText: (props) => normalizeFontText(fontText(props)),
-        renderOptions: {
-            width,
-            height,
-            format,
-            devicePixelRatio,
-            ...renderOptions,
-        },
-    }
-}
-
-interface SvgImageAsset {
-    src: string
-    svg: string
-}
-
-interface DefineSvgImageOptions {
-    color: string
-    width: number
-    height: number
-    src?: string
-}
-
-const setStyleColor = (style: string, color: string) => {
-    const normalizedStyle = style.trim().replace(/;+$/, '')
-    const nextStyle = normalizedStyle.match(/(^|;)\s*color\s*:/i)
-        ? normalizedStyle.replace(/(^|;)\s*color\s*:[^;]*/i, `$1 color: ${color}`)
-        : [normalizedStyle, `color: ${color}`].filter(Boolean).join('; ')
-
-    return nextStyle.trim().replace(/;?$/, ';')
-}
-
-const escapeAttribute = (value: string) =>
-    value.replace(/&/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;')
-
-const withSvgRootColor = (svg: string, color: string) => {
-    let foundSvgRoot = false
-    const replaced = svg.replace(/<svg\b([^>]*)>/i, (_tag, attributes: string) => {
-        foundSvgRoot = true
-        const nextAttributes = attributes.match(/\sstyle=(["'])(.*?)\1/i)
-            ? attributes.replace(
-                  /\sstyle=(["'])(.*?)\1/i,
-                  (_style, quote: string, style: string) =>
-                      ` style=${quote}${escapeAttribute(setStyleColor(style, color))}${quote}`,
-              )
-            : `${attributes} style="color: ${escapeAttribute(color)};"`
-
-        return `<svg${nextAttributes}>`
-    })
-
-    if (!foundSvgRoot) throw new Error('SVG root element was not found.')
-
-    return replaced
-}
-
-export const defineSvgImage = (
-    asset: SvgImageAsset,
-    { color, height, src = asset.src, width }: DefineSvgImageOptions,
-): { image: ImageSource; node: ImageNode } => ({
-    image: {
-        src,
-        data: new TextEncoder().encode(withSvgRootColor(asset.svg, color)),
-    },
-    node: {
-        type: 'image',
-        src,
-        width,
-        height,
-    },
-})
-
-export const withPresetId = <const TPropsSchema extends PresetPropsSchema>(
-    preset: DefinedOgImagePreset<TPropsSchema>,
-    slug: string,
-): OgImagePreset => ({
-    ...preset,
-    slug,
-    fontText: preset.fontText as (props: unknown) => string,
-    content: preset.content as (props: unknown) => Node,
-})

package/server/utils/error.ts

@@ -1,75 +0,0 @@
-import { getReasonPhrase, StatusCodes } from 'http-status-codes'
-import { HTTPError } from 'nitro/h3'
-
-interface ServerErrorOptions {
-    log?: {
-        tag?: string
-        message: string
-    }
-    responseMessage?: string
-}
-
-const FAILURE_CACHE_CONTROL = 'no-store'
-
-export const serverError = {
-    /** 400 */
-    badRequest(options?: ServerErrorOptions): never {
-        if (options?.log) console.error(options.log.message)
-        throw new HTTPError({
-            status: StatusCodes.BAD_REQUEST,
-            statusText: getReasonPhrase(StatusCodes.BAD_REQUEST),
-            message: options?.responseMessage,
-            headers: {
-                'cache-control': FAILURE_CACHE_CONTROL,
-            },
-        })
-    },
-    /** 401 */
-    unauthorized(options?: ServerErrorOptions): never {
-        if (options?.log) console.error(options.log.message)
-        throw new HTTPError({
-            status: StatusCodes.UNAUTHORIZED,
-            statusText: getReasonPhrase(StatusCodes.UNAUTHORIZED),
-            message: options?.responseMessage,
-            headers: {
-                'cache-control': FAILURE_CACHE_CONTROL,
-            },
-        })
-    },
-    /** 403 */
-    forbidden(options?: ServerErrorOptions): never {
-        if (options?.log) console.error(options.log.message)
-        throw new HTTPError({
-            status: StatusCodes.FORBIDDEN,
-            statusText: getReasonPhrase(StatusCodes.FORBIDDEN),
-            message: options?.responseMessage,
-            headers: {
-                'cache-control': FAILURE_CACHE_CONTROL,
-            },
-        })
-    },
-    /** 404 */
-    notFound(options?: ServerErrorOptions): never {
-        if (options?.log) console.error(options.log.message)
-        throw new HTTPError({
-            status: StatusCodes.NOT_FOUND,
-            statusText: getReasonPhrase(StatusCodes.NOT_FOUND),
-            message: options?.responseMessage,
-            headers: {
-                'cache-control': FAILURE_CACHE_CONTROL,
-            },
-        })
-    },
-    /** 500 */
-    internalServerError(options?: ServerErrorOptions): never {
-        if (options?.log) console.error(options.log.message)
-        throw new HTTPError({
-            status: StatusCodes.INTERNAL_SERVER_ERROR,
-            statusText: getReasonPhrase(StatusCodes.INTERNAL_SERVER_ERROR),
-            message: options?.responseMessage,
-            headers: {
-                'cache-control': FAILURE_CACHE_CONTROL,
-            },
-        })
-    },
-}

package/server/utils/preset.ts

@@ -1,11 +0,0 @@
-import { allPresets } from '#presets'
-
-const presetMap: Record<string, OgImagePreset> = Object.fromEntries(
-    allPresets.map((preset) => [preset.slug, preset]),
-)
-
-export const getPreset = (descriptor: OgImageDescriptor): OgImagePreset => {
-    const preset = presetMap[descriptor.slug]
-    if (!preset || preset.version !== descriptor.version) throw new Error('Preset not found')
-    return preset
-}

package/server/utils/render.ts

@@ -1,83 +0,0 @@
-import init, { Renderer } from '@takumi-rs/wasm'
-import wasmModule from '@takumi-rs/wasm/next'
-import { googleFont } from 'takumi-js/helpers'
-
-const RENDER_TIMEOUT_MS = 15_000 // 15 seconds
-
-const resolved = await wasmModule
-const module =
-    resolved && typeof resolved === 'object' && 'default' in resolved ? resolved.default : resolved
-await init({ module_or_path: module })
-
-type RenderPng = (descriptor: OgImageDescriptor, context?: RenderContext) => Promise<Uint8Array>
-
-export interface RenderContext {
-    signal?: AbortSignal
-}
-
-export const renderDescriptor = async (
-    descriptor: OgImageDescriptor,
-    context: RenderContext = {},
-): Promise<Uint8Array> => {
-    if (context.signal?.aborted) throw new Error('Render aborted')
-
-    const preset = getPreset(descriptor)
-    if (!preset) throw new Error('Unknown renderer')
-
-    if (context.signal?.aborted) throw new Error('Render aborted')
-
-    const renderer = new Renderer({
-        loadDefaultFonts: false,
-        persistentImages: preset.persistentImages,
-    })
-    try {
-        const descriptors = (
-            await Promise.all(
-                preset.fonts.map((config) =>
-                    googleFont(config.family, {
-                        ...config.options,
-                        text: preset.fontText(descriptor.props),
-                    }),
-                ),
-            )
-        ).flat()
-
-        await renderer.loadFonts(descriptors, context.signal)
-        return renderer.render(preset.content(descriptor.props), preset.renderOptions)
-    } finally {
-        renderer.free()
-    }
-}
-
-export const pngBytes = (png: ArrayBuffer | ArrayBufferView) =>
-    png instanceof ArrayBuffer
-        ? new Uint8Array(png)
-        : new Uint8Array(png.buffer, png.byteOffset, png.byteLength)
-
-export const withRenderTimeout = async (
-    descriptor: OgImageDescriptor,
-    renderPng: RenderPng,
-    context: RenderContext = {},
-) => {
-    const controller = new AbortController()
-    let timeout: ReturnType<typeof setTimeout> | undefined
-
-    try {
-        const timeoutPromise = new Promise<never>((_, reject) => {
-            timeout = setTimeout(() => {
-                controller.abort()
-                reject(new Error('OG image render timed out'))
-            }, RENDER_TIMEOUT_MS)
-        })
-
-        return await Promise.race([
-            renderPng(descriptor, {
-                ...context,
-                signal: controller.signal,
-            }),
-            timeoutPromise,
-        ])
-    } finally {
-        if (timeout) clearTimeout(timeout)
-    }
-}

package/server/utils/schema.ts

@@ -1,9 +0,0 @@
-import * as v from 'valibot'
-
-export const ogImageDescriptorBaseSchema = v.object({
-    slug: v.string(),
-    version: v.string(),
-    props: v.optional(v.unknown()),
-})
-
-export type OgImageDescriptor = v.InferOutput<typeof ogImageDescriptorBaseSchema>

package/server/utils/sha256Hex.ts

@@ -1,4 +0,0 @@
-export default async (value: string) => {
-    const digest = await crypto.subtle.digest('SHA-256', new TextEncoder().encode(value))
-    return [...new Uint8Array(digest)].map((byte) => byte.toString(16).padStart(2, '0')).join('')
-}

package/server/utils/validateRequest.ts

@@ -1,29 +0,0 @@
-import type { H3Event } from 'nitro'
-import { getValidatedQuery, getValidatedRouterParams, readValidatedBody } from 'nitro/h3'
-import * as v from 'valibot'
-
-const throwIfFailed = <T extends v.GenericSchema>(
-    result: v.SafeParseResult<T>,
-): v.InferOutput<T> => {
-    if (!result.success) {
-        if (import.meta.dev) console.error(result.issues)
-        throw serverError.badRequest({ responseMessage: 'Validation Error' })
-    }
-    return result.output
-}
-
-export const validateBody = async <const T extends v.GenericSchema>(
-    event: H3Event,
-    s: T,
-): Promise<v.InferOutput<T>> => throwIfFailed(await readValidatedBody(event, v.safeParser(s)))
-
-export const validateParams = async <T extends v.GenericSchema>(
-    event: H3Event,
-    s: T,
-): Promise<v.InferOutput<T>> =>
-    throwIfFailed(await getValidatedRouterParams(event, v.safeParser(s)))
-
-export const validateQuery = async <T extends v.GenericSchema>(
-    event: H3Event,
-    s: T,
-): Promise<v.InferOutput<T>> => throwIfFailed(await getValidatedQuery(event, v.safeParser(s)))

package/src/client.ts

@@ -1,42 +0,0 @@
-import { ofetch } from 'ofetch'
-
-type Presets = 'avatio'
-interface PresetVersions {
-    avatio: 'v1'
-}
-
-export interface RequestOgImageOptions<TProps = unknown> {
-    /**
-     * @default https://og.liria.me
-     */
-    endpoint?: string
-    /**
-     * @default process.env.OG_IMAGE_SECRET
-     */
-    secret?: string
-    preset: Presets
-    version: PresetVersions[Presets]
-    props: TProps
-}
-
-export interface IssueImageResponse {
-    url: string
-}
-
-export const requestOgImage = async ({
-    preset,
-    version,
-    props,
-    endpoint = 'https://og.liria.me',
-    secret = process.env.OG_IMAGE_SECRET || '',
-}: RequestOgImageOptions) =>
-    ofetch<IssueImageResponse>(
-        `/images/${encodeURIComponent(preset)}/${encodeURIComponent(version)}`,
-        {
-            baseURL: endpoint,
-            method: 'POST',
-            headers: { 'content-type': 'application/json' },
-            body: { secret, props },
-            retry: 3,
-        },
-    )

package/taze.config.ts

@@ -1,15 +0,0 @@
-import { defineConfig } from 'taze'
-
-export default defineConfig({
-    force: true,
-    write: true,
-    install: false,
-    interactive: true,
-    recursive: false,
-    includeLocked: true,
-    ignorePaths: ['**/node_modules/**'],
-    ignoreOtherWorkspaces: true,
-    depFields: {
-        overrides: false,
-    },
-})

package/tsconfig.json

@@ -1,3 +0,0 @@
-{
-    "extends": "./node_modules/.nitro/types/tsconfig.json"
-}

package/tsdown.config.ts

@@ -1,8 +0,0 @@
-import { defineConfig } from 'tsdown'
-
-export default defineConfig({
-    entry: ['src/client.ts'],
-    format: 'esm',
-    dts: true,
-    clean: true,
-})

package/types/assets.d.ts

@@ -1,25 +0,0 @@
-declare module '*.woff2' {
-    const value: ArrayBuffer
-    export default value
-}
-
-declare module '#fonts/*' {
-    interface FontAssetDefinition {
-        key: string
-        name: string
-        path: string
-        ranges: readonly (readonly [number, number])[]
-    }
-
-    export const fontFamily: string
-    export const fonts: readonly FontAssetDefinition[]
-}
-
-declare module '#images' {
-    interface OgImageAsset {
-        src: string
-        svg: string
-    }
-
-    export const images: Record<string, OgImageAsset>
-}

package/types/presets.d.ts

@@ -1,3 +0,0 @@
-declare module '#presets' {
-    export const allPresets: import('../server/utils/definePreset').OgImagePreset[]
-}