import React from 'react';
import ModalForm from '../components/ModalForm'
import { Widget } from '@rjsf/core';
import { jsonSchema as formSchema, uiSchema } from '../schema/callback'
// The type reassignment made because of a bug:
const jsonSchema: any = formSchema
import MaskedPhoneWidget from '../widgets/MaskedPhoneWidget'
import CheckboxRichTextLabelWidget from '../widgets/CheckboxRichTextLabelWidget'
const widgets: { [name: string]: Widget } = {...MaskedPhoneWidget, ...CheckboxRichTextLabelWidget }
import { phoneErrorMessage } from '../validation/phoneValidation';
import { CallbackErrorListTemplate } from '../validation/ErrorListTemplates';

function CallbackForm(props: any) {
  return <>
    <ModalForm
      formTitle="Онлайн консультация"
      formName="callback"
      formBuilder={{
        schema: jsonSchema,
        uiSchema: uiSchema,
        widgets: widgets,
        transformErrors: phoneErrorMessage,
        ErrorList: CallbackErrorListTemplate,
      }}
      formTriggers={[
        // GLOBAL PORTALS
        {
          condition: true,
          targetContainerId: "headerFormTrigger",
          containerClass: "form-trigger-el",
          title: "Задать вопрос",
          ctaScr: "Шапка",
        },
        {
          condition: true,
          targetContainerId: "footerFormTrigger",
          containerClass: "form-trigger-el",
          title: "Онлайн консультация",
          ctaScr: "Подвал",
        },
        // Per page portals
        {
          condition: (location.pathname === "/" ),
          targetContainerId: "welcomeFormTrigger",
          containerClass: "form-trigger-el",
          title: "Заполнить анкету",
          ctaScr: "Главная страница: список орг-й",
        },
        {
          condition: (location.pathname.search('/companies') !== -1),
          targetContainerId: "companiesFormTrigger",
          containerClass: "form-trigger-el",
          title: "Заполнить анкету",
          ctaScr: "/companies org list",
        },
        {
          condition: Boolean(document.querySelector('.company-page')),
          targetContainerId: "companyFormTrigger",
          containerClass: "form-trigger-el",
          title: "Обратный звонок",
          ctaScr: "Страница компании",
        },
      ]}
    />
  </>
}

export default CallbackForm