@redneckz/wildless-cms-uni-blocks 0.14.1076 → 0.14.1078

package/mobile/src/retail/components/ConsentBkiDialog/useConsentBkiDialog.tsx

@@ -1,6 +1,10 @@
+import { handleAspects } from '../../../hooks/useAspects/handleAspects';
+import { useAspects, type Aspects } from '../../../hooks/useAspects/useAspects';
 import { useDialog } from '../../../ui-kit/DialogManager/useDialog';
+import { type PreventableEventWithTarget } from '../../../ui-kit/PreventableEvent';
 import { updateUserProfile } from '../../api/updateUserProfile';
 import { updateUserTask } from '../../api/updateUserTask';
+import { getAspects } from '../../utils/commonAspects';
 import { VerifyPhoneDialog } from '../VerifyPhoneDialog/VerifyPhoneDialog';
 import { ConsentBkiDialog } from './ConsentBkiDialog';
 
@@ -10,71 +14,109 @@ type SubmitBkiConsentProps = {
   onFail?: () => void;
   taskId?: number;
   participantId?: string | number;
+  productType?: string;
 };
 
-export const useConsentBkiDialog = (onClose: () => void) => {
-  const { open } = useDialog(ConsentBkiDialog);
-  const verifyPhoneDialog = useDialog(VerifyPhoneDialog);
+interface HandleSuccessVerifyParams {
+  profileId?: number;
+  taskId?: number;
+  participantId?: string | number;
+  aspects: Aspects;
+  onClose: () => void;
+  productType?: string;
+}
+
+interface HandleSubmitBkiConsentParams {
+  submitProps: SubmitBkiConsentProps;
+  verifyPhoneDialog: any;
+  aspects: Aspects;
+  onClose: () => void;
+}
 
-  const handleSuccessVerify =
-    (profileId?: number, taskId?: number, participantId?: string | number) =>
-    async (smsCode?: string) => {
-      try {
-        if (profileId) {
-          await updateUserProfile({
-            profile: {
-              id: profileId,
+const createHandleSuccessVerify =
+  ({
+    profileId,
+    taskId,
+    participantId,
+    aspects,
+    onClose,
+    productType,
+  }: HandleSuccessVerifyParams) =>
+  async (smsCode?: string) => {
+    try {
+      if (profileId) {
+        await updateUserProfile({
+          profile: {
+            id: profileId,
+            consentBkiFlg: true,
+            smsConsentBki: smsCode,
+          },
+        });
+      } else if (taskId && participantId) {
+        await updateUserTask({
+          task: {
+            id: taskId,
+            participant: {
+              id: participantId,
               consentBkiFlg: true,
               smsConsentBki: smsCode,
             },
-          });
-        } else if (taskId && participantId) {
-          await updateUserTask({
-            task: {
-              id: taskId,
-              participant: {
-                id: participantId,
-                consentBkiFlg: true,
-                smsConsentBki: smsCode,
-              },
-            },
-            sendToBank: false,
-            taskKind: 'SHORT',
-          });
-        }
-
-        onClose();
-      } catch (ex) {
-        console.log(ex);
-      }
-    };
-
-  const handleSubmitBkiConsent =
-    ({ phone, profileId, onFail, taskId, participantId }: SubmitBkiConsentProps) =>
-    async (confirmStatus: string) => {
-      if (confirmStatus === 'SIGNED' && phone) {
-        verifyPhoneDialog.open({
-          phone,
-          consents: ['согласие на запрос информации в БКИ'],
-          onSuccess: handleSuccessVerify(profileId, taskId, participantId),
-          onFail,
+          },
+          sendToBank: false,
+          taskKind: 'SHORT',
         });
-      } else {
-        onClose();
       }
-    };
+      handleAspects({
+        aspectsAttributes: getAspects('smsBki', productType),
+        aspects,
+        ev: {} as PreventableEventWithTarget,
+      });
 
-  return {
-    open: ({ phone, profileId, onFail, taskId, participantId }: SubmitBkiConsentProps) =>
-      open({
-        onSubmit: handleSubmitBkiConsent({
-          phone,
+      onClose();
+    } catch (ex) {
+      console.log(ex);
+    }
+  };
+
+const createHandleSubmitBkiConsent =
+  ({ submitProps, verifyPhoneDialog, aspects, onClose }: HandleSubmitBkiConsentParams) =>
+  async (confirmStatus: string) => {
+    const { phone, profileId, onFail, taskId, participantId, productType } = submitProps;
+    if (confirmStatus === 'SIGNED' && phone) {
+      verifyPhoneDialog.open({
+        phone,
+        consents: ['согласие на запрос информации в БКИ'],
+        onSuccess: createHandleSuccessVerify({
           profileId,
-          onFail,
           taskId,
           participantId,
+          aspects,
+          onClose,
+          productType,
+        }),
+        onFail,
+      });
+    } else {
+      onClose();
+    }
+  };
+
+export const useConsentBkiDialog = (onClose: () => void, productType?: string) => {
+  const { open } = useDialog(ConsentBkiDialog);
+  const verifyPhoneDialog = useDialog(VerifyPhoneDialog);
+  const aspects = useAspects();
+
+  return {
+    open: ({ phone, profileId, onFail, taskId, participantId }: SubmitBkiConsentProps) =>
+      open({
+        onSubmit: createHandleSubmitBkiConsent({
+          submitProps: { phone, profileId, onFail, taskId, participantId, productType },
+          verifyPhoneDialog,
+          aspects,
+          onClose,
         }),
         onClose,
+        productType,
       }),
   };
 };

package/mobile/src/retail/components/DraftDialog/DraftActionButton.tsx

@@ -1,9 +1,11 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { type IconName } from '../../../icons/IconName';
+import { type AspectsDef } from '../../../model/AspectsProps';
 import { type DescriptionProps, type TitleProps } from '../../../model/HeadlineType';
 import type { OnClickProps } from '../../../model/OnClickProps';
 import { Img } from '../../../ui-kit/Img/Img';
 import { Text } from '../../../ui-kit/Text/Text';
+import { getAspectsAttributes } from '../../../utils/dataAttributes';
 import { noop } from '../../../utils/noop';
 
 export type DraftActionButtonProps = TitleProps &
@@ -11,15 +13,18 @@ export type DraftActionButtonProps = TitleProps &
   OnClickProps & {
     icon: IconName;
     name?: string;
+    data?: AspectsDef[];
   };
 
 export const DraftActionButton = JSX<DraftActionButtonProps>(
-  ({ title, icon, description, name, onClick = noop }) => (
+  ({ title, icon, description, name, onClick = noop, data }) => (
     <button
       className="flex gap-lg items-center border border-gray/30 rounded-xl cursor-pointer p-4 hover:border-green"
       type="button"
       onClick={onClick}
       data-test-id={name}
+      // eslint-disable-next-line react/jsx-props-no-spreading
+      {...getAspectsAttributes(data)}
     >
       <Img image={{ icon, iconVersion: 'normal' }} width="78" height="78" />
       <div className="flex flex-col items-start gap-xs md:w-72 md:mr-lg">

package/mobile/src/retail/components/DraftDialog/DraftDialog.tsx

@@ -9,6 +9,7 @@ import { sendMessage } from '../../api/sendMessage';
 import { useRetailFormStore } from '../../hooks/useRetailFormStore';
 import { type DraftTaskType } from '../../model/DraftTaskType';
 import { checkNewMicroservice } from '../../utils/checkNewMicroservice';
+import { getAspects } from '../../utils/commonAspects';
 import { creditProgramCodeToProductIdMap, getCreditProgramTaskType } from './creditProgramCodes';
 import { DraftDialogContent } from './DraftDialogContent';
 import { parseDraftTask } from './parseDraftTask';
@@ -40,6 +41,7 @@ export const DraftDialog = JSX<DraftDialogProps>(function ({
   );
   const currentParticipant = participant || participants?.[0];
   const { id: participantId, profile } = currentParticipant || {};
+
   const handleGoToDraft = useCallback(() => {
     const taskFromDraft = parseDraftTask(task);
     retailFormStore.participantId = participantId ?? null;
@@ -67,6 +69,17 @@ export const DraftDialog = JSX<DraftDialogProps>(function ({
     navigator.assign(productData.newTaskLink);
   }, [task.id, productData.newTaskLink, isNewMicroservice]);
 
+  let productType: string;
+  if (isDebit) {
+    productType = 'debitCard';
+  } else if (taskType === 'card') {
+    productType = 'creditCard';
+  } else {
+    productType = 'credit';
+  }
+  const draftAspects = getAspects('draft', productType);
+  const currentAspects = getAspects('current', productType);
+
   return (
     <Dialog onClose={onClose}>
       <DraftDialogContent
@@ -76,6 +89,8 @@ export const DraftDialog = JSX<DraftDialogProps>(function ({
         handleGoToDraft={handleGoToDraft}
         handleGoToNewTask={handleGoToNewTask}
         onClose={onClose}
+        draftAspects={draftAspects}
+        currentAspects={currentAspects}
       />
     </Dialog>
   );

package/mobile/src/retail/components/DraftDialog/DraftDialogContent.tsx

@@ -1,4 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { type AspectsDef } from '../../../model/AspectsProps';
 import { type OnCloseProps } from '../../../model/OnCloseProps';
 import { Heading } from '../../../ui-kit/Heading/Heading';
 import { formatDate } from '../../../utils/formatDate';
@@ -11,6 +12,8 @@ export interface DraftDialogContentProps extends OnCloseProps {
   isFromLead: boolean;
   handleGoToDraft: () => void;
   handleGoToNewTask: () => void;
+  draftAspects?: AspectsDef[];
+  currentAspects?: AspectsDef[];
 }
 
 export const DraftDialogContent = JSX<DraftDialogContentProps>(function ({
@@ -20,6 +23,8 @@ export const DraftDialogContent = JSX<DraftDialogContentProps>(function ({
   handleGoToDraft,
   handleGoToNewTask,
   onClose,
+  draftAspects,
+  currentAspects,
 }) {
   return (
     <div className="flex flex-col gap-lg items-center mt-xs mx-6xl">
@@ -35,6 +40,7 @@ export const DraftDialogContent = JSX<DraftDialogContentProps>(function ({
           description={createdDate ? `Черновик от ${formatDate(new Date(createdDate))}` : ''}
           onClick={handleGoToDraft}
           name="go-to-draft-button"
+          data={draftAspects}
         />
         <DraftActionButton
           title={isFromLead ? 'Продолжить заполнение текущей заявки' : 'Создать новую заявку'}
@@ -42,6 +48,7 @@ export const DraftDialogContent = JSX<DraftDialogContentProps>(function ({
           description={productData.description}
           onClick={isFromLead ? onClose : handleGoToNewTask}
           name="go-to-current-task-button"
+          data={isFromLead ? currentAspects : undefined}
         />
       </div>
     </div>

package/mobile/src/retail/model/ApplicationLeadFormTypes.ts

@@ -1,7 +1,10 @@
+import { type Aspects } from '../../hooks/useAspects/useAspects';
 import { type DialogOptions } from '../../ui-kit/DialogManager/DialogAction';
 import { type VerifyPhoneDialogProps } from '../../ui-kit/VerifyPhoneDialogLayout/VerfiyPhoneDialogLayout';
 import { type Nullable } from '../../utils/Nullable';
 import { type MarketingInfo } from '../api/updateUserTask';
+import { type useConsentBkiDialog } from '../components/ConsentBkiDialog/useConsentBkiDialog';
+import { type useDraftDialog } from '../components/DraftDialog/useDraftDialog';
 import { type LeadFormState } from './LeadFormState';
 import { type ReferalData } from './ReferalData';
 
@@ -17,6 +20,7 @@ export interface UserData {
 export type ProductType = 'credit' | 'creditCard' | 'debitCard';
 
 export interface CommonLeadProps {
+  aspects: Aspects;
   programId: string;
   userId?: string | number;
   productType: ProductType;
@@ -54,3 +58,11 @@ export interface UpdateUserDataNewMicroserviceProps extends BaseUpdateUserDataPr
   participantId: string | number;
   userId?: string | number;
 }
+
+export interface OldMicroserviceProps {
+  common: Omit<CommonLeadProps, 'userId'> & { profileId: number };
+  taskData: TaskDataProps;
+  goToNextStep: () => void;
+  consentBkiDialog: ReturnType<typeof useConsentBkiDialog>;
+  draftDialog: ReturnType<typeof useDraftDialog>;
+}

package/mobile/src/retail/utils/commonAspects.ts

@@ -0,0 +1,64 @@
+import { type AspectsDef } from '../../model/AspectsProps';
+import { YANDEX_ID } from './yandexMetrika';
+
+const ASPECTS_MAP: Record<string, Record<string, string>> = {
+  leadForm: {
+    debitCard: 'debit_lead_form',
+    creditCard: 'card_lead_form',
+    default: 'lead_form',
+  },
+  draft: {
+    debitCard: 'debit_draft_app',
+    creditCard: 'card_draft_app',
+    default: 'draft_app',
+  },
+  smsAuth: {
+    debitCard: 'debit_sms_auth',
+    creditCard: 'card_sms_auth',
+    default: 'sms_auth',
+  },
+  consentBki: {
+    creditCard: 'card_consent_bki',
+    default: 'consent_bki',
+  },
+  smsBki: {
+    creditCard: 'card_sms_bki',
+    default: 'sms_bki',
+  },
+  current: {
+    debitCard: 'debit_current_app',
+    creditCard: 'card_current_app',
+    default: 'current_app',
+  },
+  timer: {
+    creditCard: 'card_timer',
+    default: 'timer',
+  },
+  timerEnd: {
+    creditCard: 'card_timer_end',
+    default: 'timer_end',
+  },
+  preDecision: {
+    creditCard: 'card_pre_decision',
+    default: 'pre_decision',
+  },
+  revision: {
+    creditCard: 'card_revision',
+    default: 'revision',
+  },
+  refuse: {
+    creditCard: 'card_refuse',
+    default: 'refuse',
+  },
+};
+
+export const getAspects = (aspectType: string, productType?: string): AspectsDef[] => {
+  const aspectForType = ASPECTS_MAP[aspectType];
+
+  return [
+    {
+      aspectName: 'ymReachGoal',
+      params: { yandexId: YANDEX_ID, targetName: aspectForType[productType || 'default'] },
+    },
+  ];
+};

package/mobile/src/retail/utils/formAspectsConfig.ts

@@ -0,0 +1,6 @@
+export interface StepAspectsConfig {
+  ymTargetName: string;
+  snowplowEventAction?: string;
+  snowplowEventCategory?: string;
+  snowplowEventValueText?: string;
+}

package/mobile/src/retail/utils/yandexMetrika.ts

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

package/mobile/src/utils/getStepAspects.ts

@@ -0,0 +1,71 @@
+import { getCreditInfo } from '../components/CreditForm/getCreditInfo';
+import { type AspectsDef } from '../model/AspectsProps';
+import { type StepAspectsConfig } from '../retail/utils/formAspectsConfig';
+import { YANDEX_ID } from '../retail/utils/yandexMetrika';
+
+interface YandexAspectsParams {
+  step: number;
+  programId?: string | null;
+  productType?: string;
+  paymentSystem?: string;
+  stepsConfig: StepAspectsConfig[];
+}
+
+const getVisitParams = (
+  programId?: string | null,
+  productType?: string,
+  paymentSystem?: string,
+): Record<string, unknown> => {
+  const creditInfo = getCreditInfo(programId ?? null);
+  const productName = creditInfo?.name || '';
+  const productTypeValue = productType ?? '';
+
+  if (paymentSystem && productType !== 'credit') {
+    return {
+      [productTypeValue]: {
+        [productName]: paymentSystem,
+      },
+    };
+  } else {
+    return {
+      [productTypeValue]: productName,
+    };
+  }
+};
+
+export const getStepAspects = ({
+  step,
+  programId,
+  productType,
+  paymentSystem,
+  stepsConfig,
+}: YandexAspectsParams): AspectsDef[] => {
+  const config = stepsConfig[step];
+  if (!config) {
+    return [];
+  }
+  const visitParams = getVisitParams(programId, productType, paymentSystem);
+  const aspects: AspectsDef[] = [];
+
+  aspects.push({
+    aspectName: 'ymReachGoal',
+    params: {
+      yandexId: YANDEX_ID,
+      targetName: config.ymTargetName,
+      ...visitParams,
+    },
+  });
+
+  if (config.snowplowEventAction) {
+    aspects.push({
+      aspectName: 'snowplowEvent',
+      params: {
+        eventAction: config.snowplowEventAction,
+        eventCategory: config.snowplowEventCategory || 'naturalCredits',
+        eventValueText: config.snowplowEventValueText || '',
+      },
+    });
+  }
+
+  return aspects;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.1076",
+  "version": "0.14.1078",
   "private": false,
   "license": "MIT",
   "author": "ЦК",
@@ -205,7 +205,7 @@
       "path": "lib/common.css"
     },
     {
-      "limit": "120 kB",
+      "limit": "130 kB",
       "path": "bundle/bundle.umd.min.js"
     }
   ],

package/src/components/ApplicationLeadForm/ApplicationLeadForm.tsx

@@ -137,7 +137,7 @@ export const ApplicationLeadForm = JSX<ApplicationLeadFormProps>(
               {renderInputs({ field, inputs: _?.inputs }, productType)}
             </div>
           ))}
-          {renderSubmitButton(button, isSending)}
+          {renderSubmitButton(button, { isSending, productType })}
           {esiaStatus === EsiaStatuses.Error ? (
             <Text size="text-m" font="font-medium" color="text-error">
               Использовать Госуслуги для оформления заявки невозможно, необходимо заполнить поля

package/src/components/ApplicationLeadForm/renderSubmitButton.tsx

@@ -1,8 +1,23 @@
+import { getAspects } from '../../retail/utils/commonAspects';
 import { SubmitButton } from '../../ui-kit/Button/SubmitButton';
 import { type SubmitButtonProps } from './ApplicationLeadFormContent';
 
-export const renderSubmitButton = (button?: SubmitButtonProps, isSending = false) => (
-  <SubmitButton className="w-full @xl:w-auto" isLoading={isSending} testId="LeadSubmitButton">
-    {button?.text ? button.text : 'Отправить заявку'}
-  </SubmitButton>
-);
+export const renderSubmitButton = (
+  button?: SubmitButtonProps,
+  options?: { isSending?: boolean; productType?: string },
+) => {
+  const isSending = options?.isSending;
+  const productType = options?.productType;
+  const defaultAspects = getAspects('leadForm', productType);
+
+  return (
+    <SubmitButton
+      className="w-full @xl:w-auto"
+      isLoading={isSending ?? false}
+      testId="LeadSubmitButton"
+      data={defaultAspects}
+    >
+      {button?.text ? button.text : 'Отправить заявку'}
+    </SubmitButton>
+  );
+};