@envive-ai/react-hooks 0.1.0

package/src/merchants/leapsAndRebounds/leapsAndRebounds.ts

@@ -0,0 +1,424 @@
+import {
+  BOTTOM_SUGGESTION_BAR_TESTID,
+  CHAT_PREVIEW_TESTID,
+  TOP_SUGGESTION_BAR_TESTID,
+} from "src/config/locators";
+import { BasicOrgInfoType, OrgShortName } from "src/application/models";
+import { ChatElementDisplayLocation } from "src/application/models/chatElementDisplayLocation";
+import { CdnService } from "src/application/service/cdnService";
+import {
+  CustomerServiceIntegrationMode,
+  CustomerServiceType,
+} from "src/application/service/customerService/types";
+import { GridInsertionType } from "src/application/service/domMutations/GridInsertionService";
+import { DOMInsertionType } from "src/application/service/domMutations/domInsertionService";
+import {
+  BOTTOM_REVIEWS_BAR_ID,
+  CHAT_PREVIEW_CONTAINER_ID,
+  TOP_SUGGESTION_BAR_PDP_ID,
+} from "src/config/divIds";
+import { SuggestionBarLocationForMetrics } from "src/types/suggestionBarV2-types";
+import {
+  ChatPreviewWidgetConfig,
+  ColorMapping,
+  ColorNames,
+  colorVar,
+  OrgPageConfig,
+  OrgUIConfig,
+  PageVariantTestType,
+  SuggestionBarWidgetV2Config,
+  WidgetType,
+} from "src/contexts/types";
+import { defaultOrgUIConfig } from "src/merchants/default";
+
+const leapsAndReboundsColors: ColorMapping = {
+  [ColorNames.TextPrimary]: "#101010",
+  [ColorNames.TextSecondary]: "#404040",
+  [ColorNames.TextAccent]: "#FF8228",
+  [ColorNames.TextLink]: "#101010",
+  [ColorNames.TextLight]: "#FFFFFF",
+  [ColorNames.BackgroundPrimary]: "#0A0A0A",
+  [ColorNames.BackgroundSecondary]: "#F8F4EE",
+  [ColorNames.BackgroundSecondaryDark]: "#E4E0DB",
+  [ColorNames.BackgroundTertiary]: "#F8F4EE",
+  [ColorNames.BackgroundDark]: "#0A0A0A",
+  [ColorNames.BackgroundLight]: "#FFFFFF",
+  [ColorNames.BackgroundSaturated]: "#FFE8C0",
+  [ColorNames.BorderLight]: "#E3E3E3",
+  [ColorNames.BorderMedium]: "#C7C7C7",
+  [ColorNames.BorderDark]: "#777777",
+  [ColorNames.BorderOutline]: "#0A0A0A",
+  [ColorNames.AccentPrimary]: "#FF8228",
+  [ColorNames.AccentSecondary]: "#FF8228",
+};
+
+const leapsAndReboundsOrgUIConfig = (): OrgUIConfig => {
+  const defaultLeapsAndReboundsOrgConfig = defaultOrgUIConfig(
+    OrgShortName.LeapsAndRebounds
+  );
+
+  return {
+    ...defaultLeapsAndReboundsOrgConfig,
+    chatMessageConfig: {
+      ...defaultLeapsAndReboundsOrgConfig.chatMessageConfig,
+      assistantChatTitle: "Leaps and Rebounds AI",
+      variant: "standard",
+    },
+    chatHeader: {
+      ...defaultLeapsAndReboundsOrgConfig.chatHeader,
+      imageSrc: CdnService.getAssetURL(
+        "leapsandrebounds-black-bg.png",
+        OrgShortName.LeapsAndRebounds
+      ),
+    },
+    chatPreviewConfig: {
+      ...defaultLeapsAndReboundsOrgConfig.chatPreviewConfig!,
+      iconFillColor: colorVar(ColorNames.AccentPrimary),
+      buttonTextColor: colorVar(ColorNames.TextLight),
+      buttonBackgroundColor: colorVar(ColorNames.BackgroundDark),
+      buttonTextHoverColor: colorVar(ColorNames.TextPrimary),
+      buttonBackgroundHoverColor: colorVar(ColorNames.BackgroundSecondaryDark),
+      topMargin: 10,
+      copies: {
+        plp: [
+          "a fitness tool that's fun for the whole family?",
+          "an upgrade to make your workouts more fun?",
+          "the ideal rebounder size for your space?",
+          "the right rebounder for cardio and strength training?",
+        ],
+        pdp: [
+          "the benefits of rebounding?",
+          "the details about product care and maintenance?",
+          "the assembly instructions?",
+          "the warranty policy?",
+        ],
+      },
+      staticSuggestionCopies: {
+        plp: [
+          "Which product is best for a beginner like me?",
+          "What can I use to make my workouts more effective and fun?",
+          "Which product fits my home and lifestyle perfectly?",
+          "What accessories make rebounding even more effective?",
+        ],
+        pdp: [
+          "What's the best way to incorporate this into my fitness routine?",
+          "How does rebounding improve overall health and wellness?",
+          "What features ensure this is safe and durable?",
+          "What other products compliment well with this to enhance the rebounder experience?",
+        ],
+      },
+      headerConfig: {
+        ...defaultLeapsAndReboundsOrgConfig.chatPreviewConfig!.headerConfig!,
+        imageHeight: 24,
+        imageSrc: CdnService.getAssetURL(
+          "leapsandrebounds-white-bg.png",
+          OrgShortName.LeapsAndRebounds
+        ),
+      },
+      footerConfig: {
+        ...defaultLeapsAndReboundsOrgConfig.chatPreviewConfig!.footerConfig,
+        replyButtonIcon: "magnifyingGlass",
+      },
+    },
+    floatingEntrypointConfig: {
+      ...defaultLeapsAndReboundsOrgConfig.floatingEntrypointConfig!,
+      position: "bottom-right",
+      showOption: "always",
+      expandedColor: colorVar(ColorNames.BorderOutline),
+      expansionText: {
+        pdp: "Let's find out if this is right for your fitness goals.",
+        plp: "Ready to discover your new favorite way to work out?",
+      },
+      iconSVGSrc: CdnService.getAssetURL(
+        "chat-icon.svg",
+        OrgShortName.LeapsAndRebounds
+      ),
+      iconSize: 40,
+      height: 72,
+      fontSize: 16,
+    },
+    productCardConfig: {
+      ...defaultLeapsAndReboundsOrgConfig.productCardConfig!,
+    },
+    productReviewConfig: {
+      ...defaultLeapsAndReboundsOrgConfig.productReviewConfig!,
+      colorVariant: "brand",
+      incentivizedReviewFlag: false,
+    },
+    welcomeSectionConfig: {
+      ...defaultLeapsAndReboundsOrgConfig.welcomeSectionConfig!,
+      title: "Welcome to Leaps & Rebounds AI!",
+      colorVariant: "accent",
+      subtitle:
+        "Hi there! I'm here to help you bounce into fitness with ease. Whether you're looking for the perfect rebounder, tips on workouts, or care instructions, let's make your fitness journey fun and exciting!",
+    },
+    customerServiceIntegration: {
+      integrationMode: CustomerServiceIntegrationMode.simple,
+      provider: CustomerServiceType.shopify,
+      useUnifiedButton: true,
+    },
+    merchantOverrideCss: `
+      .spiffy-star-rating-star {
+        fill: var(--spiffy-colors-accent-primary) !important;
+      }
+      .spiffy-product-review-header-reviewer {
+        color: var(--spiffy-colors-text-primary) !important;
+      }
+      .spiffy-product-review-verified-buyer-icon {
+        fill: var(--spiffy-colors-accent-secondary) !important;
+      }
+
+      #spiffy-ai-chat-preview.is-pdp {
+        border-top: solid 1px #A0AEC099;
+        padding-top: 12px;
+        margin-left: auto;
+        margin-right: auto;
+        max-width: min(1200px, calc(100% - 30px));
+      }
+      @media (min-width: 1024px) {
+        #spiffy-top-suggestion-bar-id {
+          max-width: 465px;
+        }
+      }
+      .spiffy-product-card-title {
+        font-family: var(--chakra-fonts-heading);
+        color: var(--spiffy-colors-text-link);
+      }
+      .spiffy-product-card-text-color {
+        color: var(--spiffy-colors-text-secondary);
+      }
+
+      #spiffy-top-suggestion-bar-contents button span,
+      #spiffy-bottom-suggestion-bar-contents button span{
+        font-family: inherit !important;
+      }
+
+      #spiffy-ai-floating-button {
+        z-index: 10000000000 !important;
+      }
+
+      .spiffy-floating-button-position {
+        top: calc(100% - 90px) !important;
+
+        @media (max-width: 640px) {
+          top: calc(100% - 142px) !important;
+        }
+      }
+
+      .spiffy-floating-button button {
+        height: 60px;
+        width: 60px;
+      }
+      `,
+  };
+};
+
+const leapsAndReboundsPageConfig = (): OrgPageConfig => ({
+  pageVariants: [
+    {
+      variantId: "plp",
+      variantType: "plp",
+      variantTests: [{ testType: PageVariantTestType.UrlResolver }],
+      plpIdExtractor: "url-resolver-plp-id",
+      widgetMounting: [
+        // Remove the ChatPreview widget from L&R while they redesign a widget to work well with it
+        // https://www.notion.so/spiffy-ai/L-R-Remove-embed-widget-from-PLP-PDP-and-homepage-1ace47c0828780c08f19c0e2428efed8
+        // {
+        //   mountingConfigId: 'chatPreviewPLP',
+        //   widgetConfigId: 'chatPreviewPLP',
+        // },
+      ],
+    },
+    {
+      variantId: "pdp",
+      variantType: "pdp",
+      variantTests: [{ testType: PageVariantTestType.UrlResolver }],
+      productIdExtractor: "url-resolver-product-id",
+      widgetMounting: [
+        {
+          mountingConfigId: "topSuggestionBarPDP",
+          widgetConfigId: "topSuggestionsBar",
+        },
+        // Remove the ChatPreview widget from L&R while they redesign a widget to work well with it
+        // https://www.notion.so/spiffy-ai/L-R-Remove-embed-widget-from-PLP-PDP-and-homepage-1ace47c0828780c08f19c0e2428efed8
+        // {
+        //   mountingConfigId: 'chatPreviewPDP',
+        //   widgetConfigId: 'chatPreview',
+        // },
+        {
+          mountingConfigId: "bottomSuggestionBarPDP",
+          widgetConfigId: "bottomSuggestionsBar",
+        },
+      ],
+    },
+    {
+      variantId: "home",
+      variantType: "homepage",
+      variantTests: [
+        {
+          testType: PageVariantTestType.UrlResolver,
+        },
+      ],
+      widgetMounting: [
+        // Remove the ChatPreview widget from L&R while they redesign a widget to work well with it
+        // https://www.notion.so/spiffy-ai/L-R-Remove-embed-widget-from-PLP-PDP-and-homepage-1ace47c0828780c08f19c0e2428efed8
+        // {
+        //   mountingConfigId: 'chatPreviewHome',
+        //   widgetConfigId: 'chatPreviewHome',
+        // },
+      ],
+    },
+  ],
+  widgetConfigs: {
+    topSuggestionsBar: {
+      widgetConfigId: "topSuggestionsBar",
+      contentId: "spiffy-top-suggestion-bar-contents",
+      metricDisplayLocation: ChatElementDisplayLocation.TOP_REVIEWS_SNIPPET,
+      type: WidgetType.SuggestionBarV2,
+      location: SuggestionBarLocationForMetrics.SUGGESTION_BAR_TOP,
+      variant: "secondary",
+      hoverVariant: "secondaryDark",
+      buttonTexts: {
+        default: [
+          "Summarize the reviews",
+          "Why is this right for my fitness goals?",
+          "What are the benefits of rebounding?",
+          "How does this elevate the average workout experience?",
+          "How do users describe the ease of setup and use?",
+        ],
+      },
+      boldFirstButton: true,
+      twoRowsOnMobile: false,
+      animationSpeed: "standard",
+      buttonBorderRadius: "md",
+    } satisfies SuggestionBarWidgetV2Config,
+    chatPreviewPLP: {
+      widgetConfigId: "chatPreviewPLP",
+      type: WidgetType.ChatPreview,
+      variant: "flat",
+      addSeparators: true,
+      footerConfig: {
+        replyButtonText: "What can I help you find?",
+        replyButtonIcon: "magnifyingGlass",
+      },
+    } satisfies ChatPreviewWidgetConfig,
+    chatPreview: {
+      widgetConfigId: "chatPreview",
+      type: WidgetType.ChatPreview,
+      variant: "flat",
+    } satisfies ChatPreviewWidgetConfig,
+    chatPreviewHome: {
+      widgetConfigId: "chatPreview",
+      type: WidgetType.ChatPreview,
+      variant: "flat",
+      footerConfig: {
+        replyButtonText: "What can I help you find?",
+        replyButtonIcon: "magnifyingGlass",
+      },
+    } satisfies ChatPreviewWidgetConfig,
+    bottomSuggestionsBar: {
+      widgetConfigId: "bottomSuggestionsBar",
+      contentId: "spiffy-bottom-suggestion-bar-contents",
+      metricDisplayLocation: ChatElementDisplayLocation.BOTTOM_REVIEWS_SNIPPET,
+      type: WidgetType.SuggestionBarV2,
+      location: SuggestionBarLocationForMetrics.SUGGESTION_BAR_BOTTOM,
+      variant: "darkAccent",
+      hoverVariant: "secondaryDark",
+      buttonTexts: {
+        default: [
+          "Summarize the reviews",
+          "Why is this right for my fitness goals?",
+          "What are the benefits of rebounding?",
+          "How does this elevate the average workout experience?",
+          "How do users describe the ease of setup and use?",
+        ],
+      },
+      boldFirstButton: true,
+      twoRowsOnMobile: true,
+      animationSpeed: "none",
+      buttonBorderRadius: "md",
+    } satisfies SuggestionBarWidgetV2Config,
+  },
+  mountingConfigs: {
+    chatPreviewHome: {
+      mountingConfigId: "chatPreviewHome",
+      containerId: CHAT_PREVIEW_CONTAINER_ID,
+      testId: CHAT_PREVIEW_TESTID,
+      insertionPoint: {
+        selector: ".home-value-wrapper",
+        insertionType: DOMInsertionType.AFTER,
+      },
+      style: {
+        borderTop: "solid 1px #A0AEC099",
+        paddingTop: "12px",
+        paddingBottom: "12px",
+        marginLeft: "auto",
+        marginRight: "auto",
+        maxWidth: "min(1200px, calc(100% - 30px))",
+      },
+    },
+    chatPreviewPLP: {
+      mountingConfigId: "chatPreviewPLP",
+      containerId: CHAT_PREVIEW_CONTAINER_ID,
+      testId: CHAT_PREVIEW_TESTID,
+      insertionPoint: {
+        selector: ".collections-products",
+        insertionType: DOMInsertionType.AFTER,
+      },
+      gridInsertionType: GridInsertionType.FIXED_4,
+      style: {
+        gridColumn: "1 / -1",
+      },
+    },
+    chatPreviewPDP: {
+      mountingConfigId: "chatPreviewPDP",
+      containerId: CHAT_PREVIEW_CONTAINER_ID,
+      testId: CHAT_PREVIEW_TESTID,
+      insertionPoint: {
+        selector: ".home-value-wrapper",
+        insertionType: DOMInsertionType.AFTER,
+      },
+      style: {
+        borderTop: "solid 1px #A0AEC099",
+        paddingTop: "12px",
+        paddingBottom: "12px",
+        marginLeft: "auto",
+        marginRight: "auto",
+        maxWidth: "min(1200px, calc(100% - 30px))",
+      },
+    },
+    topSuggestionBarPDP: {
+      mountingConfigId: "topSuggestionBarPDP",
+      containerId: TOP_SUGGESTION_BAR_PDP_ID,
+      testId: TOP_SUGGESTION_BAR_TESTID,
+      insertionPoint: {
+        selector: ".product-carousel__product-description-list",
+        insertionType: DOMInsertionType.BEFORE,
+      },
+      style: { marginBottom: "15px" },
+    },
+    bottomSuggestionBarPDP: {
+      mountingConfigId: "bottomSuggestionBarPDP",
+      containerId: BOTTOM_REVIEWS_BAR_ID,
+      testId: BOTTOM_SUGGESTION_BAR_TESTID,
+      insertionPoint: {
+        selector: ".yotpo-header-container",
+        insertionType: DOMInsertionType.AFTER,
+      },
+      style: { marginBottom: "15px" },
+    },
+  },
+});
+
+const leapsAndReboundsOrgInfo = {
+  shortName: OrgShortName.LeapsAndRebounds,
+  name: "Leaps and Rebounds",
+  domain: "leapsandrebounds.com",
+  defaultProductId: "bungee-rebounders-mini-trampoline",
+  alwaysEnabledMerchants: true,
+  orgUIConfig: leapsAndReboundsOrgUIConfig,
+  orgColors: () => leapsAndReboundsColors,
+  orgPageConfig: leapsAndReboundsPageConfig,
+} satisfies BasicOrgInfoType;
+
+export { leapsAndReboundsOrgInfo };