Компоненты и реестр

Atlas никогда не поставляет компоненты на ваш сайт. Ваши компоненты остаются в вашем репозитории. Контракт сайта сообщает Atlas, какие компоненты существуют и какие поля могут заполнять редакторы.

Как объявляется компонент

Каждый компонент в контракте имеет:

• полный идентификатор, например acme.home.hero, и версию;
• вид: section, block или layout;
• типизированные поля, например heading (текст, обязательное, до 80 символов), image (ресурс) и cta (ссылка).

Редакторы видят форму, построенную из этих полей. Они не могут добавлять поля, вставлять HTML или менять вашу разметку.

Как ваш сайт его отображает

Держите в коде небольшой реестр, сопоставляющий каждый идентификатор компонента с React-компонентом, который его отображает:

atlas/sections.tsx

import { Hero } from '@/components/hero';
import { FeatureGrid } from '@/components/feature-grid';
import type { AtlasSection } from '@/lib/atlas';

const registry = {
  'acme.home.hero': Hero,
  'acme.home.features': FeatureGrid,
} as const;

export function renderSection(
  section: AtlasSection,
  assets: Record<string, { url: string; alt?: string }>,
) {
  const Component = registry[section.component.id as keyof typeof registry];
  if (!Component) return null; // unknown component: skip it, never guess
  return <Component key={section.id} {...section.props} assets={assets} />;
}

Проверяйте свойства, которые получает ваш компонент, так же, как проверяли бы любые внешние данные.

Синхронизация кода и контента

Ваш сайт при запуске сообщает, с какими компонентами он собран (POST /deployments). Studio сравнивает это с активным контрактом и показывает одно из состояний:

Состояние	Значение
In sync	Развёрнутая сборка отображает активный контракт
Missing components	Контракт использует компоненты, которых нет в этой сборке. Сначала разверните код
Different contract	Сборка создана для другой версии контракта
Unknown contract	Atlas никогда не видел контракт, о котором сообщает эта сборка
No contract	Ни один контракт ещё не активен

Релиз в Production нельзя одобрить, пока сайт не синхронизирован. Это не позволяет редакторам использовать компонент, которого ещё нет на действующем сайте.

Добавление нового компонента

1. Создайте и протестируйте компонент в коде вашего сайта.
2. Добавьте его в пакет контракта вместе с его полями, а также в типы страниц, куда редакторы могут его вставлять.
3. Проверьте и предложите контракт. Администратор сайта активирует его.
4. Разверните сайт. Studio покажет In sync.
5. Теперь редакторы могут его использовать.