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

export async function useApplicationFormNavigation(applicationFormId: string) {
  const { getApplicationFormById } = useApplicationForm()

  const { data, error, refresh } = await useAsyncData<ApplicationFormDto>(
    `application-form-${applicationFormId}`,
    async () => await getApplicationFormById(applicationFormId),
    { deep: true }
  )

  if (error.value) {
    throw createError({ statusText: error.value.message })
  }

  const applicationForm = computed<ApplicationFormDto>(() => data?.value as ApplicationFormDto)

  const navigationLinks = computed(() => [
    [
      {
        label: 'Formular',
        icon: 'i-lucide-file',
        to: `/application-forms/${applicationForm.value.id}/0`,
        exact: true
      },
      {
        label: 'Versionen',
        icon: 'i-lucide-file-clock',
        to: `/application-forms/${applicationForm.value.id}/versions`,
        exact: true
      }
    ],
    [
      {
        label: 'PDF-Vorschau',
        icon: 'i-lucide-file-text',
        to: `/api/application-forms/${applicationForm.value.id}/pdf`,
        target: '_blank'
      }
    ]
  ])

  const dropdownItems = [
    [
      {
        label: 'Neuer Mitbestimmungsantrag',
        icon: 'i-lucide-send',
        to: '/create'
      }
    ]
  ]

  function updateApplicationForm(updatedForm: ApplicationFormDto) {
    data.value = updatedForm
  }

  return {
    applicationForm,
    navigationLinks,
    dropdownItems,
    refresh,
    updateApplicationForm,
    error
  }
}