import type { ApplicationFormDto, CreateFormElementDto, FormElementDto } from '~~/.api-client'

export function useFormElementManagement() {
  const applicationForm = useApplicationForm()

  async function addFormElementToSubSection(
    applicationFormId: string | undefined,
    subsectionId: string,
    formElements: FormElementDto[],
    position: number
  ): Promise<ApplicationFormDto | undefined> {
    const inputFormElement: CreateFormElementDto = {
      title: 'Formular ergänzen',
      description: 'Bitte fügen Sie hier Ihre Ergänzungen ein.',
      options: [
        {
          value: '|||',
          label: '',
          processingPurpose: 'NONE',
          employeeDataCategory: 'NONE'
        }
      ],
      type: 'TITLE_BODY_TEXTFIELDS'
    }

    if (applicationFormId) {
      try {
        return await applicationForm.addFormElementToSubSection(applicationFormId, subsectionId, inputFormElement, position + 1)
      } catch (error) {
        console.error('Failed to add form element:', error)
        throw error
      }
    } else {
      // @ts-expect-error Add CreateFormElementDto to formElements array. ID will be generated by the backend.
      formElements.splice(position + 1, 0, inputFormElement)
      return undefined
    }
  }

  return {
    addFormElementToSubSection
  }
}