import path from "path";
import { fileURLToPath } from "url";
import type { CollectionConfig } from "payload";
import { isAdmin } from "@/access";

const dirname = path.dirname(fileURLToPath(import.meta.url));

export const Media: CollectionConfig = {
  slug: "media",
  labels: {
    singular: "Bild",
    plural: "Bilder",
  },
  admin: {
    useAsTitle: "alt",
    description: "Bilder für die Website — Alt-Text ist für Barrierefreiheit und SEO Pflicht.",
  },
  access: {
    // Images are public so the website can display them without a login.
    read: () => true,
    create: isAdmin,
    update: isAdmin,
    delete: isAdmin,
  },
  upload: {
    staticDir: path.resolve(dirname, "..", "media"),
    // SVG deliberately excluded: it can carry inline <script>/event-handler
    // payloads that execute if the raw file is ever opened directly (not via
    // <img>) — not currently needed by any part of the site.
    mimeTypes: ["image/jpeg", "image/png", "image/webp"],
    imageSizes: [
      { name: "thumbnail", width: 400, position: "centre" },
      { name: "card", width: 800, position: "centre" },
      { name: "hero", width: 1600, position: "centre" },
    ],
    adminThumbnail: "thumbnail",
    formatOptions: { format: "webp", options: { quality: 82 } },
  },
  fields: [
    {
      name: "alt",
      type: "text",
      label: "Alt-Text",
      required: true,
      admin: {
        description: "Kurze Beschreibung des Bildes für Screenreader und Suchmaschinen.",
      },
    },
    {
      name: "caption",
      type: "textarea",
      label: "Bildbeschreibung",
      admin: {
        description: "Optionale, längere Beschreibung (z. B. für eine Bildunterschrift).",
      },
    },
  ],
};