@redneckz/wildless-cms-uni-blocks 0.14.975 → 0.14.977

package/src/components/ProductBlock/ProductBlock.fixture.tsx

@@ -12,12 +12,20 @@ const image: Picture = {
   format: 'webp',
   alt: 'Потребительский кредит наличными',
   size: {
-    width: 280,
-    height: 280,
+    width: 510,
+    height: 510,
   },
 };
 
 const benefits: BenefitItemContent[] = [
+  {
+    isDotted: true,
+    icon: {
+      sources: [],
+      iconVersion: 'normal',
+    },
+    __html: '<h2>ПРИВЕДИ ДРУГА В БАНК И ПОЛУЧИ ДО 1500 БАЛЛОВ</h2><p><br></p>',
+  },
   {
     label: 'До 5 млн ₽',
     description: 'Кредитный лимит',
@@ -268,19 +276,20 @@ export default {
     <div className="container grid grid-cols-12">
       <ProductBlock
         className="col-span-12"
-        title="Потребительский кредит наличными"
+        title="Для всех зарплатных клиентов вашей компании действует специальная программа:"
         headlineVersion="L"
-        description="Для всех зарплатных клиентов вашей компании действует специальная программа:"
+        description="ПРИВЕДИ ДРУГА И ПОЛУЧИ 1500 БОНУСОВ"
         benefits={benefits}
         benefitsVersion="white"
         buttons={buttonsSecond}
         image={image}
         version="secondary"
-        dynamicUtmDescription={{
-          utm: 'utm_source',
+        dynamicQueryParamText={{
+          queryParam: 'utm_source',
           value: 'вашей компании',
+          textType: 'title',
         }}
-        dynamicDescriptionSource={{
+        dynamicTextSource={{
           $ref: '/wcms-resources/referal-programm.json',
         }}
       />

package/src/components/ProductBlock/ProductBlock.tsx

@@ -1,5 +1,5 @@
 import type { JSONRefObject } from '../../data/JSONRefObject';
-import { type DynamicDescription } from '../../model/HeadlineType';
+import { type DynamicText } from '../../model/HeadlineType';
 import { BaseProductTile } from '../../ui-kit/BaseProductTile/BaseProductTile';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { UniBlock } from '../../UniBlock/UniBlock';
@@ -9,7 +9,7 @@ import { style } from '../../utils/style';
 import { type ProductBlockContent } from './ProductBlockContent';
 
 export interface ProductBlockProps extends UniBlockProps, ProductBlockContent {
-  dynamicDescriptionSource?: JSONRefObject & {
+  dynamicTextSource?: JSONRefObject & {
     list?: Record<string, string>[];
   };
 }
@@ -19,17 +19,24 @@ export const ProductBlock = UniBlock<ProductBlockProps>(
     className,
     padding,
     defaultPadding,
-    dynamicUtmDescription,
-    dynamicDescriptionSource,
+    dynamicQueryParamText = {},
+    dynamicTextSource,
     description,
+    title,
     ...rest
   }) => {
-    const formatDescription = getFormatDescription(
-      dynamicUtmDescription,
-      dynamicDescriptionSource?.list,
-      description,
+    const { textType } = dynamicQueryParamText;
+    const formatText = getFormatDescription(
+      dynamicQueryParamText,
+      dynamicTextSource?.list,
+      textType === 'title' ? title : description,
     );
 
+    const textProps = {
+      title: textType === 'title' ? formatText : title,
+      description: textType === 'description' ? formatText : description,
+    };
+
     return (
       <BlockWrapper
         className={style('overflow-hidden flex flex-col gap-3xl box-border', className)}
@@ -39,8 +46,8 @@ export const ProductBlock = UniBlock<ProductBlockProps>(
         <BaseProductTile
           defaultPadding={defaultPadding || 'p-6xl'}
           padding={padding}
-          description={formatDescription}
           className="grow h-full"
+          {...textProps}
           {...rest}
         />
       </BlockWrapper>
@@ -49,20 +56,22 @@ export const ProductBlock = UniBlock<ProductBlockProps>(
 );
 
 const getFormatDescription = (
-  dynamicUtmDescription: DynamicDescription = {},
+  dynamicQueryParamText: DynamicText = {},
   valuesList: Record<string, string>[] = [],
-  description = '',
+  text = '',
 ) => {
-  const { utm, value } = dynamicUtmDescription;
+  const { queryParam, value } = dynamicQueryParamText;
   const sessionQuery = saveSessionQuery();
-  const utmValue = getUtmValue(utm ?? 'utm_source', sessionQuery);
-  const dynamicValue = valuesList.find((item) => item?.id === utmValue)?.value;
+  const utmValue = getQueryParamValue(queryParam ?? 'utm_source', sessionQuery);
+  const dynamicValue = valuesList.find(
+    (item) => item?.id?.toLowerCase() === utmValue?.toLowerCase(),
+  )?.value;
 
-  return dynamicValue ? description.replace(String(value), dynamicValue) : description;
+  return dynamicValue ? text?.replace(String(value), dynamicValue) : text;
 };
 
-const getUtmValue = (utm: string, queryString: string) => {
+const getQueryParamValue = (queryParam: string, queryString: string) => {
   const params = new URLSearchParams(queryString);
 
-  return params.get(utm);
+  return params.get(queryParam);
 };

package/src/components/ProductBlock/ProductBlockContent.ts

@@ -1,7 +1,4 @@
-import {
-  type AdditionalDescriptionProps,
-  type DynamicDescriptionProps,
-} from '../../model/HeadlineType';
+import { type AdditionalDescriptionProps, type DynamicTextProps } from '../../model/HeadlineType';
 import { type BaseProductTileContent } from '../../ui-kit/BaseProductTile/BaseProductTileContent';
 import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
 
@@ -11,7 +8,7 @@ import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
 export type ProductBlockContent = UniBlockContent &
   BaseProductTileContent &
   AdditionalDescriptionProps &
-  DynamicDescriptionProps & {
+  DynamicTextProps & {
     /** @title Отображать кнопку возврата */
     backwardButton?: boolean;
   };

package/src/model/HeadlineType.ts

@@ -46,26 +46,34 @@ export type AdditionalDescriptionProps = {
   additionalDescription?: string;
 };
 
-export type DynamicDescriptionProps = {
-  /** @title Динамическое описание по значению utm-метки */
-  dynamicUtmDescription?: DynamicDescription;
+export type DynamicTextProps = {
+  /** @title Динамическое описание по значению query-параметра */
+  dynamicQueryParamText?: DynamicText;
   /** @title Справочник значений */
-  dynamicDescriptionSource?: JSONRefObject;
+  dynamicTextSource?: JSONRefObject;
 };
 
 export type HeadlineCommonProps = TitleProps &
   DescriptionProps &
   AlignProps &
   AdditionalDescriptionProps &
-  DynamicDescriptionProps;
+  DynamicTextProps;
 
 export type HeadlineProps = HeadlineCommonProps & {
   headlineVersion?: HeadlineVersion;
 };
 
-export type DynamicDescription = {
-  /** @title utm-метка */
-  utm?: string;
+export type DynamicText = {
+  /** @title query-параметр */
+  queryParam?: string;
   /** @title Заменяемый текст */
   value?: string;
+  /** @title Тип текста, где будет произведена замена */
+  textType?: TextType;
 };
+
+/**
+ * @title Тип текста
+ * @enumNames ["Описание", "Заголовок"]
+ */
+export type TextType = 'description' | 'title';