feat(media): add enrichment metadata fields across admin and public

TODO.md

@@ -140,7 +140,7 @@ This file is the single source of truth for roadmap and delivery progress.
 - [ ] [P1] Page builder with reusable content blocks (hero, rich text, gallery, CTA, forms, price cards)
 - [~] [P1] Navigation management (menus, nested items, order, visibility)
 - [~] [P1] Media library (upload, browse, replace, delete) with media-type classification (artwork, banner, promo, generic, video/gif)
-- [ ] [P1] Media enrichment metadata (alt text, copyright, author, source, tags, licensing, usage context)
+- [x] [P1] Media enrichment metadata (alt text, copyright, author, source, tags, licensing, usage context)
 - [ ] [P1] Portfolio grouping primitives (galleries, albums, categories, tags) with ordering/visibility controls
 - [ ] [P1] Artwork refinement fields (medium, dimensions, year, framing, availability, price visibility)
 - [ ] [P1] Artwork rendition management (thumbnail, card, full, retina/custom sizes)
@@ -190,21 +190,39 @@ This file is the single source of truth for roadmap and delivery progress.
 - [ ] [P2] Add code-level diagrams (Mermaid) for service boundaries and data relationships
 - [ ] [P2] Add route/action inventory for admin and public apps with linked source files
 
-## MVP 1.5: UX/UI And Theming
+## MVP 1.5: MVP1 Refinements (Planned)
 
-### MVP1.5 Suggested Branch Order
+### Scope
 
-- [ ] [P1] `todo/mvp15-design-tokens-foundation`:
+- [ ] [P1] Refine and harden all completed MVP1 modules (pages, navigation, media, portfolio, commissions, news)
+- [ ] [P1] Resolve UX rough edges discovered during MVP1 implementation
+- [ ] [P1] Improve admin workflows and reduce editor friction for daily use
+- [ ] [P1] Stabilize public rendering behavior with better fallbacks and consistency
+
+## MVP 2: MVP1 Quality Refinements (Planned)
+
+### Scope
+
+- [ ] [P1] Finish non-blocking enhancements postponed from MVP1 implementation
+- [ ] [P1] Improve data modeling consistency and migration hygiene for MVP1 modules
+- [ ] [P1] Consolidate reusable UI and domain primitives introduced during MVP1
+- [ ] [P1] Address integration debt before moving to larger design/production phases
+
+## MVP 3: UX/UI And Theming
+
+### MVP3 Suggested Branch Order
+
+- [ ] [P1] `todo/mvp3-design-tokens-foundation`:
   establish shared design tokens (color, spacing, radius, typography scale, motion) in `@cms/ui` and app-level theme contracts
-- [ ] [P1] `todo/mvp15-admin-layout-polish`:
+- [ ] [P1] `todo/mvp3-admin-layout-polish`:
   refine admin shell, navigation hierarchy, spacing rhythm, table/form visual consistency, empty/loading/error states
-- [ ] [P1] `todo/mvp15-public-layout-and-templates`:
+- [ ] [P1] `todo/mvp3-public-layout-and-templates`:
   define public visual direction (hero/header/footer/content widths), page templates for home/content/news/portfolio
-- [ ] [P2] `todo/mvp15-component-library-pass`:
+- [ ] [P2] `todo/mvp3-component-library-pass`:
   align shadcn-based primitives with CMS brand system (buttons, inputs, cards, badges, tabs, dialogs, toasts)
-- [ ] [P2] `todo/mvp15-responsive-and-a11y-pass`:
+- [ ] [P2] `todo/mvp3-responsive-and-a11y-pass`:
   mobile/tablet breakpoints, keyboard flow, focus states, contrast checks, reduced-motion support
-- [ ] [P2] `todo/mvp15-visual-regression-baseline`:
+- [ ] [P2] `todo/mvp3-visual-regression-baseline`:
   add screenshot baselines for critical admin/public routes to guard layout regressions
 
 ### Deliverables
@@ -214,7 +232,7 @@ This file is the single source of truth for roadmap and delivery progress.
 - [ ] [P2] Shared UI primitives are consistent across admin and public apps
 - [ ] [P2] Core routes have visual-regression coverage for the new layout baseline
 
-## MVP 2: Production Readiness
+## MVP 4: Production Readiness
 
 ### Admin App
 
@@ -253,9 +271,9 @@ This file is the single source of truth for roadmap and delivery progress.
 
 ### Testing
 
-- [~] [P1] Testing workstream moved to `MVP 3: Testing and Quality` and temporarily paused to prioritize feature delivery
+- [~] [P1] Testing workstream moved to `MVP 5: Testing and Quality` and temporarily paused to prioritize feature delivery
 
-## MVP 3: Testing and Quality
+## MVP 5: Testing and Quality
 
 ### Status
 
@@ -316,7 +334,7 @@ This file is the single source of truth for roadmap and delivery progress.
 - [2026-02-11] Release workflow now publishes changelog-derived notes to Gitea releases and supports executable production rollback via SSH + compose tag switch.
 - [2026-02-11] Branch protection verification checklist is now documented; final UI-level verification remains environment-specific.
 - [2026-02-11] Added a staging deployment execution checklist and deployment-record template to capture first real-host rollout evidence.
