import type { JSX } from 'react';
import ElixFormsComponentAbstract from '@common/src/ElixFormsComponentAbstract';
import type { IElixFormsComponentCustomFormFieldFactory } from '@common/src/IElixFormsComponentCustomFormFieldFactory';

export default class SceltaCarrieraComponent extends ElixFormsComponentAbstract {
  protected override createCustomFormFields(formFieldFactory: IElixFormsComponentCustomFormFieldFactory): JSX.Element {
    return (
      <>
        {formFieldFactory.createDropdownInput('COL0015', 'COL0015 Goals', [
          { value: 0, label: 'Not applicable' },
          { value: 1, label: 'Goal 1: No poverty' },
          { value: 2, label: 'Goal 2: Zero hunger' },
          { value: 3, label: 'Goal 3: Good health and well-being' },
          { value: 4, label: 'Goal 4: Quality education' },
          { value: 5, label: 'Goal 5: Gender equality' },
          { value: 6, label: 'Goal 6: Clean water and sanitation' },
          { value: 7, label: 'Goal 7: Affordable and clean energy' },
          { value: 8, label: 'Goal 8: Decent work and economic growth' },
          { value: 9, label: 'Goal 9: Industry, Innovation, and Infrastructure' },
          { value: 10, label: 'Goal 10: Reduced inequalities' },
          { value: 11, label: 'Goal 11: Sustainable cities and communities' },
          { value: 12, label: 'Goal 12: Responsible consumption and production' },
          { value: 13, label: 'Goal 13: Climate action' },
          { value: 14, label: 'Goal 14: Life below water' },
          { value: 15, label: 'Goal 15: Life on land' },
          { value: 16, label: 'Goal 16: Peace, justice and strong institutions' },
          { value: 17, label: 'Goal 17: Partnerships for the goals' }
        ], true)}
        {formFieldFactory.createTextInput('COL0002', 'Campo STRING', true)}
        {formFieldFactory.createTextAreaInput('COL0003', 'Campo TEXTAREA', true)}
        {formFieldFactory.createBooleanInput('COL0004', 'Campo BOOLEAN', true)}
        {formFieldFactory.createRadioInput('COL0005', 'Campo RADIO', [
          { value: 1, label: 'Opzione 1' },
          { value: 2, label: 'Opzione 2' },
          { value: 3, label: 'Altra opzione' }
        ], true)}
        {formFieldFactory.createCheckboxInput('COL0006', 'Campo CHECKBOX', [
          { value: 4, label: 'Check 1' },
          { value: 5, label: 'Check 2' },
          { value: 6, label: 'Altro check' }
        ])}
      </>
    );
  }

  protected override renderExtraContentPost(): JSX.Element {
    return <div className="alert alert-info mt-4">Questa pagina è stata ristrutturata con i componenti Bootstrap Italia.</div>;
  }
}