@redneckz/wildless-cms-uni-blocks 0.14.766 → 0.14.768

package/src/components/ApplicationLeadForm/GroupedConsents.tsx

@@ -0,0 +1,79 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { useCallback, useMemo } from '@redneckz/uni-jsx/lib/hooks';
+import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
+import { type FormFieldRegisterer } from '../../services/retail/external/types';
+import { InputsConsentsMap } from '../../services/retail/inputs';
+import { type LeadFormState } from '../../services/retail/model/LeadFormState';
+import { type FieldRetailDef } from '../../services/retail/model/RetailFormContent';
+import { Button } from '../../ui-kit/Button/Button';
+import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
+import { Foldable } from '../../ui-kit/Foldable/Foldable';
+import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection';
+import { getField } from '../../ui-kit/FormField/getField';
+import { validatorObj } from '../../ui-kit/FormField/getObjectValidator';
+import { ToggleIcon } from '../../ui-kit/Icon/ToggleIcon';
+import { renderErrorText } from '../../ui-kit/Input/renderErrorText';
+import { withValidator } from '../../validation/withValidator';
+
+export interface GroupedConsentsProps {
+  inputs?: FieldRetailDef[];
+  field: FormFieldRegisterer<LeadFormState>;
+}
+
+const CONSENT_ALL_DOCS_TEXT = 'Согласие на все документы';
+const CONSENT_REQUIRED = 'Отметьте все обязательные соглашения';
+
+export const GroupedConsents = JSX<GroupedConsentsProps>(({ inputs = [], field, key }) => {
+  const isChecked = inputs.every((_) => Boolean(field(_.name as keyof LeadFormState).value));
+
+  const handleGeneralToggle = useCallback(
+    (value: boolean) => {
+      for (const item of inputs) {
+        const itemField = field(item.name as keyof LeadFormState);
+        itemField.onChange?.(value);
+      }
+    },
+    [inputs],
+  );
+
+  const hasValidationErrors = useMemo(
+    () =>
+      inputs
+        ?.filter((_) => _.required)
+        ?.some((_) =>
+          Boolean(
+            withValidator(
+              field(_?.name as keyof LeadFormState),
+              validatorObj[_?.name as keyof LeadFormState],
+            ).error,
+          ),
+        ),
+    [inputs],
+  );
+
+  const [isUnfolded, { toggle }] = useBool(true);
+
+  return (
+    <div className="w-fit">
+      <Foldable>
+        <div className="flex items-start">
+          <div>
+            <Checkbox
+              key={key}
+              text={CONSENT_ALL_DOCS_TEXT}
+              value={isChecked}
+              onChange={handleGeneralToggle}
+            />
+            {renderErrorText(hasValidationErrors ? CONSENT_REQUIRED : '')}
+          </div>
+          <Button embedded ariaLabel={CONSENT_ALL_DOCS_TEXT} onClick={toggle}>
+            <ToggleIcon className="p-2xs" iconVersion="color" isUnfolded={isUnfolded} />
+          </Button>
+        </div>
+        <FoldableSection className="flex flex-col pl-2xl" isUnfolded={isUnfolded}>
+          {inputs.map(getField<FieldRetailDef>(field, {}, InputsConsentsMap))}
+        </FoldableSection>
+      </Foldable>
+    </div>
+  );
+});

package/src/components/ApplicationLeadForm/applicationFormData.tsx

@@ -0,0 +1,24 @@
+import { type SectionsRetailProps } from '../../model/InputSectionsType';
+
+export const applicationFormData: SectionsRetailProps[] = [
+  {
+    columns: 2,
+    inputs: [
+      { name: 'surname', required: true, dadata: true },
+      { name: 'name', required: true, dadata: true },
+      { name: 'middleName', dadata: true },
+      { name: 'limitedBirthday', required: true },
+      { name: 'phone', required: true },
+      { name: 'email', required: true, dadata: true },
+    ],
+  },
+  {
+    inputs: [
+      { name: 'processPersonalDataFlg', required: true },
+      { name: 'consentProviderFlg', required: true },
+      { name: 'consentOthersFlg', required: true },
+      { name: 'consentInformFlg' },
+      { name: 'consentPfrFlg' },
+    ],
+  },
+];

