loopwind 0.25.6 → 0.25.7

package/platform/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "loopwind-platform",
+  "version": "0.1.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "wrangler dev",
+    "deploy": "wrangler deploy",
+    "db:migrate": "wrangler d1 migrations apply loopwind --local",
+    "db:migrate:prod": "wrangler d1 migrations apply loopwind --remote",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@types/react": "^19.2.7",
+    "gifenc": "^1.0.3",
+    "h264-mp4-encoder": "^1.0.12",
+    "hono": "^4.6.0",
+    "jose": "^5.9.0",
+    "loopwind": "^0.25.6",
+    "nanoid": "^5.0.0",
+    "react": "^19.2.3",
+    "workers-og": "^0.0.27",
+    "zod": "^3.23.0"
+  },
+  "devDependencies": {
+    "@cloudflare/workers-types": "^4.20241230.0",
+    "typescript": "^5.3.3",
+    "wrangler": "^4.0.0"
+  }
+}

package/platform/wrangler.toml

@@ -0,0 +1,43 @@
+name = "loopwind-api"
+main = "src/index.ts"
+compatibility_date = "2024-12-01"
+compatibility_flags = ["nodejs_compat"]
+
+# D1 Database
+[[d1_databases]]
+binding = "DB"
+database_name = "loopwind"
+database_id = "c65f8a95-80eb-4fd1-af25-eb4bc2d7e565"
+
+# R2 Storage
+[[r2_buckets]]
+binding = "ASSETS"
+bucket_name = "loopwind-assets"
+
+[[r2_buckets]]
+binding = "RENDERS"
+bucket_name = "loopwind-renders"
+
+# KV Namespaces
+[[kv_namespaces]]
+binding = "SESSIONS"
+id = "d8d639b6fdef451d9f775d42d49398b3"
+
+[[kv_namespaces]]
+binding = "RATE_LIMIT"
+id = "41204264b9d44b85a96e89f052ad9221"
+
+# Environment variables (set via wrangler secret)
+# GITHUB_CLIENT_ID
+# GITHUB_CLIENT_SECRET
+# JWT_SECRET
+
+[vars]
+ENVIRONMENT = "production"
+API_BASE_URL = "https://loopwind-api.loopwind.dev"
+APP_BASE_URL = "https://app.loopwind.dev"
+
+# Custom domain
+[[routes]]
+pattern = "loopwind-api.loopwind.dev"
+custom_domain = true

package/tests-sdk/createRenderer.test.ts

