mintel.me/apps/web/src/payload/collections/Media.ts

import type { CollectionConfig } from "payload";
import path from "path";
import { fileURLToPath } from "url";
import { replicateMediaHandler } from "@mintel/payload-ai/endpoints/replicateMediaEndpoint.js";

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

export const Media: CollectionConfig = {
  slug: "media",
  admin: {
    useAsTitle: "alt",
    defaultColumns: ["filename", "alt", "updatedAt"],
  },
  access: {
    read: () => true, // Publicly readable
  },
  endpoints: [
    {
      path: "/:id/ai-process",
      method: "post",
      handler: replicateMediaHandler as any,
    },
  ],
  upload: {
    staticDir: path.resolve(dirname, "../../../../public/media"),
    adminThumbnail: "thumbnail",
    imageSizes: [
      {
        name: "thumbnail",
        width: 400,
        height: 300,
        position: "centre",
      },
      {
        name: "card",
        width: 768,
        height: 1024,
        position: "centre",
      },
      {
        name: "tablet",
        width: 1024,
        height: undefined,
        position: "centre",
      },
    ],
  },
  fields: [
    {
      name: "aiProcessButtons",
      type: "ui",
      admin: {
        components: {
          Field: "@mintel/payload-ai/components/AiMediaButtons#AiMediaButtons",
        },
      },
    },
    {
      name: "alt",
      type: "text",
      required: true,
    },
  ],
};