package/src/components/ApplicationLeadForm/consents.ts

@@ -0,0 +1,29 @@
+import { type FormRetailConsents } from '../../services/retail/model/LeadFormState';
+
+interface ConsentData {
+  text: string;
+  docId?: number;
+}
+
+export const CONSENTS: Record<keyof FormRetailConsents, ConsentData> = {
+  processPersonalDataFlg: {
+    text: 'Согласие на обработку персональных данных',
+    docId: 4,
+  },
+  consentInformFlg: {
+    text: 'Согласие на информирование о продуктах и услугах Банка',
+    docId: 14,
+  },
+  consentProviderFlg: {
+    text: 'Согласие об использовании простой электронной подписи',
+    docId: 5,
+  },
+  consentOthersFlg: {
+    text: 'Прочие согласия',
+    docId: 1,
+  },
+  consentPfrFlg: {
+    text: 'Согласие на запрос в ПФР',
+    docId: 3,
+  },
+};

package/src/components/ApplicationLeadForm/getInitialFormState.tsx

@@ -0,0 +1,29 @@
+import type { LeadFormState } from '../../services/retail/model/LeadFormState';
+import { type FieldRetailDef } from '../../services/retail/model/RetailFormContent';
+
+const initialFormState = {
+  surname: '',
+  name: '',
+  middleName: '',
+  limitedBirthday: undefined,
+  phone: '',
+  email: '',
+  processPersonalDataFlg: false,
+  consentProviderFlg: false,
+  consentOthersFlg: false,
+  consentInformFlg: false,
+  consentPfrFlg: false,
+};
+
+export const getInitialFormState = (
+  inputs: FieldRetailDef[],
+  savedForm: LeadFormState | null,
+): LeadFormState => {
+  if (savedForm) {
+    return { ...savedForm, limitedBirthday: new Date(savedForm?.limitedBirthday || 0) };
+  }
+
+  const formState = Object.fromEntries(inputs.map((_) => [_.name, initialFormState[_.name || '']]));
+
+  return { ...formState };
+};

package/src/components/ApplicationLeadForm/getLeadFormTaskData.ts

@@ -0,0 +1,66 @@
+/* eslint-disable camelcase */
+import { type MarketingInfo, type UpdateUserTaskBody } from '../../api/RetailAPI/updateUserTask';
+import { locationNavigator } from '../../external/locationNavigator';
+import { type LeadFormState } from '../../services/retail/model/LeadFormState';
+import { formatDate } from '../../utils/formatDate';
+import { formatPhone } from '../../utils/formatPhone';
+import { getParticipantContacts } from '../CreditForm/utils';
+
+type getLeadFormTaskDataProps = {
+  participantId: number;
+  taskId: number;
+  profileId: number;
+  formData: LeadFormState;
+};
+
+export const getLeadFormTaskData = ({
+  participantId,
+  taskId,
+  profileId,
+  formData,
+}: getLeadFormTaskDataProps): UpdateUserTaskBody => {
+  const { name, surname, middleName, limitedBirthday, phone, email } = formData;
+  const navigator = locationNavigator();
+
+  return {
+    sendToBank: true,
+    taskKind: 'SHORT',
+    task: {
+      taskSource: navigator.origin,
+      id: taskId,
+      participants: [
+        {
+          birthDate: limitedBirthday && formatDate(limitedBirthday, true),
+          id: participantId,
+          midname: middleName,
+          name,
+          surname,
+          profile: {
+            id: profileId,
+          },
+          participantContacts: getParticipantContacts({
+            phone: phone && formatPhone(phone),
+            email,
+          }),
+          roleCd: {
+            key: 'BORROWER',
+            value: 'Заемщик',
+          },
+        },
+      ],
+      marketingInfo: getMarketingInfo(),
+    },
+  };
+};
+
+const getMarketingInfo = (): MarketingInfo => {
+  const params = new URLSearchParams(decodeURIComponent(globalThis.location?.search));
+
+  return {
+    utm_campaign: params.get('utm_campaign'),
+    utm_medium: params.get('utm_medium'),
+    utm_source: params.get('utm_source'),
+    utm_content: params.get('utm_content'),
+    utm_term: params.get('utm_term'),
+  };
+};

package/src/components/ApplicationLeadForm/pasreEsiaProfile.ts