@@ -0,0 +1,251 @@
+/**
+ * SDK createRenderer() Tests
+ */
+
+import { test, describe } from 'node:test';
+import assert from 'node:assert';
+import { createRenderer, ValidationError } from '../dist/sdk/index.js';
+import React from 'react';
+
+// Test templates
+const OGTemplate = ({ title, tw }: { title: string; tw: (c: string) => any }) => {
+  return React.createElement(
+    'div',
+    { style: tw('w-full h-full bg-blue-500 flex items-center justify-center') },
+    React.createElement('h1', { style: tw('text-white text-4xl') }, title)
+  );
+};
+
+const CardTemplate = ({
+  title,
+  description,
+  tw,
+}: {
+  title: string;
+  description: string;
+  tw: (c: string) => any;
+}) => {
+  return React.createElement('div', { style: tw('w-full h-full bg-white p-8 flex flex-col') }, [
+    React.createElement('h1', { key: 'title', style: tw('text-2xl font-bold text-gray-900') }, title),
+    React.createElement('p', { key: 'desc', style: tw('text-gray-600 mt-2') }, description),
+  ]);
+};
+
+describe('createRenderer()', () => {
+  test('creates a working renderer', async () => {
+    const render = createRenderer({});
+
+    const result = await render(OGTemplate, {
+      props: { title: 'Test' },
+      format: 'png',
+    });
+
+    assert.ok(result instanceof Buffer || result instanceof Uint8Array);
+    assert.ok(result.length > 0);
+  });
+
+  test('uses default dimensions from config', async () => {
+    const render = createRenderer({
+      defaults: {
+        width: 800,
+        height: 400,
+      },
+    });
+
+    const result = await render(OGTemplate, {
+      props: { title: 'Default Size' },
+      format: 'svg',
+    });
+
+    const svgString = result.toString('utf-8');
+    assert.ok(svgString.includes('width="800"'), 'Should use default width from config');
+    assert.ok(svgString.includes('height="400"'), 'Should use default height from config');
+  });
+
+  test('options override config defaults', async () => {
+    const render = createRenderer({
+      defaults: {
+        width: 800,
+        height: 400,
+      },
+    });
+
+    const result = await render(OGTemplate, {
+      props: { title: 'Override Size' },
+      width: 500,
+      height: 250,
+      format: 'svg',
+    });
+
+    const svgString = result.toString('utf-8');
+    assert.ok(svgString.includes('width="500"'), 'Should use overridden width');
+    assert.ok(svgString.includes('height="250"'), 'Should use overridden height');
+  });
+
+  test('uses default format from config', async () => {
+    const render = createRenderer({
+      defaults: {
+        format: 'svg',
+      },
+    });
+
+    const result = await render(OGTemplate, {
+      props: { title: 'Default Format' },
+      width: 100,
+      height: 100,
+    });
+
+    const content = result.toString('utf-8');
+    assert.ok(content.includes('<svg'), 'Should output SVG by default');
+  });
+});
+
+describe('createRenderer() with template registry', () => {
+  test('renders registered template by name', async () => {
+    const render = createRenderer({
+      templates: {
+        'og-image': OGTemplate,
+        'card': CardTemplate,
+      },
+    });
+
+    const result = await render('og-image', {
+      props: { title: 'Named Template' },
+      format: 'svg',
+    });
+
+    const svgString = result.toString('utf-8');
+    assert.ok(svgString.includes('<svg'), 'Should output valid SVG');
+    assert.ok(svgString.length > 100, 'SVG should have content');
+  });
+
+  test('renders different templates by name', async () => {
+    const render = createRenderer({
+      templates: {
+        'og-image': OGTemplate,
+        'card': CardTemplate,
+      },
+    });
+
+    const ogResult = await render('og-image', {
+      props: { title: 'OG Test' },
+      format: 'svg',
+    });
+
+    const cardResult = await render('card', {
+      props: { title: 'Card Title', description: 'Card description' },
+      format: 'svg',
+    });
+
+    // Both should produce valid SVG
+    assert.ok(ogResult.toString('utf-8').includes('<svg'), 'OG template should output SVG');
+    assert.ok(cardResult.toString('utf-8').includes('<svg'), 'Card template should output SVG');
+    // They should be different SVGs
+    assert.notStrictEqual(ogResult.toString('utf-8'), cardResult.toString('utf-8'), 'Different templates should produce different output');
+  });
+
+  test('throws ValidationError for unknown template name', async () => {
+    const render = createRenderer({
+      templates: {
+        'og-image': OGTemplate,
+      },
+    });
+
+    await assert.rejects(
+      async () => {
+        await render('unknown-template', {
+          props: { title: 'Test' },
+          format: 'png',
+        });
+      },
+      (error: any) => {
+        assert.ok(error instanceof ValidationError);
+        assert.strictEqual(error.field, 'template');
+        assert.ok(error.message.includes('unknown-template'));
+        return true;
+      }
+    );
+  });
+
+  test('allows passing template function even with registry', async () => {
+    const render = createRenderer({
+      templates: {
+        'og-image': OGTemplate,
+      },
+    });
+
+    // Should still work with direct template function
+    const result = await render(CardTemplate, {
+      props: { title: 'Direct', description: 'Function' },
+      format: 'svg',
+    });
+
+    const svgString = result.toString('utf-8');
+    assert.ok(svgString.includes('<svg'), 'Should output valid SVG');
+    assert.ok(svgString.length > 100, 'SVG should have content');
+  });
+});
+
+describe('createRenderer() with custom colors', () => {
+  test('applies custom colors via tw()', async () => {
+    const render = createRenderer({
+      colors: {
+        primary: '#ff0000',
+        secondary: '#00ff00',
+      },
+    });
+
+    // Use a simple single-child template to avoid flex requirement
+    const TemplateWithColors = ({ tw }: { tw: (c: string) => any }) => {
+      return React.createElement(
+        'div',
+        { style: tw('w-full h-full bg-red-500 flex items-center justify-center') },
+        React.createElement('span', { style: tw('text-white text-xl') }, 'Colored')
+      );
+    };
+
+    const result = await render(TemplateWithColors, {
+      props: {},
+      format: 'svg',
+    });
+
+    // The SVG should render successfully
+    const svgString = result.toString('utf-8');
+    assert.ok(svgString.includes('<svg'), 'Should output valid SVG');
+  });
+});
+
+describe('createRenderer() reusability', () => {
+  test('can render multiple times with same renderer', async () => {
+    const render = createRenderer({
+      defaults: { width: 400, height: 200 },
+    });
+
+    const results = await Promise.all([
+      render(OGTemplate, { props: { title: 'First' }, format: 'png' }),
+      render(OGTemplate, { props: { title: 'Second' }, format: 'png' }),
+      render(OGTemplate, { props: { title: 'Third' }, format: 'png' }),
+    ]);
+
+    assert.strictEqual(results.length, 3);
+    results.forEach((result, i) => {
+      assert.ok(result.length > 0, `Result ${i + 1} should not be empty`);
+    });
+  });
+
+  test('renderers are independent', async () => {
+    const render1 = createRenderer({
+      defaults: { width: 100, height: 100 },
+    });
+
+    const render2 = createRenderer({
+      defaults: { width: 200, height: 200 },
+    });
+
+    const result1 = await render1(OGTemplate, { props: { title: 'R1' }, format: 'svg' });
+    const result2 = await render2(OGTemplate, { props: { title: 'R2' }, format: 'svg' });
+
+    assert.ok(result1.toString('utf-8').includes('width="100"'));
+    assert.ok(result2.toString('utf-8').includes('width="200"'));
+  });
+});

