описания

cypress/e2e/personalization.cy.ts

@@ -0,0 +1,54 @@
+/// <reference types="cypress" />
+
+describe('Personalization Flow', () => {
+  beforeEach(() => {
+    // Логинимся перед каждым тестом
+    cy.login(); // Предполагается, что у вас есть команда для логина
+  });
+
+  it('should complete personalization flow and open link in new tab', () => {
+    // Переходим на страницу персонализации
+    cy.visit('/personalization');
+
+    // Выбираем пол (мужской)
+    cy.get('[data-testid="gender-male"]').click();
+
+    // Генерируем случайный возраст от 1 до 99
+    const randomAge = Math.floor(Math.random() * 99) + 1;
+    
+    // Вводим возраст
+    cy.get('[data-testid="age-input"]')
+      .type(randomAge.toString())
+      .should('have.value', randomAge.toString());
+
+    // Нажимаем кнопку OK
+    cy.get('[data-testid="submit-button"]').click();
+
+    // Ждем появления скелетона загрузки
+    cy.get('[data-testid="loading-skeleton"]').should('be.visible');
+
+    // Ждем 3 минуты (в реальном тесте это будет быстрее из-за моков)
+    cy.wait(180000);
+
+    // Ждем появления кнопки копирования
+    cy.get('[data-testid="copy-button"]').should('be.visible');
+
+    // Копируем ссылку
+    cy.get('[data-testid="copy-button"]').click();
+
+    // Проверяем появление уведомления об успешном копировании
+    cy.contains('Ссылка успешно скопирована').should('be.visible');
+
+    // Получаем ссылку из буфера обмена
+    cy.window().then((win) => {
+      win.navigator.clipboard.readText().then((text) => {
+        // Открываем ссылку в новой вкладке
+        cy.window().then((win) => {
+          const newWindow = win.open(text, '_blank');
+          // Проверяем, что новая вкладка открылась
+          expect(newWindow).to.not.be.null;
+        });
+      });
+    });
+  });
+});

jest.config.js

@@ -0,0 +1,15 @@
+module.exports = {
+  transformIgnorePatterns: [
+    '/node_modules/(?!(@frontend/kitui|@frontend/squzanswerer)/)'
+  ],
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1',
+    '^@utils/(.*)$': '<rootDir>/src/utils/$1',
+    '^@assets/(.*)$': '<rootDir>/src/assets/$1'
+  },
+  setupFilesAfterEnv: ['<rootDir>/src/setupTests.ts'],
+  testEnvironment: 'jsdom',
+  transform: {
+    '^.+\\.(ts|tsx)$': 'ts-jest'
+  }
+}; 

src/pages/PersonalizationAI/PersonalizationAI.tsx

@@ -20,6 +20,7 @@ import { makeRequest } from "@api/makeRequest";
 import { setUserAccount, setCustomerAccount } from "@/stores/user";
 import { quizApi } from "@api/quiz";
 import { setQuizes } from "@root/quizes/actions";
+import TooltipClickInfo from "@/ui_kit/Toolbars/TooltipClickInfo";
 
 const tariff = "6844b8858258f5cc35791ef7";
 export default function PersonalizationAI() {
@@ -287,8 +288,13 @@ export default function PersonalizationAI() {
           wordSpacing: "0.1px",
           lineHeight: "21.4px"
         }}>
-          Данный раздел позволяет вам создавать персонализированный опрос под каждую целевую аудиторию отдельно, наш AI перефразирует ваши вопросы согласно настройкам. Для этого нужно выбрать пол и возраст вашей аудитории и получите персональную ссылку с нужными настройками в списке ниже. Так же вы можете обогатить свою ссылку UTM метками        </Typography>
-        {/* Первый белый блок */}
+Данный раздел позволяет вам создавать персонализированный опрос под каждую целевую аудиторию отдельно, наш AI перефразирует ваши вопросы согласно настройкам.
+Для этого нужно выбрать пол и возраст вашей аудитории и получите персональную ссылку с нужными настройками в списке ниже. 
+
+Так же вы можете обогатить свою ссылку UTM метками в поле "вставьте свою ссылку"и этим метки применятся ко всем вашим ссылкам. 
+
+ВАЖНО: если ваши вопросы уже подходят целевой аудитории, то персонализированы они скорее всего не будут.        {/* Первый белый блок */}
+</Typography>
         <Box sx={{
           bgcolor: "#fff",
           borderRadius: "12px",
@@ -311,7 +317,12 @@ export default function PersonalizationAI() {
           <Box sx={{ mt: "34px" }}>
             <Box sx={{ display: 'flex', alignItems: 'center', gap: '6px' }}>
               <Typography sx={{ color: theme.palette.grey3.main, fontSize: "18px", fontWeight: 500 }}>Ссылка</Typography>
-              <InfoPopover />
+              <TooltipClickInfo title={`Данное поле создано для обогащения utm метками вашей ссылки. Нужно скопировать ссылку вашего квиза, задать настройки ца, вставить ссылку в поле, прописать метки(советуем использовать динамические),  и нажать "ок" выше поля. Метки будут применены ко всем ссылкам с персонализацией в рамках данного квиза.`}/>
+              {/* <InfoPopover  >
+                <Typography sx={{maxWidth: "300px"}} >
+                Данное поле создано для обогащения utm метками вашей ссылки. Нужно скопировать ссылку вашего квиза, задать настройки ца, вставить ссылку в поле, прописать метки(советуем использовать динамические),  и нажать "ок" выше поля. Метки будут применены ко всем ссылкам с персонализацией в рамках данного квиза.
+                </Typography>
+              </InfoPopover> */}
             </Box>
             <Typography
               sx={{

src/ui_kit/Toolbars/TooltipClickInfo.tsx

@@ -20,6 +20,14 @@ export default function TooltipClickInfo({ title }: { title: string }) {
           <Tooltip
             PopperProps={{
               disablePortal: true,
+              sx: {
+                "& .MuiTooltip-tooltip": {
+                  fontSize: "14px",
+                  padding: "12px",
+                  maxWidth: "400px",
+                  whiteSpace: "pre-line"
+                }
+              }
             }}
             placement="top"
             onClose={handleTooltipClose}
@@ -27,10 +35,6 @@ export default function TooltipClickInfo({ title }: { title: string }) {
             title={title}
             onMouseEnter={handleTooltipOpen}
             onMouseLeave={handleTooltipClose}
-            sx={{
-              fontSize: "12px",
-              p:"10px"
-            }}
           >
             <IconButton onClick={handleTooltipOpen}>
               <InfoIcon />