import type { Block } from 'payload'

export const BentoRowBlock: Block = {
  slug: 'bentoRow',
  labels: { singular: 'Bento Row (About + Skills)', plural: 'Bento Rows' },
  fields: [
    {
      name: 'aboutHeading',
      type: 'text',
      label: 'About heading',
    },
    {
      name: 'aboutText',
      type: 'textarea',
      label: 'About text',
    },
    {
      name: 'aboutCta',
      type: 'group',
      label: 'About CTA button',
      fields: [
        { name: 'label', type: 'text', label: 'Label', defaultValue: 'Download CV' },
        { name: 'url', type: 'text', label: 'URL' },
        { name: 'newTab', type: 'checkbox', label: 'Open in new tab', defaultValue: true },
      ],
    },
    {
      name: 'skillsHeading',
      type: 'text',
      label: 'Skills heading',
      defaultValue: 'Expertise',
    },
    {
      name: 'skills',
      type: 'array',
      label: 'Skill cards',
      maxRows: 6,
      fields: [
        {
          name: 'icon',
          type: 'text',
          label: 'Tabler icon name (e.g. ti-components)',
          required: true,
        },
        { name: 'title', type: 'text', label: 'Title', required: true },
        { name: 'tags', type: 'text', label: 'Tags (comma separated)', required: true },
      ],
    },
  ],
}
