@bikdotai/bik-widgets 1.0.0 → 1.0.1

package/src/widgets/STW/userDetails.tsx

@@ -1,150 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { STWContext } from './context';
-import UserDetailsForm from '../../components/userDetailsForm/userDetailsForm';
-import { ISTWTemplate } from './stw1';
-import CloseIcon from '../../assets/svg/Close';
-import {
-  BACKGROUND_TYPE,
-  ISTWWidgetCustomisation,
-  ISTWWidgetLeadGeneration,
-  LANGUAGE_VALUES,
-  LANGUAGE_ISO_CODES,
-} from '@bikdotai/bik-models/dm';
-import useIsMobile from '../../hooks/useIsMobile';
-import { ComponentStyleMap, injectFontLink } from '../../utilities/styleUtils';
-import { LanguageUtils } from 'utilities/languageUtilities';
-export interface IPhoneInput {
-  value: string;
-  countryCodeData: {
-    dial: string;
-    code: string;
-  };
-  showComponent: boolean;
-  error: string;
-}
-export interface IEmailInput {
-  value: string;
-  error: string;
-}
-export interface IUserInputs {
-  isWhatsapp?: IPhoneInput;
-  isSms?: IPhoneInput;
-  isEmail?: IEmailInput;
-}
-
-const UserDetails = (props: ISTWTemplate) => {
-  const {
-    claimPrizeHandle,
-    widgetCustomisation,
-    leadGeneration,
-    error,
-    isLoading,
-    onCloseHandle,
-    preview,
-    isMobile,
-    sameMobileNumberTogglers,
-    setSameMobileNumberTogglers,
-    templateName,
-  } = props;
-  const {
-    fontFamily,
-    backgroundType,
-    backgroundColour,
-    backgroundImageDesktop,
-    backgroundImageMobile,
-  } = widgetCustomisation as unknown as ISTWWidgetCustomisation;
-  const [currentStyle, setCurrentStyle] = useState<any>(null);
-  const isMobileDevice = useIsMobile();
-  const languageUtils = new LanguageUtils();
-  const [widgetLanguage, setWidgetLanguage] = useState(LANGUAGE_VALUES.ENGLISH);
-  useEffect(() => {
-    if (fontFamily && fontFamily?.link) {
-      injectFontLink([fontFamily?.link]);
-    }
-  }, [fontFamily]);
-
-  useEffect(() => {
-    if (preview) {
-      if (isMobile) {
-        ComponentStyleMap[templateName]?.userInputPreviewMobile.then(
-          async style => {
-            setCurrentStyle((await style()).default);
-          },
-        );
-      } else {
-        ComponentStyleMap[templateName]?.userInputPreviewDesktop.then(
-          async style => {
-            setCurrentStyle((await style()).default);
-          },
-        );
-      }
-    } else {
-      ComponentStyleMap[templateName]?.globalStyle.then(async style => {
-        setCurrentStyle((await style()).default);
-      });
-    }
-  }, [preview, isMobile]);
-
-  useEffect(() => {
-    const isBikURL =
-      window.location.href?.includes('https://dashboard.bik.ai/') ||
-      window.location.href?.includes('https://staging.dashboard.bik.ai/');
-    const previewLanguage = props?.widgetCustomisation?.previewLanguage;
-    const storeLanguage =
-      (isBikURL ? previewLanguage : window?.Shopify?.locale) ??
-      previewLanguage ??
-      LANGUAGE_ISO_CODES.EN;
-    setWidgetLanguage(languageUtils.getStoreLanguage(storeLanguage));
-  }, [window.location.href, props?.widgetCustomisation?.previewLanguage]);
-
-  if (!currentStyle) {
-    return <></>;
-  }
-
-  return (
-    <div className={currentStyle.bikSpinOverlay}>
-      <div
-        className={currentStyle.bikMainWrapper}
-        id={`bik-stw-${props.id}-user-details-container`}
-      >
-        <div className={currentStyle.bikCloseBtnWrapper}>
-          <div
-            className={currentStyle.bikCloseBtn}
-            onClick={() => onCloseHandle('userDetails')}
-          >
-            <CloseIcon />
-          </div>
-        </div>
-        <div
-          className={currentStyle.bikWrapper}
-          style={
-            backgroundType === BACKGROUND_TYPE.IMAGE
-              ? {
-                  background: `url(${isMobileDevice || isMobile ? backgroundImageMobile : backgroundImageDesktop})`,
-                  backgroundSize: 'contain',
-                  backgroundRepeat: 'round',
-                  backgroundPosition: 'top',
-                }
-              : { backgroundColor: backgroundColour ?? '#ffffff' }
-          }
-        >
-          <STWContext.Provider value={{ preview, isMobile, templateName }}>
-            <UserDetailsForm
-              claimPrizeHandle={claimPrizeHandle}
-              widgetCustomisation={widgetCustomisation}
-              leadGeneration={leadGeneration as ISTWWidgetLeadGeneration}
-              error={error}
-              isLoading={isLoading}
-              templateName={templateName}
-              widgetName={props.widgetName ?? 'Spin_The_Wheel_1'}
-              countryCode={props.countryCode}
-              id={props.id}
-              widgetLanguage={widgetLanguage}
-            />
-          </STWContext.Provider>
-        </div>
-      </div>
-    </div>
-  );
-};
-export default UserDetails;