-- [2026-02-11] Artist-focused feature map refined: MVP1 covers portfolio media/domain CRUD + announcements + customer/commission linking; MVP2 covers advanced automation (watermark, palette extraction, media transform pipelines).
+- [2026-02-11] Artist-focused feature map refined: MVP1 covers portfolio media/domain CRUD + announcements + customer/commission linking; MVP4 covers advanced automation (watermark, palette extraction, media transform pipelines).
 - [2026-02-11] `gaertan` inspiration to reuse: S3 object strategy with signed delivery, commission type/options/extras/custom-input modeling, request-status kanban mapping, and gallery rendition/color extraction patterns.
 - [2026-02-11] MVP1 media foundation started: portfolio domain models (`MediaAsset`, `Artwork`, galleries/albums/categories/tags, rendition links) plus initial admin `/media` and `/portfolio` data views.
 - [2026-02-11] `prisma migrate dev --name media_foundation` can fail when DB endpoint is unreachable; apply this named migration once `DATABASE_URL` host is reachable again.
@@ -325,6 +343,7 @@ This file is the single source of truth for roadmap and delivery progress.
 - [2026-02-12] Upload storage is now provider-based (`local` + `s3`) via `CMS_MEDIA_STORAGE_PROVIDER`; admin-side GUI toggle remains a later MVP item.
 - [2026-02-12] Media storage keys now use asset-centric layout (`tenant/<id>/asset/<assetId>/<fileRole>/<assetId>__<variant>.<ext>`) with DB-managed media taxonomy.
 - [2026-02-12] Admin media CRUD now includes list-to-detail flow (`/media/:id`) with metadata edit and delete actions.
+- [2026-02-12] Media enrichment metadata baseline completed: `MediaAsset` now supports licensing/usage/location/captured-at fields across upload input, admin editor, and public artwork detail rendering.
 - [2026-02-12] MVP1 pages/navigation baseline started: `Page`, `NavigationMenu`, and `NavigationItem` models plus admin CRUD routes (`/pages`, `/pages/:id`, `/navigation`).
 - [2026-02-12] Public app now renders CMS-managed navigation (header) and CMS-managed pages by slug (including homepage when `home` page exists).
 - [2026-02-12] Commissions/customer baseline added: admin `/commissions` now supports customer creation, commission intake, status transitions, and a basic kanban board.

apps/admin/src/app/api/media/upload/route.ts

@@ -58,6 +58,22 @@ function parseTags(formData: FormData): string[] {
     .filter((item) => item.length > 0)
 }
 
