From 273694731bcfb01c6ba056a76ce558cbc2e05fd8 Mon Sep 17 00:00:00 2001
From: aapolkovsky <aapolkovsky@users.noreply.github.com>
Date: Wed, 13 Mar 2024 12:40:58 +0300
Subject: [PATCH] feat: add forms configs to PageConstructorProvider (#858)

* feat: add forms configs to PageConstructorProvider

* fixup! feat: add forms configs to PageConstructorProvider
---
 src/components/InnerForm/InnerForm.tsx      | 18 ++++++++++++++++--
 src/containers/PageConstructor/Provider.tsx |  8 ++++++++
 src/context/formsContext/FormsContext.ts    | 19 +++++++++++++++++++
 src/context/formsContext/index.ts           |  1 +
 4 files changed, 44 insertions(+), 2 deletions(-)
 create mode 100644 src/context/formsContext/FormsContext.ts
 create mode 100644 src/context/formsContext/index.ts

diff --git a/src/components/InnerForm/InnerForm.tsx b/src/components/InnerForm/InnerForm.tsx
index 18b723f18..d1b7c3188 100644
--- a/src/components/InnerForm/InnerForm.tsx
+++ b/src/components/InnerForm/InnerForm.tsx
@@ -1,6 +1,11 @@
-import React, {useEffect} from 'react';
+import React, {useContext, useEffect} from 'react';
 
 import {YandexForm} from '..';
+import {
+    FormsContext,
+    HubspotFormsContextProps,
+    YandexFormsContextProps,
+} from '../../context/formsContext/FormsContext';
 import {FormBlockData, isHubspotDataForm, isYandexDataForm} from '../../models';
 import {HubspotForm} from '../../sub-blocks';
 
@@ -12,6 +17,7 @@ interface InnerFormProps {
 
 const InnerForm: React.FC<InnerFormProps> = (props) => {
     const {formData, onContentLoad, className} = props;
+    const formsConfig = useContext(FormsContext);
 
     useEffect(() => {
         if (isHubspotDataForm(formData)) {
@@ -21,9 +27,11 @@ const InnerForm: React.FC<InnerFormProps> = (props) => {
 
     if (isYandexDataForm(formData)) {
         const {onLoad, ...rest} = formData.yandex;
+
         return (
             <div className={className}>
                 <YandexForm
+                    {...(formsConfig.yandex as YandexFormsContextProps | undefined)}
                     {...rest}
                     onLoad={() => {
                         onContentLoad();
@@ -35,7 +43,13 @@ const InnerForm: React.FC<InnerFormProps> = (props) => {
     }
 
     if (isHubspotDataForm(formData)) {
-        return <HubspotForm createDOMElement={true} {...formData.hubspot} />;
+        return (
+            <HubspotForm
+                createDOMElement={true}
+                {...(formsConfig.hubspot as HubspotFormsContextProps | undefined)}
+                {...formData.hubspot}
+            />
+        );
     }
 
     return null;
diff --git a/src/containers/PageConstructor/Provider.tsx b/src/containers/PageConstructor/Provider.tsx
index 84961b85c..d0e1bc026 100644
--- a/src/containers/PageConstructor/Provider.tsx
+++ b/src/containers/PageConstructor/Provider.tsx
@@ -2,6 +2,11 @@ import React, {Fragment} from 'react';
 
 import {DEFAULT_THEME} from '../../components/constants';
 import {AnalyticsContext, AnalyticsContextProps} from '../../context/analyticsContext';
+import {
+    DEFAULT_FORMS_CONTEXT_VALUE,
+    FormsContext,
+    FormsContextProps,
+} from '../../context/formsContext/FormsContext';
 import {ImageContext, ImageContextProps} from '../../context/imageContext';
 import {LocaleContext, LocaleContextProps} from '../../context/localeContext';
 import {LocationContext, LocationContextProps} from '../../context/locationContext';
@@ -24,6 +29,7 @@ export interface PageConstructorProviderProps {
     mapsContext?: MapsContextType;
     projectSettings?: ProjectSettingsContextProps;
     analytics?: AnalyticsContextProps;
+    forms?: FormsContextProps;
     image?: ImageContextProps;
 }
 
@@ -39,6 +45,7 @@ export const PageConstructorProvider = (props: WithChildren<PageConstructorProvi
         theme = DEFAULT_THEME,
         children,
         image = {},
+        forms = DEFAULT_FORMS_CONTEXT_VALUE,
     } = props;
 
     /* eslint-disable react/jsx-key */
@@ -51,6 +58,7 @@ export const PageConstructorProvider = (props: WithChildren<PageConstructorProvi
         <MobileContext.Provider value={Boolean(isMobile)} />,
         <MapsContext.Provider value={mapsContext} />,
         <AnalyticsContext.Provider value={analytics} />,
+        <FormsContext.Provider value={forms} />,
         <SSRContext.Provider value={{isServer: ssrConfig?.isServer}} />,
     ].reduceRight((prev, provider) => React.cloneElement(provider, {}, prev), children);
     /* eslint-enable react/jsx-key */
diff --git a/src/context/formsContext/FormsContext.ts b/src/context/formsContext/FormsContext.ts
new file mode 100644
index 000000000..c28cd06fc
--- /dev/null
+++ b/src/context/formsContext/FormsContext.ts
@@ -0,0 +1,19 @@
+import React from 'react';
+
+import {YandexFormProps} from '../../models/constructor-items/common';
+import {HubspotFormProps} from '../../models/constructor-items/sub-blocks';
+
+export const DEFAULT_FORMS_CONTEXT_VALUE: FormsContextProps = {};
+
+export interface FormsContextProps {
+    yandex?: YandexFormsContextProps;
+    hubspot?: HubspotFormsContextProps;
+}
+
+export interface YandexFormsContextProps
+    extends Partial<Pick<YandexFormProps, 'customFormOrigin'>> {}
+
+export interface HubspotFormsContextProps
+    extends Partial<Pick<HubspotFormProps, 'createDOMElement'>> {}
+
+export const FormsContext = React.createContext<FormsContextProps>(DEFAULT_FORMS_CONTEXT_VALUE);
diff --git a/src/context/formsContext/index.ts b/src/context/formsContext/index.ts
new file mode 100644
index 000000000..b4a723c84
--- /dev/null
+++ b/src/context/formsContext/index.ts
@@ -0,0 +1 @@
+export * from './FormsContext';