@redneckz/wildless-cms-uni-blocks 0.14.1080 → 0.14.1082

package/src/retail/components/VerifyPhoneDialog/VerifyPhoneDialog.tsx

@@ -1,20 +1,14 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useCallback, useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
-import { useSessionStore } from '@redneckz/uni-jsx/lib/Store/useSessionStore';
+import { useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { type Aspects } from '../../../hooks/useAspects/useAspects';
 import type { OnCloseProps } from '../../../model/OnCloseProps';
-import { useDialog } from '../../../ui-kit/DialogManager/useDialog';
 import { RichText } from '../../../ui-kit/RichText/RichText';
 import { useCountDownTimer } from '../../../ui-kit/TimerCircle/useCountDownTimer';
 import { VerifyPhoneDialogLayout } from '../../../ui-kit/VerifyPhoneDialogLayout/VerfiyPhoneDialogLayout';
 import { formatPhone } from '../../../utils/formatPhone';
 import { noop } from '../../../utils/noop';
-import { sendCode } from '../../api/sendCode';
-import { CaptchaDialog } from '../CaptchaDialog/CaptchaDialog';
-import {
-  TIME_TO_RESEND,
-  useVerifyPhoneDialogSubmit,
-  type SmsCodeStore,
-} from './useVerifyPhoneDialogSubmit';
+import { useSendCode } from '../../hooks/useSendCode';
+import { useVerifyPhoneDialogSubmit } from './useVerifyPhoneDialogSubmit';
 
 const CODE_LENGTH = 4;
 
@@ -24,6 +18,8 @@ export interface VerifyPhoneDialogProps extends OnCloseProps {
   consents?: string[];
   onSuccess?: (smsCode?: string) => void;
   onFail?: () => void;
+  productType?: string;
+  aspects?: Aspects;
 }
 
 export const VerifyPhoneDialog = JSX<VerifyPhoneDialogProps>(
@@ -34,9 +30,10 @@ export const VerifyPhoneDialog = JSX<VerifyPhoneDialogProps>(
     onSuccess = noop,
     onClose = noop,
     onFail = noop,
+    productType,
+    aspects,
   }) => {
     const [values, setValues] = useState<string[]>(Array(CODE_LENGTH).fill('') as string[]);
-    const sessionStore = useSessionStore<SmsCodeStore>();
     const phoneNumber = formatPhone(phone);
 
     const {
@@ -53,28 +50,19 @@ export const VerifyPhoneDialog = JSX<VerifyPhoneDialogProps>(
       phoneNumber,
       onSuccess,
       onFail,
+      productType,
+      aspects,
     });
 
-    const captchaDialog = useDialog(CaptchaDialog);
     const restartTimer = useCountDownTimer({ seconds: timeNextReq, onTick: setTimeNextReq });
 
-    const handleSendCode = useCallback(async () => {
-      const response = await sendCode({
-        phoneNumber,
-        smsCodesSetName: { key: 'AUTHENTICATION' },
-      });
-
-      if (response.ok) {
-        setTimeNextReq(TIME_TO_RESEND);
-        restartTimer(TIME_TO_RESEND);
-        setErrorText('');
-        sessionStore.smsCode = getDefaultSmsCodeParams(phoneNumber);
-      } else if (response.status === 429) {
-        captchaDialog.open({ phoneNumber, sendCode: handleSendCode });
-      } else {
-        onFail();
-      }
-    }, [phoneNumber, restartTimer]);
+    const { handleSendCode, sessionStore } = useSendCode({
+      phoneNumber,
+      restartTimer,
+      setTimeNextReq,
+      setErrorText,
+      onFail,
+    });
 
     useEffect(() => {
       if (!sessionStore.smsCode?.sendTime || sessionStore.smsCode?.phoneNumber !== phoneNumber) {
@@ -102,12 +90,6 @@ export const VerifyPhoneDialog = JSX<VerifyPhoneDialogProps>(
   },
 );
 
-const getDefaultSmsCodeParams = (phoneNumber: string) => ({
-  sendTime: Date.now(),
-  attempts: 0,
-  phoneNumber: phoneNumber,
-});
-
 const renderDescription = (consents?: string[], isRender = false) =>
   isRender ? (
     <RichText itemSize="list-s">

package/src/retail/components/VerifyPhoneDialog/useVerifyPhoneDialogSubmit.tsx

@@ -1,8 +1,12 @@
 import { useCallback, useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
 import { useSessionStore } from '@redneckz/uni-jsx/lib/Store/useSessionStore';
+import { handleAspects } from '../../../hooks/useAspects/handleAspects';
+import { type Aspects } from '../../../hooks/useAspects/useAspects';
+import { type PreventableEventWithTarget } from '../../../ui-kit/PreventableEvent';
 import { getTimer } from '../../../utils/getTimer';
 import { checkCode, type CheckCodeResponse } from '../../api/checkCode';
+import { getAspects } from '../../utils/commonAspects';
 import { saveToken } from '../../utils/saveToken';
 
 export const TIME_TO_RESEND = 180;
@@ -12,6 +16,8 @@ type useVerifyPhoneDialogSubmitProps = {
   phoneNumber: string;
   onSuccess: (smsCode?: string) => void;
   onFail: () => void;
+  productType?: string;
+  aspects?: Aspects;
 };
 
 export interface SmsCodeStore {
@@ -27,6 +33,8 @@ export const useVerifyPhoneDialogSubmit = ({
   phoneNumber,
   onSuccess,
   onFail,
+  productType,
+  aspects,
 }: useVerifyPhoneDialogSubmitProps) => {
   const sessionStore = useSessionStore<SmsCodeStore>();
   const attempts = sessionStore.smsCode?.attempts || 0;
@@ -59,6 +67,13 @@ export const useVerifyPhoneDialogSubmit = ({
       setTimeNextReq(0);
       resetError();
       sessionStore.smsCode = null;
+      if (productType && aspects) {
+        handleAspects({
+          aspectsAttributes: getAspects('smsAuth', productType),
+          aspects,
+          ev: {} as PreventableEventWithTarget,
+        });
+      }
       onSuccess?.(values.join(''));
     } else if (response.status === 403) {
       setErrorText(attempts > 1 ? 'Исчерпан лимит ввода смс-кода' : 'Неверный код');
@@ -66,7 +81,7 @@ export const useVerifyPhoneDialogSubmit = ({
       onFail();
     }
     endLoading();
-  }, [values, attempts]);
+  }, [values, attempts, aspects]);
 
   useEffect(() => {
     if (isTimeExpired) {

package/src/retail/hooks/useSendCode.ts

@@ -0,0 +1,52 @@
+import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { useSessionStore } from '@redneckz/uni-jsx/lib/Store/useSessionStore';
+import { useDialog } from '../../ui-kit/DialogManager/useDialog';
+import { TIME_TO_RESEND } from '../../utils/getTimer';
+import { sendCode } from '../api/sendCode';
+import { CaptchaDialog } from '../components/CaptchaDialog/CaptchaDialog';
+import { type SmsCodeStore } from '../components/VerifyPhoneDialog/useVerifyPhoneDialogSubmit';
+
+interface UseSendCodeProps {
+  phoneNumber: string;
+  restartTimer: (seconds: number) => void;
+  setTimeNextReq: (time: number) => void;
+  setErrorText: (text: string) => void;
+  onFail: () => void;
+}
+
+const getDefaultSmsCodeParams = (phoneNumber: string) => ({
+  sendTime: Date.now(),
+  attempts: 0,
+  phoneNumber: phoneNumber,
+});
+
+export const useSendCode = ({
+  phoneNumber,
+  restartTimer,
+  setTimeNextReq,
+  setErrorText,
+  onFail,
+}: UseSendCodeProps) => {
+  const sessionStore = useSessionStore<SmsCodeStore>();
+  const captchaDialog = useDialog(CaptchaDialog);
+
+  const handleSendCode = useCallback(async () => {
+    const response = await sendCode({
+      phoneNumber,
+      smsCodesSetName: { key: 'AUTHENTICATION' },
+    });
+
+    if (response.ok) {
+      setTimeNextReq(TIME_TO_RESEND);
+      restartTimer(TIME_TO_RESEND);
+      setErrorText('');
+      sessionStore.smsCode = getDefaultSmsCodeParams(phoneNumber);
+    } else if (response.status === 429) {
+      captchaDialog.open({ phoneNumber, sendCode: handleSendCode });
+    } else {
+      onFail();
+    }
+  }, [phoneNumber, restartTimer]);
+
+  return { handleSendCode, sessionStore };
+};

package/src/retail/utils/commonAspects.ts

@@ -54,11 +54,12 @@ const ASPECTS_MAP: Record<string, Record<string, string>> = {
 
 export const getAspects = (aspectType: string, productType?: string): AspectsDef[] => {
   const aspectForType = ASPECTS_MAP[aspectType];
+  const targetName = aspectForType?.[productType || 'default'] || aspectForType?.['default'];
 
   return [
     {
       aspectName: 'ymReachGoal',
-      params: { yandexId: YANDEX_ID, targetName: aspectForType[productType || 'default'] },
+      params: { yandexId: YANDEX_ID, targetName },
     },
   ];
 };

package/src/retail/utils/yandexMetrika.ts

@@ -1,3 +1 @@
-import { projectSettings } from '../../ProjectSettings';
-
-export const YANDEX_ID = projectSettings.YANDEX_METRIKA_ID || '92511315';
+export const YANDEX_ID = '92511315';