Add OG Image field to content editor (#328)

* Add OG Image field to content editor

The `_emdash_seo` table and content API already support `seo_image`, but
the admin UI had no way to set it. This adds:

- `SeoImageField` component using the existing `MediaPickerModal`
- 2-column grid layout placing the OG Image next to the Featured Image
- `description` prop on `ImageFieldRenderer` for helper text below images
- Preserve `seo.image` in `SeoPanel.emitChange` so sidebar edits don't
  clear the image

Closes #327

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* style: format

* Add changeset and fix stale seo.image in SeoPanel

- Add changeset for @emdash-cms/admin patch release
- Remove image from SeoPanel.emitChange to avoid overwriting
  a freshly-selected OG image with a stale prop value

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* Address review feedback on OG Image field

- Fix #1: Use @phosphor-icons/react instead of lucide-react
- Fix #2: Send minimal patch { image } instead of spreading stale seo props
- Fix #3: Only show OG Image next to the featured_image field, not all image fields
- Fix #4: Only add description text for the featured_image field
- Fix #5: Add responsive breakpoint (grid-cols-1 md:grid-cols-2)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* style: format

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-authored-by: emdashbot[bot] <emdashbot[bot]@users.noreply.github.com>
Co-authored-by: Matt Kane <mkane@cloudflare.com>
This commit is contained in:
Joost de Valk
2026-04-08 00:14:54 +02:00
committed by GitHub
parent d6cfc437f2
commit 12d73ff456
3 changed files with 144 additions and 20 deletions

View File

@@ -0,0 +1,5 @@
---
"@emdash-cms/admin": patch
---
Add OG Image field to content editor