+function parseOptionalDateField(formData: FormData, field: string): Date | undefined {
+  const value = parseTextField(formData, field)
+
+  if (!value) {
+    return undefined
+  }
+
+  const parsed = new Date(value)
+
+  if (Number.isNaN(parsed.getTime())) {
+    return undefined
+  }
+
+  return parsed
+}
+
 function deriveTitleFromFilename(fileName: string): string {
   const trimmed = fileName.trim()
 
@@ -178,6 +194,11 @@ export async function POST(request: Request): Promise<Response> {
       source: parseOptionalField(formData, "source"),
       copyright: parseOptionalField(formData, "copyright"),
       author: parseOptionalField(formData, "author"),
+      licenseType: parseOptionalField(formData, "licenseType"),
+      licenseUrl: parseOptionalField(formData, "licenseUrl"),
+      usageContext: parseOptionalField(formData, "usageContext"),
+      location: parseOptionalField(formData, "location"),
+      capturedAt: parseOptionalDateField(formData, "capturedAt"),
       tags: parseTags(formData),
       storageKey: stored.storageKey,
       mimeType: fileEntry.type || undefined,

apps/admin/src/app/media/[id]/page.tsx

@@ -50,6 +50,22 @@ function readNullableInt(formData: FormData, field: string): number | null {
   return parsed
 }
 
+function readNullableDate(formData: FormData, field: string): Date | null {
+  const value = readInputString(formData, field)
+
+  if (!value) {
+    return null
+  }
+
+  const parsed = new Date(value)
+
+  if (Number.isNaN(parsed.getTime())) {
+    return null
+  }
+
+  return parsed
+}
+
 function readTags(formData: FormData): string[] {
   const raw = readInputString(formData, "tags")
 
@@ -127,6 +143,11 @@ export default async function MediaAssetEditorPage({ params, searchParams }: Pag
         source: readNullableString(formData, "source"),
         copyright: readNullableString(formData, "copyright"),
         author: readNullableString(formData, "author"),
+        licenseType: readNullableString(formData, "licenseType"),
+        licenseUrl: readNullableString(formData, "licenseUrl"),
+        usageContext: readNullableString(formData, "usageContext"),
+        location: readNullableString(formData, "location"),
+        capturedAt: readNullableDate(formData, "capturedAt"),
         tags: readTags(formData),
         mimeType: readNullableString(formData, "mimeType"),
         width: readNullableInt(formData, "width"),
@@ -320,6 +341,56 @@ export default async function MediaAssetEditorPage({ params, searchParams }: Pag
             </label>
           </div>
 
+          <div className="grid gap-3 md:grid-cols-2">
+            <label className="space-y-1">
+              <span className="text-xs text-neutral-600">License type</span>
+              <input
+                name="licenseType"
+                defaultValue={mediaAsset.licenseType ?? ""}
+                className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+              />
+            </label>
+            <label className="space-y-1">
+              <span className="text-xs text-neutral-600">License URL</span>
+              <input
+                name="licenseUrl"
+                defaultValue={mediaAsset.licenseUrl ?? ""}
+                className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+              />
+            </label>
+          </div>
+
+          <div className="grid gap-3 md:grid-cols-2">
+            <label className="space-y-1">
+              <span className="text-xs text-neutral-600">Usage context</span>
+              <input
+                name="usageContext"
+                defaultValue={mediaAsset.usageContext ?? ""}
+                className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+              />
+            </label>
+            <label className="space-y-1">
+              <span className="text-xs text-neutral-600">Location</span>
+              <input
+                name="location"
+                defaultValue={mediaAsset.location ?? ""}
+                className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+              />
+            </label>
+          </div>
+
+          <label className="space-y-1">
+            <span className="text-xs text-neutral-600">Captured at</span>
+            <input
+              name="capturedAt"
+              type="datetime-local"
+              defaultValue={
+                mediaAsset.capturedAt ? toLocalDateTimeInputValue(mediaAsset.capturedAt) : ""
+              }
+              className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+            />
+          </label>
+
           <div className="grid gap-3 md:grid-cols-3">
             <label className="space-y-1">
               <span className="text-xs text-neutral-600">MIME type</span>

apps/admin/src/app/pages/[id]/page.tsx

@@ -10,6 +10,7 @@ import Link from "next/link"
 import { redirect } from "next/navigation"
 
 import { AdminShell } from "@/components/admin-shell"
+import { PageBlockEditor } from "@/components/pages/page-block-editor"
 import { requirePermissionForRoute } from "@/lib/route-guards"
 
 export const dynamic = "force-dynamic"
@@ -242,16 +243,7 @@ export default async function PageEditorPage({ params, searchParams }: PageProps
             />
           </label>
 
-          <label className="space-y-1">
+          <PageBlockEditor name="content" initialContent={page.content} />
-            <span className="text-xs text-neutral-600">Content</span>
-            <textarea
-              name="content"
-              rows={10}
-              defaultValue={page.content}
-              required
-              className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
-            />
-          </label>
 
           <div className="grid gap-3 md:grid-cols-2">
             <label className="space-y-1">
@@ -368,16 +360,11 @@ export default async function PageEditorPage({ params, searchParams }: PageProps
             />
           </label>
 
-          <label className="space-y-1">
+          <PageBlockEditor
-            <span className="text-xs text-neutral-600">Content</span>
+            name="content"
-            <textarea
+            initialContent={selectedTranslation?.content ?? page.content}
-              name="content"
+            label="Translation Blocks"
-              rows={8}
+          />
-              defaultValue={selectedTranslation?.content ?? page.content}
-              required
-              className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
-            />
-          </label>
 
           <div className="grid gap-3 md:grid-cols-2">
             <label className="space-y-1">

apps/admin/src/components/media/media-upload-form.tsx

@@ -149,6 +149,52 @@ export function MediaUploadForm() {
         </label>
       </div>
 
+      <div className="grid gap-3 md:grid-cols-2">
+        <label className="space-y-1">
+          <span className="text-xs text-neutral-600">License type</span>
+          <input
+            name="licenseType"
+            placeholder="e.g. CC BY-NC 4.0"
+            className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+          />
+        </label>
+        <label className="space-y-1">
+          <span className="text-xs text-neutral-600">License URL</span>
+          <input
+            name="licenseUrl"
+            className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+          />
+        </label>
+      </div>
+
+      <div className="grid gap-3 md:grid-cols-2">
+        <label className="space-y-1">
+          <span className="text-xs text-neutral-600">Usage context</span>
+          <input
+            name="usageContext"
+            placeholder="e.g. homepage hero, social preview"
+            className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+          />
+        </label>
+        <label className="space-y-1">
+          <span className="text-xs text-neutral-600">Location</span>
+          <input
+            name="location"
+            placeholder="e.g. Berlin studio"
+            className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+          />
+        </label>
+      </div>
+
+      <label className="space-y-1">
+        <span className="text-xs text-neutral-600">Captured at</span>
+        <input
+          name="capturedAt"
+          type="datetime-local"
+          className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+        />
+      </label>
+
       <label className="space-y-1">
         <span className="text-xs text-neutral-600">Tags (comma-separated)</span>
         <input name="tags" className="w-full rounded border border-neutral-300 px-3 py-2 text-sm" />

apps/admin/src/components/pages/create-page-form.test.tsx

@@ -11,7 +11,9 @@ describe("CreatePageForm", () => {
 
     expect((screen.getByLabelText("Title") as HTMLInputElement).name).toBe("title")
     expect((screen.getByLabelText("Slug") as HTMLInputElement).name).toBe("slug")
-    expect((screen.getByLabelText("Content") as HTMLTextAreaElement).name).toBe("content")
+    const contentField = document.querySelector('input[name="content"]') as HTMLInputElement | null
+    expect(contentField).not.toBeNull()
+    expect(contentField?.value.startsWith("[")).toBe(true)
 
     const status = screen.getByLabelText("Status") as HTMLSelectElement
     expect(status.value).toBe("draft")

apps/admin/src/components/pages/create-page-form.tsx

@@ -1,5 +1,8 @@
+import { serializePageBlocks } from "@cms/content"
 import { Button } from "@cms/ui/button"
 
+import { PageBlockEditor } from "./page-block-editor"
+
 type CreatePageFormProps = {
   action: (formData: FormData) => void | Promise<void>
 }
@@ -46,15 +49,16 @@ export function CreatePageForm({ action }: CreatePageFormProps) {
         />
       </label>
 
-      <label className="space-y-1">
+      <PageBlockEditor
-        <span className="text-xs text-neutral-600">Content</span>
+        name="content"
-        <textarea
+        initialContent={serializePageBlocks([
-          name="content"
+          {
-          rows={6}
+            id: "initial-rich-text",
-          required
+            type: "rich_text",
-          className="w-full rounded border border-neutral-300 px-3 py-2 text-sm"
+            body: "",
-        />
+          },
-      </label>
+        ])}
+      />
 
       <div className="grid gap-3 md:grid-cols-2">
         <label className="space-y-1">

apps/admin/src/components/pages/page-block-editor.tsx

@@ -0,0 +1,292 @@
+"use client"
+
+import { type PageBlock, type PageBlocks, parsePageBlocks, serializePageBlocks } from "@cms/content"
+import { useMemo, useState } from "react"
+
+type PageBlockEditorProps = {
+  name: string
+  initialContent: string
+  label?: string
+}
+
+function randomId(prefix: string): string {
+  return `${prefix}-${Math.random().toString(36).slice(2, 10)}`
+}
+
+function normalizeInitialBlocks(initialContent: string): PageBlocks {
+  if (!initialContent.trim()) {
+    return [
+      {
+        id: randomId("rich"),
+        type: "rich_text",
+        body: "",
+      },
+    ]
+  }
+
+  try {
+    return parsePageBlocks(initialContent)
+  } catch {
+    return [
+      {
+        id: randomId("rich"),
+        type: "rich_text",
+        body: initialContent,
+      },
+    ]
+  }
+}
+
+function updateBlock(blocks: PageBlocks, blockId: string, next: Partial<PageBlock>): PageBlocks {
+  return blocks.map((block) =>
+    block.id === blockId ? ({ ...block, ...next } as PageBlock) : block,
+  )
+}
+
+export function PageBlockEditor({
+  name,
+  initialContent,
+  label = "Page Blocks",
+}: PageBlockEditorProps) {
+  const [blocks, setBlocks] = useState<PageBlocks>(() => normalizeInitialBlocks(initialContent))
+
+  const serialized = useMemo(() => serializePageBlocks(blocks), [blocks])
+
+  function addBlock(type: PageBlock["type"]) {
+    if (type === "hero") {
+      setBlocks((prev) => [
+        ...prev,
+        {
+          id: randomId("hero"),
+          type,
+          heading: "Hero heading",
+          subheading: null,
+          ctaHref: null,
+          ctaLabel: null,
+        },
+      ])
+      return
+    }
+
+    if (type === "rich_text") {
+      setBlocks((prev) => [...prev, { id: randomId("rich"), type, body: "" }])
+      return
+    }
+
+    if (type === "gallery") {
+      setBlocks((prev) => [...prev, { id: randomId("gallery"), type, title: null, imageIds: [] }])
+      return
+    }
+
+    if (type === "cta") {
+      setBlocks((prev) => [
+        ...prev,
+        { id: randomId("cta"), type, label: "Open", href: "/", variant: "primary" },
+      ])
+      return
+    }
+
+    if (type === "form") {
+      setBlocks((prev) => [
+        ...prev,
+        { id: randomId("form"), type, formKey: "contact", title: null, description: null },
+      ])
+      return
+    }
+
+    setBlocks((prev) => [
+      ...prev,
+      { id: randomId("price"), type: "price_cards", title: null, cards: [] },
+    ])
+  }
+
+  return (
+    <div className="space-y-3 rounded border border-neutral-200 p-3">
+      <input type="hidden" name={name} value={serialized} />
+      <div className="flex flex-wrap items-center gap-2">
+        <span className="text-xs text-neutral-600">{label}</span>
+        <button
+          type="button"
+          className="rounded border px-2 py-1 text-xs"
+          onClick={() => addBlock("hero")}
+        >
+          + Hero
+        </button>
+        <button
+          type="button"
+          className="rounded border px-2 py-1 text-xs"
+          onClick={() => addBlock("rich_text")}
+        >
+          + Rich text
+        </button>
+        <button
+          type="button"
+          className="rounded border px-2 py-1 text-xs"
+          onClick={() => addBlock("gallery")}
+        >
+          + Gallery
+        </button>
+        <button
+          type="button"
+          className="rounded border px-2 py-1 text-xs"
+          onClick={() => addBlock("cta")}
+        >
+          + CTA
+        </button>
+        <button
+          type="button"
+          className="rounded border px-2 py-1 text-xs"
+          onClick={() => addBlock("form")}
+        >
+          + Form
+        </button>
+        <button
+          type="button"
+          className="rounded border px-2 py-1 text-xs"
+          onClick={() => addBlock("price_cards")}
+        >
+          + Price cards
+        </button>
+      </div>
+
+      <div className="space-y-3">
+        {blocks.map((block, index) => (
+          <article key={block.id} className="space-y-2 rounded border border-neutral-200 p-3">
+            <div className="flex items-center justify-between text-xs text-neutral-600">
+              <span>
+                #{index + 1} {block.type}
+              </span>
+              <button
+                type="button"
+                className="rounded border px-2 py-1"
+                onClick={() => setBlocks((prev) => prev.filter((entry) => entry.id !== block.id))}
+              >
+                Remove
+              </button>
+            </div>
+
+            {block.type === "hero" ? (
+              <div className="grid gap-2 md:grid-cols-2">
+                <input
+                  value={block.heading}
+                  onChange={(event) =>
+                    setBlocks((prev) =>
+                      updateBlock(prev, block.id, { heading: event.target.value }),
+                    )
+                  }
+                  placeholder="Heading"
+                  className="rounded border border-neutral-300 px-2 py-1 text-sm"
+                />
+                <input
+                  value={block.subheading ?? ""}
+                  onChange={(event) =>
+                    setBlocks((prev) =>
+                      updateBlock(prev, block.id, { subheading: event.target.value || null }),
+                    )
+                  }
+                  placeholder="Subheading"
+                  className="rounded border border-neutral-300 px-2 py-1 text-sm"
+                />
+              </div>
+            ) : null}
+
+            {block.type === "rich_text" ? (
+              <textarea
+                rows={5}
+                value={block.body}
+                onChange={(event) =>
+                  setBlocks((prev) => updateBlock(prev, block.id, { body: event.target.value }))
+                }
+                placeholder="Text"
+                className="w-full rounded border border-neutral-300 px-2 py-1 text-sm"
+              />
+            ) : null}
+
+            {block.type === "gallery" ? (
+              <textarea
+                rows={3}
+                value={block.imageIds.join(",")}
+                onChange={(event) =>
+                  setBlocks((prev) =>
+                    updateBlock(prev, block.id, {
+                      imageIds: event.target.value
+                        .split(",")
+                        .map((entry) => entry.trim())
+                        .filter((entry) => entry.length > 0),
+                    }),
+                  )
+                }
+                placeholder="Media asset IDs (comma separated UUIDs)"
+                className="w-full rounded border border-neutral-300 px-2 py-1 text-sm"
+              />
+            ) : null}
+
+            {block.type === "cta" ? (
+              <div className="grid gap-2 md:grid-cols-2">
+                <input
+                  value={block.label}
+                  onChange={(event) =>
+                    setBlocks((prev) => updateBlock(prev, block.id, { label: event.target.value }))
+                  }
+                  placeholder="Button label"
+                  className="rounded border border-neutral-300 px-2 py-1 text-sm"
+                />
+                <input
+                  value={block.href}
+                  onChange={(event) =>
+                    setBlocks((prev) => updateBlock(prev, block.id, { href: event.target.value }))
+                  }
+                  placeholder="Link href"
+                  className="rounded border border-neutral-300 px-2 py-1 text-sm"
+                />
+              </div>
+            ) : null}
+
+            {block.type === "form" ? (
+              <input
+                value={block.formKey}
+                onChange={(event) =>
+                  setBlocks((prev) => updateBlock(prev, block.id, { formKey: event.target.value }))
+                }
+                placeholder="Form key (e.g. contact, commission)"
+                className="w-full rounded border border-neutral-300 px-2 py-1 text-sm"
+              />
+            ) : null}
+
+            {block.type === "price_cards" ? (
+              <textarea
+                rows={4}
+                value={block.cards
+                  .map((card) => [card.name, card.price ?? "", card.description ?? ""].join("|"))
+                  .join("\n")}
+                onChange={(event) =>
+                  setBlocks((prev) =>
+                    updateBlock(prev, block.id, {
+                      cards: event.target.value
+                        .split("\n")
+                        .map((line) => line.trim())
+                        .filter((line) => line.length > 0)
+                        .map((line, lineIndex) => {
+                          const [name, price, description] = line
+                            .split("|")
+                            .map((entry) => entry.trim())
+                          return {
+                            id: `card-${lineIndex}`,
+                            name: name || `Card ${lineIndex + 1}`,
+                            price: price || null,
+                            description: description || null,
+                          }
+                        }),
+                    }),
+                  )
+                }
+                placeholder="One card per line: Name|Price|Description"
+                className="w-full rounded border border-neutral-300 px-2 py-1 text-sm"
+              />
+            ) : null}
+          </article>
+        ))}
+      </div>
+    </div>
+  )
+}

apps/web/src/app/[locale]/portfolio/[slug]/page.tsx

@@ -25,6 +25,8 @@ export default async function PublicArtworkPage({ params }: PublicArtworkPagePro
     notFound()
   }
 
+  const primaryMedia = artwork.renditions[0]?.mediaAsset ?? null
+
   return (
     <section className="mx-auto w-full max-w-5xl space-y-6 px-6 py-16">
       <header className="space-y-2">
@@ -94,6 +96,22 @@ export default async function PublicArtworkPage({ params }: PublicArtworkPagePro
             <strong>{t("fields.tags")}:</strong>{" "}
             {formatLabelList(artwork.tagLinks.map((entry) => entry.tag.name))}
           </p>
+          <p>
+            <strong>{t("fields.licenseType")}:</strong> {primaryMedia?.licenseType || "-"}
+          </p>
+          <p>
+            <strong>{t("fields.licenseUrl")}:</strong> {primaryMedia?.licenseUrl || "-"}
+          </p>
+          <p>
+            <strong>{t("fields.usageContext")}:</strong> {primaryMedia?.usageContext || "-"}
+          </p>
+          <p>
+            <strong>{t("fields.location")}:</strong> {primaryMedia?.location || "-"}
+          </p>
+          <p>
+            <strong>{t("fields.capturedAt")}:</strong>{" "}
+            {primaryMedia?.capturedAt ? primaryMedia.capturedAt.toLocaleDateString("en-US") : "-"}
+          </p>
         </div>
       </section>
     </section>

apps/web/src/components/public-page-view.tsx

@@ -1,3 +1,6 @@
+import { parsePageBlocks } from "@cms/content"
+import Image from "next/image"
+
 type PageEntity = {
   title: string
   status: string
@@ -10,6 +13,20 @@ type PublicPageViewProps = {
 }
 
 export function PublicPageView({ page }: PublicPageViewProps) {
+  const blocks = (() => {
+    try {
+      return parsePageBlocks(page.content)
+    } catch {
+      return [
+        {
+          id: "fallback-rich-text",
+          type: "rich_text" as const,
+          body: page.content,
+        },
+      ]
+    }
+  })()
+
   return (
     <article className="mx-auto flex w-full max-w-4xl flex-col gap-6 px-6 py-16">
       <header className="space-y-3">
@@ -18,8 +35,105 @@ export function PublicPageView({ page }: PublicPageViewProps) {
         {page.summary ? <p className="text-neutral-600">{page.summary}</p> : null}
       </header>
 
-      <section className="prose prose-neutral max-w-none whitespace-pre-wrap rounded-xl border border-neutral-200 bg-white p-6 text-neutral-800">
+      <section className="space-y-4 rounded-xl border border-neutral-200 bg-white p-6 text-neutral-800">
-        {page.content}
+        {blocks.map((block) => {
+          if (block.type === "hero") {
+            return (
+              <section key={block.id} className="space-y-2 rounded border border-neutral-200 p-4">
+                <h2 className="text-2xl font-semibold">{block.heading}</h2>
+                {block.subheading ? <p className="text-neutral-600">{block.subheading}</p> : null}
+                {block.ctaLabel && block.ctaHref ? (
+                  <a
+                    href={block.ctaHref}
+                    className="inline-flex rounded bg-neutral-900 px-3 py-1.5 text-sm text-white"
+                  >
+                    {block.ctaLabel}
+                  </a>
+                ) : null}
+              </section>
+            )
+          }
+
+          if (block.type === "rich_text") {
+            return (
+              <section
+                key={block.id}
+                className="prose prose-neutral max-w-none whitespace-pre-wrap"
+              >
+                {block.body}
+              </section>
+            )
+          }
+
+          if (block.type === "gallery") {
+            return (
+              <section key={block.id} className="space-y-3">
+                {block.title ? <h3 className="text-lg font-medium">{block.title}</h3> : null}
+                <div className="grid gap-3 sm:grid-cols-2">
+                  {block.imageIds.length === 0 ? (
+                    <p className="text-sm text-neutral-500">No media linked yet.</p>
+                  ) : (
+                    block.imageIds.map((imageId) => (
+                      <Image
+                        key={imageId}
+                        src={`/api/media/file/${imageId}`}
+                        alt=""
+                        width={1200}
+                        height={800}
+                        className="h-48 w-full rounded border border-neutral-200 object-cover"
+                      />
+                    ))
+                  )}
+                </div>
+              </section>
+            )
+          }
+
+          if (block.type === "cta") {
+            return (
+              <a
+                key={block.id}
+                href={block.href}
+                className={`inline-flex rounded px-3 py-2 text-sm ${
+                  block.variant === "secondary"
+                    ? "border border-neutral-300 text-neutral-800"
+                    : "bg-neutral-900 text-white"
+                }`}
+              >
+                {block.label}
+              </a>
+            )
+          }
+
+          if (block.type === "form") {
+            return (
+              <section key={block.id} className="space-y-2 rounded border border-neutral-200 p-4">
+                <h3 className="text-lg font-medium">{block.title || "Form block"}</h3>
+                <p className="text-sm text-neutral-600">
+                  {block.description || "Form integration pending."}
+                </p>
+                <p className="text-xs text-neutral-500">formKey: {block.formKey}</p>
+              </section>
+            )
+          }
+
+          return (
+            <section key={block.id} className="space-y-2 rounded border border-neutral-200 p-4">
+              {block.title ? <h3 className="text-lg font-medium">{block.title}</h3> : null}
+              <div className="grid gap-3 md:grid-cols-2">
+                {block.cards.map((card) => (
+                  <article key={card.id} className="rounded border border-neutral-200 p-3">
+                    <h4 className="font-medium">{card.name}</h4>
+                    {card.price ? <p className="text-sm text-neutral-700">{card.price}</p> : null}
+                    {card.description ? (
+                      <p className="text-sm text-neutral-600">{card.description}</p>
+                    ) : null}
+                  </article>
+                ))}
+              </div>
+            </section>
+          )
+        })}
       </section>
     </article>
   )

apps/web/src/messages/de.json

@@ -87,7 +87,12 @@
       "galleries": "Galerien",
       "albums": "Alben",
       "categories": "Kategorien",
-      "tags": "Tags"
+      "tags": "Tags",
+      "licenseType": "Lizenztyp",
+      "licenseUrl": "Lizenz-URL",
+      "usageContext": "Nutzungskontext",
+      "location": "Ort",
+      "capturedAt": "Aufgenommen am"
     }
   }
 }

apps/web/src/messages/en.json

@@ -87,7 +87,12 @@
       "galleries": "Galleries",
       "albums": "Albums",
       "categories": "Categories",
-      "tags": "Tags"
+      "tags": "Tags",
+      "licenseType": "License type",
+      "licenseUrl": "License URL",
+      "usageContext": "Usage context",
+      "location": "Location",
+      "capturedAt": "Captured at"
     }
   }
 }

apps/web/src/messages/es.json

@@ -87,7 +87,12 @@
       "galleries": "Galerías",
       "albums": "Álbumes",
       "categories": "Categorías",
-      "tags": "Etiquetas"
+      "tags": "Etiquetas",
+      "licenseType": "Tipo de licencia",
+      "licenseUrl": "URL de licencia",
+      "usageContext": "Contexto de uso",
+      "location": "Ubicación",
+      "capturedAt": "Capturado el"
     }
   }
 }

apps/web/src/messages/fr.json

@@ -87,7 +87,12 @@
       "galleries": "Galeries",
       "albums": "Albums",
       "categories": "Catégories",
-      "tags": "Tags"
+      "tags": "Tags",
+      "licenseType": "Type de licence",
+      "licenseUrl": "URL de licence",
+      "usageContext": "Contexte d'utilisation",
+      "location": "Lieu",
+      "capturedAt": "Capturé le"
     }
   }
 }

packages/content/src/domain-schemas.test.ts

@@ -6,6 +6,8 @@ import {
   createCustomerInputSchema,
   createNavigationMenuInputSchema,
   createPageInputSchema,
+  parsePageBlocks,
+  serializePageBlocks,
   updateCommissionStatusInputSchema,
   updateNavigationItemInputSchema,
 } from "./index"
@@ -64,4 +66,23 @@ describe("domain schemas", () => {
     expect(menu.success).toBe(true)
     expect(navUpdate.success).toBe(false)
   })
+
+  it("parses and serializes page blocks with legacy fallback", () => {
+    const legacy = parsePageBlocks("Legacy body")
+    expect(legacy[0]?.type).toBe("rich_text")
+
+    const serialized = serializePageBlocks([
+      {
+        id: "hero-1",
+        type: "hero",
+        heading: "Hello",
+        subheading: null,
+        ctaLabel: null,
+        ctaHref: null,
+      },
+    ])
+
+    const parsed = parsePageBlocks(serialized)
+    expect(parsed[0]?.type).toBe("hero")
+  })
 })

packages/content/src/media.test.ts

@@ -12,10 +12,14 @@ describe("media schemas", () => {
     const parsed = createMediaAssetInputSchema.parse({
       type: "artwork",
       title: "Artwork",
+      licenseType: "CC BY",
+      usageContext: "homepage hero",
+      capturedAt: new Date("2026-01-02T10:30:00.000Z"),
       tags: ["tag-a"],
     })
 
     expect(parsed.type).toBe("artwork")
+    expect(parsed.licenseType).toBe("CC BY")
     expect(parsed.tags).toEqual(["tag-a"])
   })
 

packages/content/src/media.ts

@@ -20,6 +20,11 @@ export const createMediaAssetInputSchema = z.object({
   source: z.string().max(500).optional(),
   copyright: z.string().max(500).optional(),
   author: z.string().max(180).optional(),
+  licenseType: z.string().max(120).optional(),
+  licenseUrl: z.string().max(500).optional(),
+  usageContext: z.string().max(300).optional(),
+  location: z.string().max(180).optional(),
+  capturedAt: z.date().optional(),
   tags: z.array(z.string().min(1).max(100)).default([]),
   storageKey: z.string().max(500).optional(),
   mimeType: z.string().max(180).optional(),
@@ -38,6 +43,11 @@ export const updateMediaAssetInputSchema = z.object({
   source: z.string().max(500).nullable().optional(),
   copyright: z.string().max(500).nullable().optional(),
   author: z.string().max(180).nullable().optional(),
+  licenseType: z.string().max(120).nullable().optional(),
+  licenseUrl: z.string().max(500).nullable().optional(),
+  usageContext: z.string().max(300).nullable().optional(),
+  location: z.string().max(180).nullable().optional(),
+  capturedAt: z.date().nullable().optional(),
   tags: z.array(z.string().min(1).max(100)).optional(),
   mimeType: z.string().max(180).nullable().optional(),
   width: z.number().int().positive().nullable().optional(),

packages/content/src/pages-navigation.ts

@@ -3,6 +3,98 @@ import { z } from "zod"
 export const pageStatusSchema = z.enum(["draft", "published"])
 export const pageLocaleSchema = z.enum(["de", "en", "es", "fr"])
 
+const pageBlockBaseSchema = z.object({
+  id: z.string().min(1),
+})
+
+export const heroPageBlockSchema = pageBlockBaseSchema.extend({
+  type: z.literal("hero"),
+  heading: z.string().min(1).max(180),
+  subheading: z.string().max(500).nullable().optional(),
+  ctaLabel: z.string().max(80).nullable().optional(),
+  ctaHref: z.string().max(500).nullable().optional(),
+})
+
+export const richTextPageBlockSchema = pageBlockBaseSchema.extend({
+  type: z.literal("rich_text"),
+  body: z.string().min(1),
+})
+
+export const galleryPageBlockSchema = pageBlockBaseSchema.extend({
+  type: z.literal("gallery"),
+  title: z.string().max(180).nullable().optional(),
+  imageIds: z.array(z.string().uuid()).default([]),
+})
+
+export const ctaPageBlockSchema = pageBlockBaseSchema.extend({
+  type: z.literal("cta"),
+  label: z.string().min(1).max(80),
+  href: z.string().max(500),
+  variant: z.enum(["primary", "secondary"]).default("primary"),
+})
+
+export const formPageBlockSchema = pageBlockBaseSchema.extend({
+  type: z.literal("form"),
+  formKey: z.string().min(1).max(120),
+  title: z.string().max(180).nullable().optional(),
+  description: z.string().max(500).nullable().optional(),
+})
+
+export const priceCardsPageBlockSchema = pageBlockBaseSchema.extend({
+  type: z.literal("price_cards"),
+  title: z.string().max(180).nullable().optional(),
+  cards: z
+    .array(
+      z.object({
+        id: z.string().min(1),
+        name: z.string().min(1).max(180),
+        price: z.string().max(80).nullable().optional(),
+        description: z.string().max(500).nullable().optional(),
+      }),
+    )
+    .default([]),
+})
+
+export const pageBlockSchema = z.discriminatedUnion("type", [
+  heroPageBlockSchema,
+  richTextPageBlockSchema,
+  galleryPageBlockSchema,
+  ctaPageBlockSchema,
+  formPageBlockSchema,
+  priceCardsPageBlockSchema,
+])
+
+export const pageBlocksSchema = z.array(pageBlockSchema)
+
+function isJsonLike(value: string): boolean {
+  const trimmed = value.trim()
+  return trimmed.startsWith("{") || trimmed.startsWith("[")
+}
+
+export function parsePageBlocks(content: string): z.infer<typeof pageBlocksSchema> {
+  if (!isJsonLike(content)) {
+    return [
+      {
+        id: "legacy-rich-text",
+        type: "rich_text",
+        body: content,
+      },
+    ]
+  }
+
+  const parsed = JSON.parse(content)
+
+  if (!Array.isArray(parsed)) {
+    throw new Error("Page block payload must be an array.")
+  }
+
+  return pageBlocksSchema.parse(parsed)
+}
+
+export function serializePageBlocks(blocks: z.infer<typeof pageBlocksSchema>): string {
+  return JSON.stringify(pageBlocksSchema.parse(blocks))
+}
+
 export const createPageInputSchema = z.object({
   title: z.string().min(1).max(180),
   slug: z.string().min(1).max(180),
@@ -67,3 +159,5 @@ export type UpsertPageTranslationInput = z.infer<typeof upsertPageTranslationInp
 export type CreateNavigationMenuInput = z.infer<typeof createNavigationMenuInputSchema>
 export type CreateNavigationItemInput = z.infer<typeof createNavigationItemInputSchema>
 export type UpdateNavigationItemInput = z.infer<typeof updateNavigationItemInputSchema>
+export type PageBlock = z.infer<typeof pageBlockSchema>
+export type PageBlocks = z.infer<typeof pageBlocksSchema>

packages/db/prisma/migrations/20260212234000_media_enrichment_metadata/migration.sql

@@ -0,0 +1,6 @@
+ALTER TABLE "MediaAsset"
+  ADD COLUMN "licenseType" TEXT,
+  ADD COLUMN "licenseUrl" TEXT,
+  ADD COLUMN "usageContext" TEXT,
+  ADD COLUMN "location" TEXT,
+  ADD COLUMN "capturedAt" TIMESTAMP(3);

packages/db/prisma/schema.prisma

@@ -123,6 +123,11 @@ model MediaAsset {
   source          String?
   copyright       String?
   author          String?
+  licenseType     String?
+  licenseUrl      String?
+  usageContext    String?
+  location        String?
+  capturedAt      DateTime?
   tags            String[]
   storageKey      String?           @unique
   mimeType        String?

packages/db/src/media-foundation.ts

@@ -484,6 +484,11 @@ export async function getPublishedArtworkBySlug(slug: string) {
               source: true,
               author: true,
               copyright: true,
+              licenseType: true,
+              licenseUrl: true,
+              usageContext: true,
+              location: true,
+              capturedAt: true,
               tags: true,
             },
           },