Schema Pipeline: TypeScript to CMS Form

AstroForge's schema pipeline ensures developers never have to spend time manually configuring CMS forms. The idea is simple: define the organism in TypeScript, and the CMS forms generate themselves.

Source: organism-schemas.ts

src/lib/config/organism-schemas.ts contains field definitions for each organism. An example definition:

Hero: {
  label: 'Hero Section',
  fields: [
    { key: 'badge',    type: 'text',     label: 'Badge' },
    { key: 'headline', type: 'text',     label: 'Headline' },
    { key: 'items',    type: 'repeater', label: 'Items',
      fields: [
        { key: 'title', type: 'text', label: 'Title' }
      ]
    }
  ]
}

What Happens at Build Time?

schema-integration.ts, running as an Astro integration hook, reads organism-schemas.ts and pages.config.ts at the start of every build. It generates src/content/schema/page-*.schema.json files for each page. These are the schema files the CMS uses to build its form UI.

Important: Workflow After a Schema Change

Schema files are generated during the build but not automatically committed to Git. The CMS reads these files directly from GitHub. So for a schema change to reach the CMS, these steps are required:

1. npm run build — schema files are generated
2. git add src/content/schema/ cms.config.json
3. git commit && git push

If this step is skipped, the CMS sees the old schema and new fields don't appear.

Collection Tab Structure

For collection organisms, the schema pipeline automatically generates three tabs: General (title, slug, excerpt, body, thumbnail + organism scalar fields), SEO (meta fields), and additional tabs for organism-specific set/repeater fields. This order is fixed for every collection.