import { IconExternalLink } from '@tabler/icons-react'
import { Stack, Text, List, Divider, Group, Anchor } from '@pikku/mantine/core'
import { useI18n } from '@/context/i18n-provider'
import { asI18n } from '@pikku/react'

export default function GetHelp() {
  const t = useI18n()

  return (
    <Stack gap="md">
      <Text mt="md" mb="md">
        {t('jobs.gethelp.description')}
      </Text>

      <List withPadding spacing="xs" mb="md">
        <List.Item>{t('jobs.gethelp.services.explainprocess')}</List.Item>
        <List.Item>{t('jobs.gethelp.services.helpdocuments')}</List.Item>
        <List.Item>{t('jobs.gethelp.services.reviewapplication')}</List.Item>
        <List.Item>{t('jobs.gethelp.services.supportcommunication')}</List.Item>
        <List.Item>{t('jobs.gethelp.services.adviserequirements')}</List.Item>
      </List>

      <Text mb="md" lineBreaks>{t('jobs.gethelp.support')}</Text>

      <Stack gap="md">
        <Stack
          gap="xs"
          pb="md"
          style={{ borderBottom: '1px solid var(--mantine-color-gray-3)' }}
        >
          <Text fw="bold">{t('jobs.gethelp.organizations.dare.name')}</Text>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.dare.phone')}: +49 (0)175 2264572`)}</Text>
          <Text lineBreaks>{asI18n('Whatsapp: +49-17163442306')}</Text>
          <Text size="sm">
            {asI18n(`${t('jobs.gethelp.organizations.dare.email')}: `)}
            <Anchor href="mailto:info@dareconsulting.de" c="primary" fw={700}>
              {asI18n('info@dareconsulting.de')}
            </Anchor>
          </Text>
          <Group gap="xs" align="center">
            <IconExternalLink size={16} />
            <Anchor
              href="https://dareconsulting.de/de/services/#BBeFaP"
              target="_blank"
              rel="noopener noreferrer"
              size="sm"
              c="primary"
              fw={700}
            >
              {t('jobs.gethelp.organizations.bamf.website')}
            </Anchor>
          </Group>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.dare.languages')}: English, German, Spanish`)}</Text>
        </Stack>

        <Stack
          gap="xs"
          pb="md"
          style={{ borderBottom: '1px solid var(--mantine-color-gray-3)' }}
        >
          <Text fw="bold">{t('jobs.gethelp.organizations.bamf.name')}</Text>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.bamf.phone')}: +49 (0) 30 1815 1111`)}</Text>
          <Group gap="xs" align="center">
            <IconExternalLink size={16} />
            <Anchor
              href="https://www.anerkennung-in-deutschland.de/en/contact/recognition"
              target="_blank"
              rel="noopener noreferrer"
              size="sm"
              c="primary"
              fw={700}
            >
              {t('jobs.gethelp.organizations.bamf.contactform')}
            </Anchor>
          </Group>
          <Group gap="xs" align="center">
            <IconExternalLink size={16} />
            <Anchor
              href="https://www.make-it-in-germany.com/en/"
              target="_blank"
              rel="noopener noreferrer"
              size="sm"
              c="primary"
              fw={700}
            >
              {t('jobs.gethelp.organizations.bamf.website')}
            </Anchor>
          </Group>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.bamf.languages')}: English, German`)}</Text>
        </Stack>

        <Stack
          gap="xs"
          pb="md"
          style={{ borderBottom: '1px solid var(--mantine-color-gray-3)' }}
        >
          <Text fw="bold">{t('jobs.gethelp.organizations.gesbit.name')}</Text>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.gesbit.phone')}: +49 (0)30 / 31510900`)}</Text>
          <Group gap="xs" align="center">
            <IconExternalLink size={16} />
            <Anchor
              href="https://gesbit.de/arbeitsmarkt-und-beschaeftigung/hotline-anerkennung-beruflicher-qualifikationen/#c2712"
              target="_blank"
              rel="noopener noreferrer"
              size="sm"
              c="primary"
              fw={700}
            >
              {t('jobs.gethelp.organizations.gesbit.website')}
            </Anchor>
          </Group>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.gesbit.languages')}: Turkish, Ukrainian, English, German`)}</Text>
        </Stack>

        <Stack
          gap="xs"
          pb="md"
          style={{ borderBottom: '1px solid var(--mantine-color-gray-3)' }}
        >
          <Text fw="bold">{t('jobs.gethelp.organizations.clubdialog.name')}</Text>
          <Text size="sm">
            {asI18n(`${t('jobs.gethelp.organizations.clubdialog.email')}: `)}
            <Anchor
              href="mailto:anerkennung@club-dialog.de"
              c="primary"
              fw={700}
            >
              {asI18n('anerkennung@club-dialog.de')}
            </Anchor>
          </Text>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.clubdialog.phone')}: +49 (0)30 / 263 476 05`)}</Text>
          <Group gap="xs" align="center">
            <IconExternalLink size={16} />
            <Anchor
              href="https://anerkennung-berufsqualifikationen-ua.de/"
              target="_blank"
              rel="noopener noreferrer"
              size="sm"
              c="primary"
              fw={700}
            >
              {t('jobs.gethelp.organizations.clubdialog.website')}
            </Anchor>
          </Group>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.clubdialog.languages')}: Russian, Polish, Ukrainian, English, German`)}</Text>
        </Stack>

        <Stack
          gap="xs"
          pb="md"
          style={{ borderBottom: '1px solid var(--mantine-color-gray-3)' }}
        >
          <Text fw="bold">{t('jobs.gethelp.organizations.lared.name')}</Text>
          <Text size="sm">
            {asI18n(`${t('jobs.gethelp.organizations.lared.email')}: `)}
            <Anchor href="mailto:anerkennung@la-red.eu" c="primary" fw={700}>
              {asI18n('anerkennung@la-red.eu')}
            </Anchor>
          </Text>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.lared.phone')}: +49 (0)30 / 457 989 555`)}</Text>
          <Group gap="xs" align="center">
            <IconExternalLink size={16} />
            <Anchor
              href="https://la-red.eu/lara-assessment-and-recognition-of-foreign-qualifications/"
              target="_blank"
              rel="noopener noreferrer"
              size="sm"
              c="primary"
              fw={700}
            >
              {t('jobs.gethelp.organizations.lared.website')}
            </Anchor>
          </Group>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.lared.languages')}: Spanish, French, Italian, Arabic, English, German`)}</Text>
        </Stack>

        <Stack gap="xs">
          <Text fw="bold">{t('jobs.gethelp.organizations.tbb.name')}</Text>
          <Text size="sm">
            {asI18n(`${t('jobs.gethelp.organizations.tbb.email')}: `)}
            <Anchor href="mailto:diploma@tbb-berlin.de" c="primary" fw={700}>
              {asI18n('diploma@tbb-berlin.de')}
            </Anchor>
          </Text>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.tbb.phone')}: +49 (0)30 / 236 233 25`)}</Text>
          <Group gap="xs" align="center">
            <IconExternalLink size={16} />
            <Anchor
              href="https://www.tbb-berlin.de/beratungsangebote/consulting-services/"
              target="_blank"
              rel="noopener noreferrer"
              size="sm"
              c="primary"
              fw={700}
            >
              {t('jobs.gethelp.organizations.tbb.website')}
            </Anchor>
          </Group>
          <Text lineBreaks>{asI18n(`${t('jobs.gethelp.organizations.tbb.languages')}: Turkish, Arabic, Russian, English, German`)}</Text>
        </Stack>
      </Stack>
    </Stack>
  )
}