Collection/Media.ts for PayloiadCMS

Media.ts

import { anyone } from '@/access/anyone'
import { isAdmin } from '@/access/isAdmin'
import { InlineToolbarFeature } from '@payloadcms/richtext-lexical'
import { FixedToolbarFeature } from '@payloadcms/richtext-lexical'
import { lexicalEditor } from '@payloadcms/richtext-lexical'
import type { CollectionConfig } from 'payload'

export const Media: CollectionConfig = {
  slug: 'media',
  access: {
    create: isAdmin,
    read: anyone,
    update: isAdmin,
    delete: isAdmin,
  },
  upload: {
    mimeTypes: ['image/*'],
    adminThumbnail: 'thumbnail',
    focalPoint: true,
    imageSizes: [
      {
        name: 'thumbnail',
        width: 300,
      },
      {
        name: 'square',
        width: 500,
        height: 500,
      },
      {
        name: 'small',
        width: 600,
      },
      {
        name: 'medium',
        width: 900,
      },
      {
        name: 'large',
        width: 1400,
      },
      {
        name: 'xlarge',
        width: 1920,
      },
      {
        name: 'og',
        width: 1200,
        height: 630,
        crop: 'center',
      },
    ],
  },
  fields: [
    {
      name: 'alt',
      type: 'text',
      //required: true,
    },
    {
      name: 'caption',
      type: 'richText',
      editor: lexicalEditor({
        features: ({ rootFeatures }) => {
          return [...rootFeatures, FixedToolbarFeature(), InlineToolbarFeature()]
        },
      }),
    },
    {
      name: 'url',
      type: 'text',
      required: false,
    },
    {
      name: 'filename',
      type: 'text',
      required: false,
    },
    {
      name: 'prefix',
      type: 'text',
      required: false,
    },
    {
      name: 'mimeType',
      type: 'text',
      required: false,
    },
    {
      name: 'filesize',
      type: 'number',
      required: false,
    },
    {
      name: 'width',
      type: 'number',
      required: false,
    },
    {
      name: 'height',
      type: 'number',
      required: false,
    },
  ],
}