chore(ExtendedFeatures): update story

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

@@ -1,13 +1,12 @@
 import {Meta, StoryFn} from '@storybook/react';
 
-import {transformOptionalTitle, yfmTransform} from '../../../../.storybook/utils';
-import {PageConstructor} from '../../../containers/PageConstructor/PageConstructor';
+import {blockTransform} from '../../../../.storybook/utils';
 import {
     ExtendedFeaturesBlockModel,
     ExtendedFeaturesItem,
     ExtendedFeaturesProps,
 } from '../../../models';
-import ExtendedFeatures from '../ExtendedFeatures';
+import ExtendedFeatures, {ExtendedFeaturesBlock} from '../ExtendedFeatures';
 
 import data from './data.json';
 
@@ -23,72 +22,55 @@ export default {
     },
 } as Meta;
 
-const DefaultTemplate: StoryFn<ExtendedFeaturesBlockModel> = (args) => (
-    <PageConstructor content={{blocks: [args]}} />
-);
-
-const extendedFeaturesItems = (items: ExtendedFeaturesItem[]) => {
-    return items.map((item) => ({
-        ...item,
-        title: transformOptionalTitle(item.title),
-        list: item.list?.map((listItem) => ({
-            ...listItem,
-            title: transformOptionalTitle(listItem.title),
-            text: listItem?.text && yfmTransform(listItem.text),
-        })),
-        text: item.text && yfmTransform(item.text),
-        additionalInfo: item.additionalInfo && yfmTransform(item.additionalInfo),
-    }));
+const DefaultTemplate: StoryFn<ExtendedFeaturesBlockModel> = (args) => {
+    const transformedArgs = blockTransform(args) as ExtendedFeaturesProps;
+    return (
+        <div style={{padding: '64px'}}>
+            <ExtendedFeaturesBlock {...transformedArgs} />
+        </div>
+    );
 };
 
-const ColSizesTemplate: StoryFn<ExtendedFeaturesBlockModel> = (args) => (
-    <PageConstructor
-        content={{
-            blocks: [
-                {
-                    ...args,
-                    ...data.colSizes.four,
-                    title: transformOptionalTitle(data.colSizes.four.title),
-                    description: yfmTransform(data.colSizes.four.description),
-                    items: extendedFeaturesItems(
-                        data.colSizes.four.items as ExtendedFeaturesItem[],
-                    ),
-                },
-                {
-                    ...args,
-                    ...data.colSizes.three,
-                    title: transformOptionalTitle(data.colSizes.three.title),
-                    description: yfmTransform(data.colSizes.three.description),
-                },
-                {
-                    ...args,
-                    ...data.colSizes.two,
-                    title: transformOptionalTitle(data.colSizes.two.title),
-                    description: yfmTransform(data.colSizes.two.description),
-                    items: extendedFeaturesItems(data.colSizes.two.items as ExtendedFeaturesItem[]),
-                },
-            ],
-        }}
-    />
-);
+const ColSizesTemplate: StoryFn<ExtendedFeaturesBlockModel> = (args) => {
+    const transformedArgsFour = blockTransform({
+        ...args,
+        ...data.colSizes.four,
+    }) as ExtendedFeaturesProps;
+
+    const transformedArgsThree = blockTransform({
+        ...args,
+        ...data.colSizes.three,
+    }) as ExtendedFeaturesProps;
+
+    const transformedArgsTwo = blockTransform({
+        ...args,
+        ...data.colSizes.two,
+    }) as ExtendedFeaturesProps;
+
+    return (
+        <div style={{padding: '64px', display: 'flex', gap: 20, flexDirection: 'column'}}>
+            <ExtendedFeaturesBlock {...transformedArgsFour} />
+            <ExtendedFeaturesBlock {...transformedArgsThree} />
+            <ExtendedFeaturesBlock {...transformedArgsTwo} />
+        </div>
+    );
+};
 
 export const Default = DefaultTemplate.bind({});
 export const WithLabel = DefaultTemplate.bind({});
 export const ColSizes = ColSizesTemplate.bind({});
 
 const DefaultArgs = {
     ...data.default.content,
-    title: transformOptionalTitle(data.default.content.title),
-    description: yfmTransform(data.default.content.description),
-    items: extendedFeaturesItems(data.default.content.items as ExtendedFeaturesItem[]),
+    items: data.default.content.items,
 };
 
 Default.args = {...DefaultArgs} as ExtendedFeaturesProps;
 WithLabel.args = {
     ...DefaultArgs,
-    items: extendedFeaturesItems(data.withLabel.content.items as ExtendedFeaturesItem[]),
+    items: data.withLabel.content.items as ExtendedFeaturesItem[],
 } as ExtendedFeaturesProps;
 ColSizes.args = {
     ...data.default.content,
-    items: extendedFeaturesItems(data.default.content.items as ExtendedFeaturesItem[]),
+    items: data.default.content.items as ExtendedFeaturesItem[],
 } as ExtendedFeaturesProps;