package/tests-sdk/errors.test.ts

@@ -0,0 +1,230 @@
+/**
+ * SDK Error Classes Tests
+ */
+
+import { test, describe } from 'node:test';
+import assert from 'node:assert';
+import {
+  LoopwindError,
+  ValidationError,
+  FontError,
+  RenderError,
+  TimeoutError,
+  ImageFetchError,
+} from '../dist/sdk/index.js';
+
+describe('LoopwindError', () => {
+  test('creates error with message', () => {
+    const error = new LoopwindError('Test error message');
+
+    assert.ok(error instanceof Error);
+    assert.ok(error instanceof LoopwindError);
+    assert.strictEqual(error.name, 'LoopwindError');
+    assert.strictEqual(error.message, 'Test error message');
+  });
+
+  test('has proper stack trace', () => {
+    const error = new LoopwindError('Stack test');
+
+    assert.ok(error.stack);
+    assert.ok(error.stack.includes('Stack test'));
+  });
+});
+
+describe('ValidationError', () => {
+  test('creates error with all properties', () => {
+    const error = new ValidationError(
+      'Width must be positive',
+      'width',
+      'positive number',
+      -100
+    );
+
+    assert.ok(error instanceof Error);
+    assert.ok(error instanceof LoopwindError);
+    assert.ok(error instanceof ValidationError);
+    assert.strictEqual(error.name, 'ValidationError');
+    assert.strictEqual(error.message, 'Width must be positive');
+    assert.strictEqual(error.field, 'width');
+    assert.strictEqual(error.expected, 'positive number');
+    assert.strictEqual(error.received, -100);
+  });
+
+  test('can be caught as ValidationError', () => {
+    try {
+      throw new ValidationError('Invalid format', 'format', 'png|jpg|svg', 'bmp');
+    } catch (e) {
+      assert.ok(e instanceof ValidationError);
+      if (e instanceof ValidationError) {
+        assert.strictEqual(e.field, 'format');
+        assert.strictEqual(e.expected, 'png|jpg|svg');
+        assert.strictEqual(e.received, 'bmp');
+      }
+    }
+  });
+});
+
+describe('FontError', () => {
+  test('creates error with font name', () => {
+    const error = new FontError('Font not found', 'Inter');
+
+    assert.ok(error instanceof FontError);
+    assert.strictEqual(error.name, 'FontError');
+    assert.strictEqual(error.message, 'Font not found');
+    assert.strictEqual(error.fontName, 'Inter');
+    assert.strictEqual(error.fontPath, undefined);
+  });
+
+  test('creates error with font path', () => {
+    const error = new FontError(
+      'Failed to load font',
+      'CustomFont',
+      '/fonts/custom.woff2'
+    );
+
+    assert.strictEqual(error.fontName, 'CustomFont');
+    assert.strictEqual(error.fontPath, '/fonts/custom.woff2');
+  });
+});
+
+describe('RenderError', () => {
+  test('creates error with stage', () => {
+    const error = new RenderError('JSX rendering failed', 'jsx');
+
+    assert.ok(error instanceof RenderError);
+    assert.strictEqual(error.name, 'RenderError');
+    assert.strictEqual(error.message, 'JSX rendering failed');
+    assert.strictEqual(error.stage, 'jsx');
+    assert.strictEqual(error.cause, undefined);
+  });
+
+  test('creates error with cause', () => {
+    const originalError = new Error('Original error');
+    const error = new RenderError('SVG failed', 'svg', originalError);
+
+    assert.strictEqual(error.stage, 'svg');
+    assert.strictEqual(error.cause, originalError);
+    assert.strictEqual(error.cause?.message, 'Original error');
+  });
+
+  test('supports all stages', () => {
+    const stages = ['jsx', 'svg', 'rasterize', 'encode'] as const;
+
+    stages.forEach(stage => {
+      const error = new RenderError(`Failed at ${stage}`, stage);
+      assert.strictEqual(error.stage, stage);
+    });
+  });
+});
+
+describe('TimeoutError', () => {
+  test('creates error with timeout values', () => {
+    const error = new TimeoutError('Render timed out', 5000, 5123);
+
+    assert.ok(error instanceof TimeoutError);
+    assert.strictEqual(error.name, 'TimeoutError');
+    assert.strictEqual(error.message, 'Render timed out');
+    assert.strictEqual(error.timeout, 5000);
+    assert.strictEqual(error.elapsed, 5123);
+  });
+
+  test('captures accurate timing info', () => {
+    const error = new TimeoutError(
+      'Operation exceeded time limit',
+      30000,
+      30456
+    );
+
+    assert.ok(error.elapsed >= error.timeout);
+  });
+});
+
+describe('ImageFetchError', () => {
+  test('creates error with URL', () => {
+    const error = new ImageFetchError(
+      'Failed to fetch image',
+      'https://example.com/image.png'
+    );
+
+    assert.ok(error instanceof ImageFetchError);
+    assert.strictEqual(error.name, 'ImageFetchError');
+    assert.strictEqual(error.url, 'https://example.com/image.png');
+    assert.strictEqual(error.status, undefined);
+    assert.strictEqual(error.cause, undefined);
+  });
+
+  test('creates error with HTTP status', () => {
+    const error = new ImageFetchError(
+      'Image not found',
+      'https://example.com/missing.png',
+      404
+    );
+
+    assert.strictEqual(error.status, 404);
+  });
+
+  test('creates error with cause', () => {
+    const networkError = new Error('Network error');
+    const error = new ImageFetchError(
+      'Connection failed',
+      'https://example.com/image.png',
+      undefined,
+      networkError
+    );
+
+    assert.strictEqual(error.cause, networkError);
+  });
+
+  test('creates error with all properties', () => {
+    const cause = new Error('SSL certificate error');
+    const error = new ImageFetchError(
+      'SSL error while fetching',
+      'https://example.com/secure.png',
+      0,
+      cause
+    );
+
+    assert.strictEqual(error.url, 'https://example.com/secure.png');
+    assert.strictEqual(error.status, 0);
+    assert.strictEqual(error.cause, cause);
+  });
+});
+
+describe('Error inheritance', () => {
+  test('all errors are instances of Error', () => {
+    const errors = [
+      new LoopwindError('test'),
+      new ValidationError('test', 'field', 'expected', 'received'),
+      new FontError('test', 'font'),
+      new RenderError('test', 'jsx'),
+      new TimeoutError('test', 1000, 1000),
+      new ImageFetchError('test', 'url'),
+    ];
+
+    errors.forEach(error => {
+      assert.ok(error instanceof Error, `${error.name} should be an Error`);
+    });
+  });
+
+  test('all errors are instances of LoopwindError', () => {
+    const errors = [
+      new ValidationError('test', 'field', 'expected', 'received'),
+      new FontError('test', 'font'),
+      new RenderError('test', 'jsx'),
+      new TimeoutError('test', 1000, 1000),
+      new ImageFetchError('test', 'url'),
+    ];
+
+    errors.forEach(error => {
+      assert.ok(error instanceof LoopwindError, `${error.name} should be a LoopwindError`);
+    });
+  });
+
+  test('specific errors are not instances of each other', () => {
+    const validationError = new ValidationError('test', 'field', 'expected', 'received');
+    const fontError = new FontError('test', 'font');
+
+    assert.ok(!(validationError instanceof FontError));
+    assert.ok(!(fontError instanceof ValidationError));
+  });
+});