fix: filter-block transform (#702)

Author: Juli Ovechkina

src/blocks/ExtendedFeatures/__stories__/ExtendedFeatures.stories.tsx

@@ -22,7 +22,6 @@ export default {
             sm: 6,
             md: 4,
         },
-        description: undefined,
     },
 } as Meta;
 
@@ -45,17 +44,20 @@ const ColSizesTemplate: StoryFn<ExtendedFeaturesBlockModel> = (args) => (
                 {
                     ...args,
                     ...data.colSizes.four,
+                    description: yfmTransform(data.colSizes.four.description),
                     items: extendedFeaturesItems(
                         data.colSizes.four.items as ExtendedFeaturesItem[],
                     ),
                 },
                 {
                     ...args,
                     ...data.colSizes.three,
+                    description: yfmTransform(data.colSizes.three.description),
                 },
                 {
                     ...args,
                     ...data.colSizes.two,
+                    description: yfmTransform(data.colSizes.two.description),
                     items: extendedFeaturesItems(data.colSizes.two.items as ExtendedFeaturesItem[]),
                 },
             ],
@@ -67,12 +69,15 @@ export const Default = DefaultTemplate.bind({});
 export const WithLabel = DefaultTemplate.bind({});
 export const ColSizes = ColSizesTemplate.bind({});
 
-Default.args = {
+const DefaultArgs = {
     ...data.default.content,
+    description: yfmTransform(data.default.content.description),
     items: extendedFeaturesItems(data.default.content.items as ExtendedFeaturesItem[]),
-} as ExtendedFeaturesProps;
+};
+
+Default.args = {...DefaultArgs} as ExtendedFeaturesProps;
 WithLabel.args = {
-    ...data.withLabel.content,
+    ...DefaultArgs,
     items: extendedFeaturesItems(data.withLabel.content.items as ExtendedFeaturesItem[]),
 } as ExtendedFeaturesProps;
 ColSizes.args = {

src/blocks/ExtendedFeatures/__stories__/data.json

@@ -3,9 +3,10 @@
     "content": {
       "type": "extended-features-block",
       "title": {
-        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit",
+        "text": "Lorem ipsum dolor sit amet",
         "textSize": "m"
       },
+      "description": "Three **cards in a row on the desktop**, two cards in a row on a tablet, one card in a row on a mobile phone.",
       "items": [
         {
           "title": "Sed do eiusmod tempor incididunt",
@@ -57,11 +58,6 @@
   },
   "withLabel": {
     "content": {
-      "type": "extended-features-block",
-      "title": {
-        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit",
-        "textSize": "m"
-      },
       "items": [
         {
           "title": "Sed do eiusmod tempor",
@@ -116,7 +112,7 @@
   "colSizes": {
     "two": {
       "title": "Extended Features",
-      "description": "Two features in a row on all devices",
+      "description": "Two features **in a row** on all devices",
       "colSizes": {
         "all": 6
       },
@@ -157,11 +153,11 @@
     },
     "three": {
       "title": "Extended Features (default)",
-      "description": "Three Features in a row on the desktop, three features in a row on a tablet, two features in a row on a mobile phone."
+      "description": "Three Features **in a row** on the desktop, three features in a row on a tablet, two features in a row on a mobile phone."
     },
     "four": {
       "title": "Extended Features",
-      "description": "Four features in a row on the desktop, three features in a row on a tablet, two features in a row on a mobile phone.",
+      "description": "Four features **in a row** on the desktop, three features in a row on a tablet, two features in a row on a mobile phone.",
       "colSizes": {
         "all": 6,
         "sm": 4,

src/blocks/FilterBlock/__stories__/FilterBlock.stories.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 
 import {Meta, StoryFn} from '@storybook/react';
 
+import {yfmTransform} from '../../../../.storybook/utils';
 import {PageConstructor} from '../../../containers/PageConstructor';
 import {
     FilterBlockModel,
@@ -41,7 +42,7 @@ const createArgs = (overrides: Partial<FilterBlockProps>) =>
     ({
         type: 'filter-block',
         title: data.default.content.title,
-        description: data.default.content.description,
+        description: yfmTransform(data.default.content.description),
         tags: data.default.filters,
         items: createItemList(6, data.default.card, data.default.filters),
         ...overrides,

src/blocks/FilterBlock/__stories__/data.json

@@ -13,7 +13,7 @@
     "content": {
       "type": "card-layout-block",
       "title": "Card Layout",
-      "description": "Three cards in a row on the desktop, two cards in a row on a tablet, one card in a row on a mobile phone."
+      "description": "Three **cards in a row on the desktop**, two cards in a row on a tablet, one card in a row on a mobile phone."
     },
     "filters": [
       {

src/blocks/Form/__stories__/Form.stories.tsx

@@ -3,6 +3,7 @@ import React from 'react';
 import {Meta, StoryFn} from '@storybook/react';
 import {v4 as uuidv4} from 'uuid';
 
+import {yfmTransform} from '../../../../.storybook/utils';
 import {PageConstructor} from '../../../containers/PageConstructor';
 import {FormBlockDirection, FormBlockModel, isHubspotDataForm} from '../../../models';
 import FormBlock from '../Form';
@@ -12,7 +13,13 @@ import data from './data.json';
 export default {
     title: 'Blocks/Form',
     component: FormBlock,
-    args: data.default,
+    args: {
+        ...data.default,
+        textContent: {
+            ...data.default.textContent,
+            text: yfmTransform(data.default.textContent.text),
+        },
+    },
     argTypes: {
         type: {control: false},
         direction: {options: FormBlockDirection, control: {type: 'select'}},

src/blocks/Icons/__stories__/Icons.stories.tsx

@@ -32,13 +32,13 @@ const SizeTemplate: StoryFn<IconsBlockModel> = (args) => (
 
 export const Default = DefaultTemplate.bind([]);
 export const Size = SizeTemplate.bind([]);
-export const WithDescription = WithDescriptionTemplate.bind({});
+export const WithText = WithDescriptionTemplate.bind({});
 
 const transformedText = yfmTransform(data.withDescription.content.description);
 
 Default.args = data.default.content as IconsBlockProps;
 Size.args = data.size.content as Omit<IconsBlockProps, 'size'>;
-WithDescription.args = {
+WithText.args = {
     ...data.withDescription.content,
     description: transformedText,
 } as IconsBlockProps;

src/blocks/Icons/__stories__/data.json

@@ -65,7 +65,8 @@
   "withDescription": {
     "content": {
       "type": "icons-block",
-      "description": "**Ut enim ad minim veniam** [quis nostrud](https://example.com) exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
+      "title": "Icons block title",
+      "description": "**Ut enim ad minim veniam** [quis nostrud](https://example.com) exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
       "items": [
         {
           "src": "https://storage.yandexcloud.net/cloud-www-assets/constructor/storybook/images/icons-link_1_64.svg",

src/text-transform/config.ts

@@ -361,5 +361,6 @@ export const config: BlocksConfig = {
         },
     ],
     [BlockType.CardLayoutBlock]: blockHeaderTransformer,
+    [BlockType.FilterBlock]: blockHeaderTransformer,
     [BlockType.IconsBlock]: blockHeaderTransformer,
 };