@@ -0,0 +1,70 @@
+import { type UpdateProfileEsiaResponse } from '../../api/RetailAPI/updateProfileEsia';
+import { type Address, type LeadFormState } from '../../services/retail/model/LeadFormState';
+import { normalizePhone } from '../../ui-kit/PhoneInput/normalizePhone';
+
+export const parseEsiaProfile = (esiaProfile: UpdateProfileEsiaResponse): LeadFormState => {
+  const { profile, addInfo, document, addressRegistration, addressFact } = esiaProfile;
+
+  return {
+    name: profile?.name,
+    surname: profile?.surname,
+    middleName: profile?.midname,
+    limitedBirthday: profile?.birthDate,
+    phone: normalizePhone(profile?.phone),
+    email: profile?.email,
+    dulIssueDate: document?.dulIssueDate,
+    dulIssuedBy: document?.dulIssuedBy,
+    dulNumber: document?.dulNumber,
+    dulSerie: document?.dulSerie,
+    dulSubdivisionCode: document?.dulSubdivisionCode,
+    snils: addInfo?.snils,
+    birthPlace: addInfo?.birthPlace,
+    addressRegistration: buildAddress(addressRegistration),
+    addressFact: buildAddress(addressFact),
+    esiaAccountTypeCd: profile?.esiaAccountType,
+  };
+};
+
+const concatFullAddress = (address: Array<string | undefined>): string => {
+  return address.reduce((acc: string, value) => {
+    if (value) {
+      return acc ? `${acc}, ${value}` : value;
+    }
+
+    return acc;
+  }, '');
+};
+
+const buildAddress = (fields: UpdateProfileEsiaResponse['addressRegistration']): Address => {
+  const {
+    postcode,
+    region,
+    regionCode,
+    locality,
+    city,
+    street,
+    house,
+    building,
+    block,
+    apartment,
+  } = fields;
+
+  const place = locality || city;
+
+  const fullAddress = concatFullAddress([
+    postcode,
+    region,
+    place,
+    street ? `ул ${street}` : undefined,
+    house ? `д ${house}` : undefined,
+    block ? `к ${block}` : undefined,
+    building ? `стр ${building}` : undefined,
+    apartment ? `кв ${apartment}` : undefined,
+  ]);
+
+  return {
+    ...fields,
+    regionCode: regionCode?.key,
+    fullAddress,
+  };
+};

package/src/components/ApplicationLeadForm/renderAgreementSubmit.tsx

@@ -0,0 +1,28 @@
+import { type FieldProps } from '../../hooks/useForm/useForm';
+import { type LinkProps } from '../../model/LinkProps';
+import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
+import { agreementValidator } from '../../ui-kit/FormField/validators';
+import { renderErrorText } from '../../ui-kit/Input/renderErrorText';
+import { withValidator } from '../../validation/withValidator';
+import { type SubmitButtonProps } from './ApplicationLeadFormContent';
+import { Footnote } from './Footnote';
+import { renderSubmitButton } from './renderSubmitButton';
+
+export const renderAgreementSubmit = (
+  consentDataProcessing?: FieldProps<boolean>,
+  link?: LinkProps,
+  button?: SubmitButtonProps,
+) => (
+  <div className="flex col-span-2 gap-xs flex-col w-full items-baseline">
+    <div>
+      <div className="flex gap-3 items-center">
+        <Checkbox {...consentDataProcessing} />
+        <Footnote link={link} />
+      </div>
+      {consentDataProcessing
+        ? renderErrorText(withValidator(consentDataProcessing, agreementValidator).error)
+        : null}
+    </div>
+    {renderSubmitButton(button)}
+  </div>
+);

package/src/components/ApplicationLeadForm/renderInputs.tsx

