pds-dev-kit-web 2.0.9-alpha.4 → 2.0.9-alpha.5

package/dist/src/sub/DynamicLayout/mock_storybook.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MembershipSectionsMock = exports.SampleSectionsMock = void 0;
+exports.MembershipSectionsMockOnlyOneConnectedSubscriptionProduct = exports.MembershipSectionsMockWithoutConnectedSubscriptionProducts = exports.MembershipSectionsMockWithoutMembership = exports.MembershipSectionsMock = exports.SampleSectionsMock = void 0;
 exports.SampleSectionsMock = [
     {
         type: 'DESIGNED',
@@ -1428,7 +1428,7 @@ exports.MembershipSectionsMock = [
             itemDescriptionColorInHex: '#68686BFF',
             itemTitleColorInHex: '#1E1E20FF',
             titleColorInHex: '#DEECFFFF',
-            itemHighlightingColorInHex: '#313131FF',
+            itemHighlightingColorInHex: '#ff7f50FF',
             itemToneType: 'LIGHT',
             programmedItemActionButtonTextType: 'A'
         },
@@ -1485,8 +1485,8 @@ exports.MembershipSectionsMock = [
                                             backgroundImageSrc: cardImage[i],
                                             logoImageSrc: 'https://publ-upload-local.s3.ap-northeast-2.amazonaws.com/e11d1a92-a1c0-4faa-b341-13a32f21828d_image',
                                             overlayType: getOverlayType(),
-                                            overlayColorPrimary: '#FFC0CB',
-                                            overlayColorSecondary: '#313131',
+                                            overlayColorPrimary: '#FFC0CB49',
+                                            overlayColorSecondary: '#31313149',
                                             designSchema: getDesignSchema()
                                         },
                                         membershipBenefitInfo: {
@@ -1498,19 +1498,792 @@ exports.MembershipSectionsMock = [
                                         },
                                         totalSubscriptionProducts: 3
                                     },
-                                    connectedSubscriptionProducts: Array.from({ length: 5 }, function (_, i) {
+                                    connectedSubscriptionProducts: Array.from({ length: 5 }, function (_, j) {
                                         return {
-                                            id: i + 1,
-                                            order: i,
-                                            connectedMembershipId: i + 1,
-                                            subscriptionProductId: i + 1,
+                                            id: j + 1,
+                                            order: j,
+                                            connectedMembershipId: j + 1,
+                                            subscriptionProductId: j + 1,
                                             subscriptionProduct: {
-                                                id: i + 1,
+                                                id: j + 1,
                                                 type: 'COUPON_ONCE_FINITE',
                                                 title: '청춘이 황금시대를 우리의 같은 무엇을',
                                                 alias: "CONNECTED_SUBSCRIPTION_PRODUCTS_" + alphabet[i] + "_ALIAS",
                                                 expiryPeriodInDays: 7,
-                                                isDeactivated: i % 2 === 0,
+                                                isDeactivated: j % 2 === 0,
+                                                fee: {
+                                                    currency: 'KRW',
+                                                    amount: '10,000'
+                                                },
+                                                insertedAt: '2023-01-06T09:05:45',
+                                                updatedAt: '2023-01-06T09:05:45'
+                                            }
+                                        };
+                                    })
+                                };
+                            })
+                        }
+                    }
+                }
+            }
+        },
+        insertedAt: '2023-01-30T10:24:35',
+        updatedAt: '2023-01-30T10:24:35'
+    }
+];
+exports.MembershipSectionsMockWithoutMembership = [
+    {
+        type: 'DESIGNED',
+        display: true,
+        dynamicLayoutSectionItems: [],
+        id: 6001,
+        insertedAt: '2023-01-12T08:03:48',
+        manifest: {
+            availableProperties: [
+                'title',
+                'description',
+                'button_alpha_label',
+                'button_alpha_link_type',
+                'button_alpha_link_src',
+                'button_bravo_label',
+                'button_bravo_link_type',
+                'button_bravo_link_src',
+                'button_charlie_label',
+                'button_charlie_link_type',
+                'button_charlie_link_src'
+            ],
+            availableStyles: [
+                'title_color_in_hex',
+                'description_color_in_hex',
+                'background_color_in_hex',
+                'background_media_type',
+                'background_media_src',
+                'background_overlay_color_in_hex',
+                'button_alpha_design_type',
+                'button_alpha_background_color_in_hex',
+                'button_alpha_label_color_in_hex',
+                'button_bravo_design_type',
+                'button_bravo_background_color_in_hex',
+                'button_bravo_label_color_in_hex',
+                'button_charlie_design_type',
+                'button_charlie_background_color_in_hex',
+                'button_charlie_label_color_in_hex'
+            ],
+            availableTemplates: ['BASE_INTRO_A', 'BASE_INTRO_B', 'BASE_INTRO_C', 'BASE_INTRO_D'],
+            schema: 'BASE_INTRO'
+        },
+        order: 1,
+        properties: {
+            buttonAlphaLabel: '',
+            buttonAlphaLinkSrc: 'https://publ.biz/',
+            buttonAlphaLinkType: 'WEB_LINK',
+            buttonBravoLabel: '',
+            buttonBravoLinkSrc: 'https://publ.biz/',
+            buttonBravoLinkType: 'WEB_LINK',
+            buttonCharlieLabel: '',
+            buttonCharlieLinkSrc: 'https://publ.biz/',
+            buttonCharlieLinkType: 'WEB_LINK',
+            buttonDeltaLabel: '',
+            buttonDeltaLinkSrc: '',
+            buttonDeltaLinkType: 'WEB_LINK',
+            buttonEchoLabel: '',
+            buttonEchoLinkSrc: '',
+            buttonEchoLinkType: 'WEB_LINK',
+            carouselAutoplayMode: 'MANUAL',
+            carouselAutoplayTime: 3,
+            carouselInfiniteLoopMode: 'NO_USE',
+            description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. \nDonec odio felis, eleifend eu leo nec, aliquam dignissim turpis. \nNam a ante mattis, lacinia lacus non, imperdiet leo.',
+            itemLinkMethod: 'CLICK_BUTTON_IN_ITEM',
+            sectionContentMediaSrc: '',
+            sectionContentMediaType: 'IMAGE',
+            title: 'Entertainment Business Sample',
+            multiPurposeUrl: ''
+        },
+        styles: {
+            backgroundColorInHex: '#EFF0F3FF',
+            backgroundMediaSrc: 'https://www.youtube.com/watch?v=4qz6x8y3tNw',
+            backgroundMediaType: 'YOUTUBE',
+            backgroundOverlayColorInHex: '#00000057',
+            buttonAlphaBackgroundColorInHex: '#00000000',
+            buttonAlphaDesignType: 'E',
+            buttonAlphaLabelColorInHex: '#FFFFFFFF',
+            buttonBravoBackgroundColorInHex: '#00000000',
+            buttonBravoDesignType: 'E',
+            buttonBravoLabelColorInHex: '#FFFFFFFF',
+            buttonCharlieBackgroundColorInHex: '#465FF000',
+            buttonCharlieDesignType: 'E',
+            buttonCharlieLabelColorInHex: '#FFFFFFFF',
+            buttonDeltaBackgroundColorInHex: '#455EEFFF',
+            buttonDeltaDesignType: 'A',
+            buttonDeltaLabelColorInHex: '#FFFFFFFF',
+            buttonEchoBackgroundColorInHex: '#455EEFFF',
+            buttonEchoDesignType: 'A',
+            buttonEchoLabelColorInHex: '#FFFFFFFF',
+            descriptionColorInHex: '#FFFFFFE8',
+            itemButtonBackgroundColorInHex: '#455EEFFF',
+            itemButtonDesignType: 'A',
+            itemButtonLabelColorInHex: '#FFFFFFFF',
+            itemDescriptionColorInHex: '#68686BFF',
+            itemTitleColorInHex: '#1E1E20FF',
+            itemHighlightingColorInHex: '#FFFFFFFF',
+            itemToneType: 'LIGHT',
+            titleColorInHex: '#FFFFFFFF',
+            programmedItemActionButtonTextType: 'A'
+        },
+        template: 'BASE_INTRO_A',
+        updatedAt: '2023-01-12T08:03:48'
+    },
+    {
+        display: true,
+        type: 'PROGRAMMED',
+        program: 'MEMBERSHIP_DISPLAY',
+        dynamicLayoutSectionItems: [],
+        id: 6010,
+        manifest: {
+            availableProperties: [
+                'title',
+                'description',
+                'button_alpha_label',
+                'button_alpha_link_type',
+                'button_alpha_link_src'
+            ],
+            availableStyles: [
+                'title_color_in_hex',
+                'description_color_in_hex',
+                'background_color_in_hex',
+                'background_media_type',
+                'background_media_src',
+                'background_overlay_color_in_hex',
+                'button_alpha_design_type',
+                'button_alpha_background_color_in_hex',
+                'button_alpha_label_color_in_hex',
+                'item_highlighting_color_in_hex',
+                'item_tone_type',
+                'programmed_item_action_button_text_type'
+            ],
+            availableTemplates: ['PRG_MEMBERSHIP_DISPLAY_A', 'PRG_MEMBERSHIP_DISPLAY_B'],
+            schema: 'PRG_MEMBERSHIP_DISPLAY'
+        },
+        order: 8,
+        properties: {
+            buttonAlphaLabel: 'Lorem Ipsum',
+            buttonAlphaLinkSrc: 'https://team.publ.space',
+            buttonAlphaLinkType: 'WEB_LINK',
+            buttonBravoLabel: '',
+            buttonBravoLinkSrc: '',
+            buttonBravoLinkType: 'WEB_LINK',
+            buttonCharlieLabel: '',
+            buttonCharlieLinkSrc: '',
+            buttonCharlieLinkType: 'WEB_LINK',
+            buttonDeltaLabel: '',
+            buttonDeltaLinkSrc: '',
+            buttonDeltaLinkType: 'WEB_LINK',
+            buttonEchoLabel: '',
+            buttonEchoLinkSrc: '',
+            buttonEchoLinkType: 'WEB_LINK',
+            carouselAutoplayMode: 'MANUAL',
+            carouselAutoplayTime: 3,
+            carouselInfiniteLoopMode: 'NO_USE',
+            description: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
+            sectionContentMediaSrc: '',
+            sectionContentMediaType: 'IMAGE',
+            title: 'Lorem Ipsum',
+            multiPurposeUrl: 'https://app.publr.co/',
+            itemLinkMethod: 'NONE'
+        },
+        styles: {
+            backgroundColorInHex: '#4A5D78AB',
+            backgroundMediaSrc: '',
+            backgroundMediaType: 'IMAGE',
+            backgroundOverlayColorInHex: '#FFFFFF00',
+            buttonAlphaBackgroundColorInHex: '#313131FF',
+            buttonAlphaDesignType: 'C',
+            buttonAlphaLabelColorInHex: '#f5efd9FF',
+            buttonBravoBackgroundColorInHex: '#313131FF',
+            buttonBravoDesignType: 'E',
+            buttonBravoLabelColorInHex: '#FFFFFFFF',
+            buttonCharlieBackgroundColorInHex: '#465FF000',
+            buttonCharlieDesignType: 'E',
+            buttonCharlieLabelColorInHex: '#FFFFFFFF',
+            buttonDeltaBackgroundColorInHex: '#313131FF',
+            buttonDeltaDesignType: 'A',
+            buttonDeltaLabelColorInHex: '#FFFFFFFF',
+            buttonEchoBackgroundColorInHex: '#313131FF',
+            buttonEchoDesignType: 'A',
+            buttonEchoLabelColorInHex: '#FFFFFFFF',
+            descriptionColorInHex: '#DEECFFA6',
+            itemButtonBackgroundColorInHex: '#313131FF',
+            itemButtonDesignType: 'A',
+            itemButtonLabelColorInHex: '#FFFFFFFF',
+            itemDescriptionColorInHex: '#68686BFF',
+            itemTitleColorInHex: '#1E1E20FF',
+            titleColorInHex: '#DEECFFFF',
+            itemHighlightingColorInHex: '#ff7f50FF',
+            itemToneType: 'LIGHT',
+            programmedItemActionButtonTextType: 'A'
+        },
+        template: 'PRG_MEMBERSHIP_DISPLAY_A',
+        programData: {
+            mdid: 'mdid',
+            preview: {
+                availableResources: ['REAL.MEMBERSHIP_DISPLAY'],
+                resources: {
+                    mock: {},
+                    real: {
+                        membershipDisplay: {
+                            id: 1,
+                            mdid: "MEMBERSHIP_DISPLAY_MD_ID",
+                            title: "MEMBERSHIP_DISPLAY_MD_TITLE",
+                            isDefault: true,
+                            connectedMemberships: []
+                        }
+                    }
+                }
+            }
+        },
+        insertedAt: '2023-01-30T10:24:35',
+        updatedAt: '2023-01-30T10:24:35'
+    }
+];
+exports.MembershipSectionsMockWithoutConnectedSubscriptionProducts = [
+    {
+        type: 'DESIGNED',
+        display: true,
+        dynamicLayoutSectionItems: [],
+        id: 6001,
+        insertedAt: '2023-01-12T08:03:48',
+        manifest: {
+            availableProperties: [
+                'title',
+                'description',
+                'button_alpha_label',
+                'button_alpha_link_type',
+                'button_alpha_link_src',
+                'button_bravo_label',
+                'button_bravo_link_type',
+                'button_bravo_link_src',
+                'button_charlie_label',
+                'button_charlie_link_type',
+                'button_charlie_link_src'
+            ],
+            availableStyles: [
+                'title_color_in_hex',
+                'description_color_in_hex',
+                'background_color_in_hex',
+                'background_media_type',
+                'background_media_src',
+                'background_overlay_color_in_hex',
+                'button_alpha_design_type',
+                'button_alpha_background_color_in_hex',
+                'button_alpha_label_color_in_hex',
+                'button_bravo_design_type',
+                'button_bravo_background_color_in_hex',
+                'button_bravo_label_color_in_hex',
+                'button_charlie_design_type',
+                'button_charlie_background_color_in_hex',
+                'button_charlie_label_color_in_hex'
+            ],
+            availableTemplates: ['BASE_INTRO_A', 'BASE_INTRO_B', 'BASE_INTRO_C', 'BASE_INTRO_D'],
+            schema: 'BASE_INTRO'
+        },
+        order: 1,
+        properties: {
+            buttonAlphaLabel: '',
+            buttonAlphaLinkSrc: 'https://publ.biz/',
+            buttonAlphaLinkType: 'WEB_LINK',
+            buttonBravoLabel: '',
+            buttonBravoLinkSrc: 'https://publ.biz/',
+            buttonBravoLinkType: 'WEB_LINK',
+            buttonCharlieLabel: '',
+            buttonCharlieLinkSrc: 'https://publ.biz/',
+            buttonCharlieLinkType: 'WEB_LINK',
+            buttonDeltaLabel: '',
+            buttonDeltaLinkSrc: '',
+            buttonDeltaLinkType: 'WEB_LINK',
+            buttonEchoLabel: '',
+            buttonEchoLinkSrc: '',
+            buttonEchoLinkType: 'WEB_LINK',
+            carouselAutoplayMode: 'MANUAL',
+            carouselAutoplayTime: 3,
+            carouselInfiniteLoopMode: 'NO_USE',
+            description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. \nDonec odio felis, eleifend eu leo nec, aliquam dignissim turpis. \nNam a ante mattis, lacinia lacus non, imperdiet leo.',
+            itemLinkMethod: 'CLICK_BUTTON_IN_ITEM',
+            sectionContentMediaSrc: '',
+            sectionContentMediaType: 'IMAGE',
+            title: 'Entertainment Business Sample',
+            multiPurposeUrl: ''
+        },
+        styles: {
+            backgroundColorInHex: '#EFF0F3FF',
+            backgroundMediaSrc: 'https://www.youtube.com/watch?v=4qz6x8y3tNw',
+            backgroundMediaType: 'YOUTUBE',
+            backgroundOverlayColorInHex: '#00000057',
+            buttonAlphaBackgroundColorInHex: '#00000000',
+            buttonAlphaDesignType: 'E',
+            buttonAlphaLabelColorInHex: '#FFFFFFFF',
+            buttonBravoBackgroundColorInHex: '#00000000',
+            buttonBravoDesignType: 'E',
+            buttonBravoLabelColorInHex: '#FFFFFFFF',
+            buttonCharlieBackgroundColorInHex: '#465FF000',
+            buttonCharlieDesignType: 'E',
+            buttonCharlieLabelColorInHex: '#FFFFFFFF',
+            buttonDeltaBackgroundColorInHex: '#455EEFFF',
+            buttonDeltaDesignType: 'A',
+            buttonDeltaLabelColorInHex: '#FFFFFFFF',
+            buttonEchoBackgroundColorInHex: '#455EEFFF',
+            buttonEchoDesignType: 'A',
+            buttonEchoLabelColorInHex: '#FFFFFFFF',
+            descriptionColorInHex: '#FFFFFFE8',
+            itemButtonBackgroundColorInHex: '#455EEFFF',
+            itemButtonDesignType: 'A',
+            itemButtonLabelColorInHex: '#FFFFFFFF',
+            itemDescriptionColorInHex: '#68686BFF',
+            itemTitleColorInHex: '#1E1E20FF',
+            itemHighlightingColorInHex: '#FFFFFFFF',
+            itemToneType: 'LIGHT',
+            titleColorInHex: '#FFFFFFFF',
+            programmedItemActionButtonTextType: 'A'
+        },
+        template: 'BASE_INTRO_A',
+        updatedAt: '2023-01-12T08:03:48'
+    },
+    {
+        display: true,
+        type: 'PROGRAMMED',
+        program: 'MEMBERSHIP_DISPLAY',
+        dynamicLayoutSectionItems: [],
+        id: 6010,
+        manifest: {
+            availableProperties: [
+                'title',
+                'description',
+                'button_alpha_label',
+                'button_alpha_link_type',
+                'button_alpha_link_src'
+            ],
+            availableStyles: [
+                'title_color_in_hex',
+                'description_color_in_hex',
+                'background_color_in_hex',
+                'background_media_type',
+                'background_media_src',
+                'background_overlay_color_in_hex',
+                'button_alpha_design_type',
+                'button_alpha_background_color_in_hex',
+                'button_alpha_label_color_in_hex',
+                'item_highlighting_color_in_hex',
+                'item_tone_type',
+                'programmed_item_action_button_text_type'
+            ],
+            availableTemplates: ['PRG_MEMBERSHIP_DISPLAY_A', 'PRG_MEMBERSHIP_DISPLAY_B'],
+            schema: 'PRG_MEMBERSHIP_DISPLAY'
+        },
+        order: 8,
+        properties: {
+            buttonAlphaLabel: 'Lorem Ipsum',
+            buttonAlphaLinkSrc: 'https://team.publ.space',
+            buttonAlphaLinkType: 'WEB_LINK',
+            buttonBravoLabel: '',
+            buttonBravoLinkSrc: '',
+            buttonBravoLinkType: 'WEB_LINK',
+            buttonCharlieLabel: '',
+            buttonCharlieLinkSrc: '',
+            buttonCharlieLinkType: 'WEB_LINK',
+            buttonDeltaLabel: '',
+            buttonDeltaLinkSrc: '',
+            buttonDeltaLinkType: 'WEB_LINK',
+            buttonEchoLabel: '',
+            buttonEchoLinkSrc: '',
+            buttonEchoLinkType: 'WEB_LINK',
+            carouselAutoplayMode: 'MANUAL',
+            carouselAutoplayTime: 3,
+            carouselInfiniteLoopMode: 'NO_USE',
+            description: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
+            sectionContentMediaSrc: '',
+            sectionContentMediaType: 'IMAGE',
+            title: 'Lorem Ipsum',
+            multiPurposeUrl: 'https://app.publr.co/',
+            itemLinkMethod: 'NONE'
+        },
+        styles: {
+            backgroundColorInHex: '#4A5D78AB',
+            backgroundMediaSrc: '',
+            backgroundMediaType: 'IMAGE',
+            backgroundOverlayColorInHex: '#FFFFFF00',
+            buttonAlphaBackgroundColorInHex: '#313131FF',
+            buttonAlphaDesignType: 'C',
+            buttonAlphaLabelColorInHex: '#f5efd9FF',
+            buttonBravoBackgroundColorInHex: '#313131FF',
+            buttonBravoDesignType: 'E',
+            buttonBravoLabelColorInHex: '#FFFFFFFF',
+            buttonCharlieBackgroundColorInHex: '#465FF000',
+            buttonCharlieDesignType: 'E',
+            buttonCharlieLabelColorInHex: '#FFFFFFFF',
+            buttonDeltaBackgroundColorInHex: '#313131FF',
+            buttonDeltaDesignType: 'A',
+            buttonDeltaLabelColorInHex: '#FFFFFFFF',
+            buttonEchoBackgroundColorInHex: '#313131FF',
+            buttonEchoDesignType: 'A',
+            buttonEchoLabelColorInHex: '#FFFFFFFF',
+            descriptionColorInHex: '#DEECFFA6',
+            itemButtonBackgroundColorInHex: '#313131FF',
+            itemButtonDesignType: 'A',
+            itemButtonLabelColorInHex: '#FFFFFFFF',
+            itemDescriptionColorInHex: '#68686BFF',
+            itemTitleColorInHex: '#1E1E20FF',
+            titleColorInHex: '#DEECFFFF',
+            itemHighlightingColorInHex: '#ff7f50FF',
+            itemToneType: 'LIGHT',
+            programmedItemActionButtonTextType: 'A'
+        },
+        template: 'PRG_MEMBERSHIP_DISPLAY_A',
+        programData: {
+            mdid: 'mdid',
+            preview: {
+                availableResources: ['REAL.MEMBERSHIP_DISPLAY'],
+                resources: {
+                    mock: {},
+                    real: {
+                        membershipDisplay: {
+                            id: 1,
+                            mdid: "MEMBERSHIP_DISPLAY_MD_ID",
+                            title: "MEMBERSHIP_DISPLAY_MD_TITLE",
+                            isDefault: true,
+                            connectedMemberships: Array.from({ length: 6 }, function (_, i) {
+                                var alphabet = ['A', 'B', 'C', 'D', 'E', 'F'];
+                                var cardImage = [
+                                    'https://cdn.dev.publishingkit.net/7f3f7a31-023b-4852-9a11-cbac31d25d93',
+                                    'https://cdn.dev.publishingkit.net/c8973261-6c2a-4833-9b9f-20ee355647e4',
+                                    'https://cdn.dev.publishingkit.net/8e585c93-9591-4300-ad93-d002560cbeae',
+                                    'https://cdn.dev.publishingkit.net/4aaa2811-b3ff-435c-b50a-9486376ab230',
+                                    'https://cdn.dev.publishingkit.net/5111c33c-07ba-4b91-8eb6-9975f4cd906a',
+                                    'https://cdn.dev.publishingkit.net/16ac0a8a-acb1-465b-960c-6be66f2a04e8.jpg'
+                                ];
+                                var getOverlayType = function () {
+                                    if (i % 3 === 1)
+                                        return 'SOLID';
+                                    if (i % 3 === 2)
+                                        return 'GRADIENT';
+                                    return 'NONE';
+                                };
+                                var getDesignSchema = function () {
+                                    if (i % 3 === 1)
+                                        return 'B';
+                                    if (i % 3 === 2)
+                                        return 'C';
+                                    return 'A';
+                                };
+                                return {
+                                    id: i + 1,
+                                    order: i,
+                                    mdid: "CONNECTED_MEMBERSHIPS_" + alphabet[i] + "_MD_ID",
+                                    mid: "CONNECTED_MEMBERSHIPS_" + alphabet[i] + "_M_ID",
+                                    membership: {
+                                        id: i + 1,
+                                        type: 'GENERAL',
+                                        mid: "MEMBERSHIP_" + alphabet[i] + "_MID",
+                                        title: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
+                                        insertedAt: '2023-01-06T09:05:45',
+                                        updatedAt: '2023-01-06T09:05:45',
+                                        membershipCardTemplate: {
+                                            backgroundImageSrc: cardImage[i],
+                                            logoImageSrc: 'https://publ-upload-local.s3.ap-northeast-2.amazonaws.com/e11d1a92-a1c0-4faa-b341-13a32f21828d_image',
+                                            overlayType: getOverlayType(),
+                                            overlayColorPrimary: '#FFC0CB49',
+                                            overlayColorSecondary: '#31313149',
+                                            designSchema: getDesignSchema()
+                                        },
+                                        membershipBenefitInfo: {
+                                            benefitAlpha: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
+                                            benefitBravo: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
+                                            benefitCharlie: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
+                                            benefitDelta: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
+                                            benefitEcho: 'Lorem ipsum dolor sit amet. Et magnam molestiae.'
+                                        },
+                                        totalSubscriptionProducts: 3
+                                    },
+                                    connectedSubscriptionProducts: []
+                                };
+                            })
+                        }
+                    }
+                }
+            }
+        },
+        insertedAt: '2023-01-30T10:24:35',
+        updatedAt: '2023-01-30T10:24:35'
+    }
+];
+exports.MembershipSectionsMockOnlyOneConnectedSubscriptionProduct = [
+    {
+        type: 'DESIGNED',
+        display: true,
+        dynamicLayoutSectionItems: [],
+        id: 6001,
+        insertedAt: '2023-01-12T08:03:48',
+        manifest: {
+            availableProperties: [
+                'title',
+                'description',
+                'button_alpha_label',
+                'button_alpha_link_type',
+                'button_alpha_link_src',
+                'button_bravo_label',
+                'button_bravo_link_type',
+                'button_bravo_link_src',
+                'button_charlie_label',
+                'button_charlie_link_type',
+                'button_charlie_link_src'
+            ],
+            availableStyles: [
+                'title_color_in_hex',
+                'description_color_in_hex',
+                'background_color_in_hex',
+                'background_media_type',
+                'background_media_src',
+                'background_overlay_color_in_hex',
+                'button_alpha_design_type',
+                'button_alpha_background_color_in_hex',
+                'button_alpha_label_color_in_hex',
+                'button_bravo_design_type',
+                'button_bravo_background_color_in_hex',
+                'button_bravo_label_color_in_hex',
+                'button_charlie_design_type',
+                'button_charlie_background_color_in_hex',
+                'button_charlie_label_color_in_hex'
+            ],
+            availableTemplates: ['BASE_INTRO_A', 'BASE_INTRO_B', 'BASE_INTRO_C', 'BASE_INTRO_D'],
+            schema: 'BASE_INTRO'
+        },
+        order: 1,
+        properties: {
+            buttonAlphaLabel: '',
+            buttonAlphaLinkSrc: 'https://publ.biz/',
+            buttonAlphaLinkType: 'WEB_LINK',
+            buttonBravoLabel: '',
+            buttonBravoLinkSrc: 'https://publ.biz/',
+            buttonBravoLinkType: 'WEB_LINK',
+            buttonCharlieLabel: '',
+            buttonCharlieLinkSrc: 'https://publ.biz/',
+            buttonCharlieLinkType: 'WEB_LINK',
+            buttonDeltaLabel: '',
+            buttonDeltaLinkSrc: '',
+            buttonDeltaLinkType: 'WEB_LINK',
+            buttonEchoLabel: '',
+            buttonEchoLinkSrc: '',
+            buttonEchoLinkType: 'WEB_LINK',
+            carouselAutoplayMode: 'MANUAL',
+            carouselAutoplayTime: 3,
+            carouselInfiniteLoopMode: 'NO_USE',
+            description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. \nDonec odio felis, eleifend eu leo nec, aliquam dignissim turpis. \nNam a ante mattis, lacinia lacus non, imperdiet leo.',
+            itemLinkMethod: 'CLICK_BUTTON_IN_ITEM',
+            sectionContentMediaSrc: '',
+            sectionContentMediaType: 'IMAGE',
+            title: 'Entertainment Business Sample',
+            multiPurposeUrl: ''
+        },
+        styles: {
+            backgroundColorInHex: '#EFF0F3FF',
+            backgroundMediaSrc: 'https://www.youtube.com/watch?v=4qz6x8y3tNw',
+            backgroundMediaType: 'YOUTUBE',
+            backgroundOverlayColorInHex: '#00000057',
+            buttonAlphaBackgroundColorInHex: '#00000000',
+            buttonAlphaDesignType: 'E',
+            buttonAlphaLabelColorInHex: '#FFFFFFFF',
+            buttonBravoBackgroundColorInHex: '#00000000',
+            buttonBravoDesignType: 'E',
+            buttonBravoLabelColorInHex: '#FFFFFFFF',
+            buttonCharlieBackgroundColorInHex: '#465FF000',
+            buttonCharlieDesignType: 'E',
+            buttonCharlieLabelColorInHex: '#FFFFFFFF',
+            buttonDeltaBackgroundColorInHex: '#455EEFFF',
+            buttonDeltaDesignType: 'A',
+            buttonDeltaLabelColorInHex: '#FFFFFFFF',
+            buttonEchoBackgroundColorInHex: '#455EEFFF',
+            buttonEchoDesignType: 'A',
+            buttonEchoLabelColorInHex: '#FFFFFFFF',
+            descriptionColorInHex: '#FFFFFFE8',
+            itemButtonBackgroundColorInHex: '#455EEFFF',
+            itemButtonDesignType: 'A',
+            itemButtonLabelColorInHex: '#FFFFFFFF',
+            itemDescriptionColorInHex: '#68686BFF',
+            itemTitleColorInHex: '#1E1E20FF',
+            itemHighlightingColorInHex: '#FFFFFFFF',
+            itemToneType: 'LIGHT',
+            titleColorInHex: '#FFFFFFFF',
+            programmedItemActionButtonTextType: 'A'
+        },
+        template: 'BASE_INTRO_A',
+        updatedAt: '2023-01-12T08:03:48'
+    },
+    {
+        display: true,
+        type: 'PROGRAMMED',
+        program: 'MEMBERSHIP_DISPLAY',
+        dynamicLayoutSectionItems: [],
+        id: 6010,
+        manifest: {
+            availableProperties: [
+                'title',
+                'description',
+                'button_alpha_label',
+                'button_alpha_link_type',
+                'button_alpha_link_src'
+            ],
+            availableStyles: [
+                'title_color_in_hex',
+                'description_color_in_hex',
+                'background_color_in_hex',
+                'background_media_type',
+                'background_media_src',
+                'background_overlay_color_in_hex',
+                'button_alpha_design_type',
+                'button_alpha_background_color_in_hex',
+                'button_alpha_label_color_in_hex',
+                'item_highlighting_color_in_hex',
+                'item_tone_type',
+                'programmed_item_action_button_text_type'
+            ],
+            availableTemplates: ['PRG_MEMBERSHIP_DISPLAY_A', 'PRG_MEMBERSHIP_DISPLAY_B'],
+            schema: 'PRG_MEMBERSHIP_DISPLAY'
+        },
+        order: 8,
+        properties: {
+            buttonAlphaLabel: 'Lorem Ipsum',
+            buttonAlphaLinkSrc: 'https://team.publ.space',
+            buttonAlphaLinkType: 'WEB_LINK',
+            buttonBravoLabel: '',
+            buttonBravoLinkSrc: '',
+            buttonBravoLinkType: 'WEB_LINK',
+            buttonCharlieLabel: '',
+            buttonCharlieLinkSrc: '',
+            buttonCharlieLinkType: 'WEB_LINK',
+            buttonDeltaLabel: '',
+            buttonDeltaLinkSrc: '',
+            buttonDeltaLinkType: 'WEB_LINK',
+            buttonEchoLabel: '',
+            buttonEchoLinkSrc: '',
+            buttonEchoLinkType: 'WEB_LINK',
+            carouselAutoplayMode: 'MANUAL',
+            carouselAutoplayTime: 3,
+            carouselInfiniteLoopMode: 'NO_USE',
+            description: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
+            sectionContentMediaSrc: '',
+            sectionContentMediaType: 'IMAGE',
+            title: 'Lorem Ipsum',
+            multiPurposeUrl: 'https://app.publr.co/',
+            itemLinkMethod: 'NONE'
+        },
+        styles: {
+            backgroundColorInHex: '#4A5D78AB',
+            backgroundMediaSrc: '',
+            backgroundMediaType: 'IMAGE',
+            backgroundOverlayColorInHex: '#FFFFFF00',
+            buttonAlphaBackgroundColorInHex: '#313131FF',
+            buttonAlphaDesignType: 'C',
+            buttonAlphaLabelColorInHex: '#f5efd9FF',
+            buttonBravoBackgroundColorInHex: '#313131FF',
+            buttonBravoDesignType: 'E',
+            buttonBravoLabelColorInHex: '#FFFFFFFF',
+            buttonCharlieBackgroundColorInHex: '#465FF000',
+            buttonCharlieDesignType: 'E',
+            buttonCharlieLabelColorInHex: '#FFFFFFFF',
+            buttonDeltaBackgroundColorInHex: '#313131FF',
+            buttonDeltaDesignType: 'A',
+            buttonDeltaLabelColorInHex: '#FFFFFFFF',
+            buttonEchoBackgroundColorInHex: '#313131FF',
+            buttonEchoDesignType: 'A',
+            buttonEchoLabelColorInHex: '#FFFFFFFF',
+            descriptionColorInHex: '#DEECFFA6',
+            itemButtonBackgroundColorInHex: '#313131FF',
+            itemButtonDesignType: 'A',
+            itemButtonLabelColorInHex: '#FFFFFFFF',
+            itemDescriptionColorInHex: '#68686BFF',
+            itemTitleColorInHex: '#1E1E20FF',
+            titleColorInHex: '#DEECFFFF',
+            itemHighlightingColorInHex: '#ff7f50FF',
+            itemToneType: 'LIGHT',
+            programmedItemActionButtonTextType: 'A'
+        },
+        template: 'PRG_MEMBERSHIP_DISPLAY_A',
+        programData: {
+            mdid: 'mdid',
+            preview: {
+                availableResources: ['REAL.MEMBERSHIP_DISPLAY'],
+                resources: {
+                    mock: {},
+                    real: {
+                        membershipDisplay: {
+                            id: 1,
+                            mdid: "MEMBERSHIP_DISPLAY_MD_ID",
+                            title: "MEMBERSHIP_DISPLAY_MD_TITLE",
+                            isDefault: true,
+                            connectedMemberships: Array.from({ length: 1 }, function (_, i) {
+                                var alphabet = ['A', 'B', 'C', 'D', 'E', 'F'];
+                                var cardImage = [
+                                    'https://cdn.dev.publishingkit.net/7f3f7a31-023b-4852-9a11-cbac31d25d93',
+                                    'https://cdn.dev.publishingkit.net/c8973261-6c2a-4833-9b9f-20ee355647e4',
+                                    'https://cdn.dev.publishingkit.net/8e585c93-9591-4300-ad93-d002560cbeae',
+                                    'https://cdn.dev.publishingkit.net/4aaa2811-b3ff-435c-b50a-9486376ab230',
+                                    'https://cdn.dev.publishingkit.net/5111c33c-07ba-4b91-8eb6-9975f4cd906a',
+                                    'https://cdn.dev.publishingkit.net/16ac0a8a-acb1-465b-960c-6be66f2a04e8.jpg'
+                                ];
+                                var getOverlayType = function () {
+                                    if (i % 3 === 1)
+                                        return 'SOLID';
+                                    if (i % 3 === 2)
+                                        return 'GRADIENT';
+                                    return 'NONE';
+                                };
+                                var getDesignSchema = function () {
+                                    if (i % 3 === 1)
+                                        return 'B';
+                                    if (i % 3 === 2)
+                                        return 'C';
+                                    return 'A';
+                                };
+                                return {
+                                    id: i + 1,
+                                    order: i,
+                                    mdid: "CONNECTED_MEMBERSHIPS_" + alphabet[i] + "_MD_ID",
+                                    mid: "CONNECTED_MEMBERSHIPS_" + alphabet[i] + "_M_ID",
+                                    membership: {
+                                        id: i + 1,
+                                        type: 'GENERAL',
+                                        mid: "MEMBERSHIP_" + alphabet[i] + "_MID",
+                                        title: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
+                                        insertedAt: '2023-01-06T09:05:45',
+                                        updatedAt: '2023-01-06T09:05:45',
+                                        membershipCardTemplate: {
+                                            backgroundImageSrc: cardImage[i],
+                                            logoImageSrc: 'https://publ-upload-local.s3.ap-northeast-2.amazonaws.com/e11d1a92-a1c0-4faa-b341-13a32f21828d_image',
+                                            overlayType: getOverlayType(),
+                                            overlayColorPrimary: '#FFC0CB49',
+                                            overlayColorSecondary: '#31313149',
+                                            designSchema: getDesignSchema()
+                                        },
+                                        membershipBenefitInfo: {
+                                            benefitAlpha: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
+                                            benefitBravo: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
+                                            benefitCharlie: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
+                                            benefitDelta: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
+                                            benefitEcho: 'Lorem ipsum dolor sit amet. Et magnam molestiae.'
+                                        },
+                                        totalSubscriptionProducts: 3
+                                    },
+                                    connectedSubscriptionProducts: Array.from({ length: 1 }, function (_, j) {
+                                        return {
+                                            id: j + 1,
+                                            order: j,
+                                            connectedMembershipId: j + 1,
+                                            subscriptionProductId: j + 1,
+                                            subscriptionProduct: {
+                                                id: j + 1,
+                                                type: 'COUPON_ONCE_FINITE',
+                                                title: '청춘이 황금시대를 우리의 같은 무엇을',
+                                                alias: "CONNECTED_SUBSCRIPTION_PRODUCTS_" + alphabet[i] + "_ALIAS",
+                                                expiryPeriodInDays: 7,
+                                                isDeactivated: j % 2 === 0,
                                                 fee: {
                                                     currency: 'KRW',
                                                     amount: '10,000'