@@ -0,0 +1,26 @@
+/* eslint-disable @typescript-eslint/no-unsafe-argument */
+import { InputsApplicationLeadMap } from '../../services/retail/inputs';
+import { type FieldRetailDef } from '../../services/retail/model/RetailFormContent';
+import { getField } from '../../ui-kit/FormField/getField';
+import { CONSENTS } from './consents';
+import { GroupedConsents, type GroupedConsentsProps } from './GroupedConsents';
+
+export const renderInputs = ({ field, inputs }: GroupedConsentsProps) => {
+  const { consentInputs, restInputs } = splitInputs(inputs || []);
+
+  return consentInputs.length > 2 ? (
+    <div>
+      {restInputs.map(getField<FieldRetailDef>(field, {}, { ...InputsApplicationLeadMap }))}
+      <GroupedConsents inputs={consentInputs} field={field} />
+    </div>
+  ) : (
+    (inputs || [])?.map(getField(field, {}, { ...InputsApplicationLeadMap }))
+  );
+};
+
+const splitInputs = (
+  inputs: FieldRetailDef[] = [],
+): { consentInputs: FieldRetailDef[]; restInputs: FieldRetailDef[] } => ({
+  consentInputs: inputs.filter(({ name }) => Object.keys(CONSENTS).includes(String(name))),
+  restInputs: inputs.filter(({ name }) => !Object.keys(CONSENTS).includes(String(name))),
+});

package/src/components/ApplicationLeadForm/renderSubmitButton.tsx

@@ -0,0 +1,8 @@
+import { SubmitButton } from '../../ui-kit/Button/SubmitButton';
+import { type SubmitButtonProps } from './ApplicationLeadFormContent';
+
+export const renderSubmitButton = (button?: SubmitButtonProps, isSending?: boolean) => (
+  <SubmitButton className="w-full @xl:w-auto" isLoading={isSending}>
+    {button?.text ? button.text : 'Отправить заявку'}
+  </SubmitButton>
+);

package/src/components/ApplicationLeadForm/useApplicationLeadApi.tsx

@@ -0,0 +1,141 @@
+import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
+import { createDraftTask } from '../../api/RetailAPI/createDraftTask';
+import { createUserProfile } from '../../api/RetailAPI/createUserProfile';
+import { getLastTaskStatus } from '../../api/RetailAPI/getLastTaskStatus';
+import { getTaskById } from '../../api/RetailAPI/getTaskById';
+import { updateUserProfile } from '../../api/RetailAPI/updateUserProfile';
+import { updateUserTask } from '../../api/RetailAPI/updateUserTask';
+import { type LeadFormState } from '../../services/retail/model/LeadFormState';
+import { getUpdateUserProfileData } from '../../services/retail/utils/getUpdateUserProfile';
+import { useConsentBkiDialog } from '../../ui-kit/ConsentBkiDialog/useConsentBkiDialog';
+import { useDialog } from '../../ui-kit/DialogManager/useDialog';
+import { useDraftDialog } from '../../ui-kit/DraftDialog/useDraftDialog';
+import { useEsiaLoginDialog } from '../../ui-kit/EsiaLoginDialog/useEsiaLoginDialog';
+import { VerifyPhoneDialog } from '../../ui-kit/VerifyPhoneDialog/VerifyPhoneDialog';
+import { formatPhone } from '../../utils/formatPhone';
+import { CONSENTS } from './consents';
+import { getLeadFormTaskData } from './getLeadFormTaskData';
+import { useSaveUserData, type UserData } from './useSaveUserData';
+
+interface ApplicationLeadApiProps {
+  programId: string;
+  nextStepLink: string;
+}
+
+export const useApplicationLeadApi = ({ programId, nextStepLink }: ApplicationLeadApiProps) => {
+  const [isSending, { setTrue: startSending, setFalse: endSending }] = useBool(false);
+  const [ok, setOK] = useState<boolean | undefined>();
+  const saveUserData = useSaveUserData();
+
+  const openEsiaLoginDialog = useEsiaLoginDialog(nextStepLink);
+  const consentBkiDialog = useConsentBkiDialog(openEsiaLoginDialog);
+  const verifyPhoneDialog = useDialog(VerifyPhoneDialog);
+  const draftDialog = useDraftDialog();
+
+  const handleSubmit = useCallback(async (formData: LeadFormState) => {
+    try {
+      startSending();
+      const profileId = await createUserProfile({
+        profile: { phone: formatPhone(formData.phone as string) },
+      });
+
+      if (profileId && formData?.phone) {
+        const sendCurrentTask = async () => {
+          await updateUserData({
+            programId,
+            profileId,
+            formData,
+            saveUserData,
+          });
+          verifyPhoneDialog.close();
+          consentBkiDialog.open(formData.phone, profileId);
+        };
+        const handleSuccessVerify = async () => {
+          try {
+            const lastTaskId = await getLastTaskStatus({ profileId, programId });
+
+            if (lastTaskId) {
+              const task = await getTaskById({ taskId: lastTaskId });
+              verifyPhoneDialog.close();
+              draftDialog.open({
+                task,
+                isFromLead: true,
+                onClose: sendCurrentTask,
+              });
+            } else {
+              await sendCurrentTask();
+            }
+          } catch {
+            setOK(false);
+          }
+        };
+
+        const acceptedConsents = getAcceptedConsents(formData);
+
+        verifyPhoneDialog.open({
+          phone: formData?.phone,
+          consents: acceptedConsents,
+          onSuccess: handleSuccessVerify,
+        });
+        endSending();
+      }
+    } catch {
+      setOK(false);
+    }
+  }, []);
+
+  return { isSending, ok, handleSubmit };
+};
+
+const getAcceptedConsents = (formData: LeadFormState): string[] =>
+  Object.keys(CONSENTS)
+    .filter((_) => formData[_])
+    .map((_) => CONSENTS[_]?.text);
+
+const updateUserData = async ({
+  programId,
+  profileId,
+  formData,
+  saveUserData,
+}: {
+  programId: string;
+  profileId: number;
+  formData: LeadFormState;
+  saveUserData: (userData: UserData) => void;
+}) => {
+  const transformedForm = transformOtherConsentsField(formData);
+
+  await updateUserProfile(getUpdateUserProfileData(profileId, transformedForm));
+
+  const { taskId, participantId } = await createDraftTask({
+    profileId,
+    programId,
+  });
+
+  try {
+    await updateUserTask(
+      getLeadFormTaskData({
+        participantId,
+        taskId,
+        profileId,
+        formData: transformedForm,
+      }),
+    );
+  } catch (ex) {
+    console.log(ex);
+  }
+
+  saveUserData({ participantId, taskId, profileId, programId, formData });
+};
+
+const transformOtherConsentsField = (formData: LeadFormState): LeadFormState => {
+  const { consentOthersFlg, ...form } = formData;
+
+  return {
+    ...form,
+    consentCollectionFlg: consentOthersFlg,
+    consentAssignmentClaimsFlg: consentOthersFlg,
+    consentPhotoFlg: consentOthersFlg,
+  };
+};

package/src/components/ApplicationLeadForm/useInitApplicationLead.ts

@@ -0,0 +1,71 @@
+import { useCallback, useEffect, useMemo } from '@redneckz/uni-jsx/lib/hooks';
+import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
+import { updateProfileEsia } from '../../api/RetailAPI/updateProfileEsia';
+import { locationNavigator } from '../../external/locationNavigator';
+import { useSetter } from '../../hooks/useSetter';
+import { type LeadFormState } from '../../services/retail/model/LeadFormState';
+import { type FieldRetailDef } from '../../services/retail/model/RetailFormContent';
+import { safeJsonParse } from '../../utils/safeJsonParse';
+import { getInitialFormState } from './getInitialFormState';
+import { parseEsiaProfile } from './pasreEsiaProfile';
+import { useLeadFormStore } from './useLeadFormStore';
+
+export const useInitApplicationLead = (
+  inputs: FieldRetailDef[],
+  nextStepLink: string,
+): [LeadFormState, { isLoading: boolean }] => {
+  const navigator = locationNavigator();
+  const [isLoading, { setTrue: startLoading, setFalse: endLoading }] = useBool(false);
+
+  const leadFormStore = useLeadFormStore();
+  const saveForm = useSetter(leadFormStore, 'leadForm');
+
+  const initialFormState = useMemo(
+    () => getInitialFormState(inputs, leadFormStore.leadForm),
+    [inputs, leadFormStore.leadForm],
+  );
+
+  const updateEsiaProfile = useCallback(
+    async (profileId: string, code: string, state: string) => {
+      startLoading();
+      try {
+        const data = await updateProfileEsia({
+          profileId,
+          code,
+          state,
+          redirectUri: globalThis.location?.href,
+        });
+
+        if (data) {
+          saveForm((_) => ({
+            ..._,
+            ...parseEsiaProfile(data),
+          }));
+        }
+
+        navigator.assign(nextStepLink);
+      } finally {
+        endLoading();
+      }
+    },
+    [nextStepLink],
+  );
+
+  useEffect(() => {
+    const profileId: string = <string>(
+      safeJsonParse(globalThis.localStorage?.getItem('profileId') ?? '')
+    );
+    const params = new URLSearchParams(decodeURIComponent(globalThis.location?.search));
+    const code = params.get('code');
+    const state = params.get('state');
+
+    if (profileId && code && state) {
+      updateEsiaProfile(profileId, code, state);
+    } else {
+      sessionStorage.removeItem('accessToken');
+      sessionStorage.removeItem('refreshToken');
+    }
+  }, []);
+
+  return [initialFormState, { isLoading }];
+};

package/src/components/ApplicationLeadForm/useLeadFormStore.ts

@@ -0,0 +1,12 @@
+import { useLocalStore } from '@redneckz/uni-jsx/lib/Store/useLocalStore';
+import { type LeadFormState } from '../../services/retail/model/LeadFormState';
+
+export interface LeadFormStoreSlice {
+  leadForm: LeadFormState;
+  taskId: number;
+  profileId: number;
+  participantId: number;
+  programId: string;
+}
+
+export const useLeadFormStore = () => useLocalStore<LeadFormStoreSlice>();

package/src/components/ApplicationLeadForm/useSaveUserData.ts

@@ -0,0 +1,27 @@
+import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { type LeadFormState } from '../../services/retail/model/LeadFormState';
+import { useLeadFormStore } from './useLeadFormStore';
+
+export interface UserData {
+  participantId: number;
+  taskId: number;
+  profileId: number;
+  programId: string;
+  formData: LeadFormState;
+}
+export const useSaveUserData = () => {
+  const leadFormStore = useLeadFormStore();
+
+  const saveUserData = useCallback(
+    ({ participantId, taskId, profileId, programId: programNumber, formData }: UserData) => {
+      leadFormStore.participantId = participantId;
+      leadFormStore.taskId = taskId;
+      leadFormStore.profileId = profileId;
+      leadFormStore.programId = programNumber;
+      leadFormStore.leadForm = formData;
+    },
+    [],
+  );
+
+  return saveUserData;
+};

package/src/components/Blocks.mobile.ts

@@ -2,6 +2,7 @@ import { type BlocksRegistry } from '../model/BlocksRegistry';
 
 import { AdTile } from './AdTile/AdTile';
 import { ApplicationForm } from './ApplicationForm/ApplicationForm';
+import { ApplicationLeadForm } from './ApplicationLeadForm/ApplicationLeadForm';
 import { BankAccountFiltration } from './BankAccountFiltration/BankAccountFiltration';
 import { BenefitsBlock } from './BenefitsBlock/BenefitsBlock';
 import { BonusBenefitsBlock } from './BonusBenefitsBlock/BonusBenefitsBlock';
@@ -18,6 +19,8 @@ import { CarouselCatalogCard } from './CarouselCatalogCard/CarouselCatalogCard';
 import { CarouselLinks } from './CarouselLinks/CarouselLinks';
 import { CarouselRecommendationCard } from './CarouselRecommendationCard/CarouselRecommendationCard';
 import { CarouselTariffsCard } from './CarouselTariffsCard/CarouselTariffsCard';
+import { CreditCardForm } from './CreditCardForm/CreditCardForm';
+import { CreditForm } from './CreditForm/CreditForm';
 import { DepositFiltration } from './DepositFiltration/DepositFiltration';
 import { Depository } from './Depository/Depository';
 import { ErrorBlock } from './ErrorBlock/ErrorBlock';
@@ -50,6 +53,7 @@ import { VerticalLayout } from './VerticalLayout/VerticalLayout';
 export const Blocks: BlocksRegistry = {
   AdTile,
   ApplicationForm,
+  ApplicationLeadForm,
   BankAccountFiltration,
   BenefitsBlock,
   BonusBenefitsBlock,
@@ -66,6 +70,8 @@ export const Blocks: BlocksRegistry = {
   CarouselLinks,
   CarouselRecommendationCard,
   CarouselTariffsCard,
+  CreditCardForm,
+  CreditForm,
   DepositFiltration,
   Depository,
   ErrorBlock,