Fix banner tracking (#867)

* Fix banner tracking * remove duplicate tracking
guardian · Apr 4, 2023 · 4e549ba · 4e549ba
1 parent 3112be9
commit 4e549ba
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 20 deletions.
diff --git a/packages/modules/src/modules/banners/choiceCardsBanner/ChoiceCardsBanner.stories.tsx b/packages/modules/src/modules/banners/choiceCardsBanner/ChoiceCardsBanner.stories.tsx
@@ -15,7 +15,7 @@ import { PageTracking, TestTracking, Tracking } from '@sdc/shared/src/types';
 
 export default {
     component: ChoiceCardsBanner,
-    title: 'Banners/Subscriptions/ChoiceCardsBanner',
+    title: 'Banners/ChoiceCardsBanner',
 } as Meta;
 
 type ChoiceCardStoryProps = Omit<

diff --git a/packages/modules/src/modules/banners/choiceCardsBanner/ChoiceCardsBanner.tsx b/packages/modules/src/modules/banners/choiceCardsBanner/ChoiceCardsBanner.tsx
@@ -20,11 +20,9 @@ import {
     columnMarginOverrides,
     ctaOverridesBlue,
 } from './choiceCardsBannerStyles';
-import { createInsertEventFromTracking, getLocalCurrencySymbol } from '@sdc/shared/dist/lib';
-import { createViewEventFromTracking } from '@sdc/shared/dist/lib';
+import { getLocalCurrencySymbol } from '@sdc/shared/dist/lib';
 import { ChoiceCards } from './components/ChoiceCards';
 import { ContributionFrequency } from '@sdc/shared/src/types';
-import { HasBeenSeen, useHasBeenSeen } from '../../../hooks/useHasBeenSeen';
 import { ChoiceCardsBannerArticleCount } from './components/ChoiceCardsBannerArticleCount';
 import { SerializedStyles } from '@emotion/react';
 
@@ -84,20 +82,6 @@ export const ChoiceCardsBanner = ({
     const [choiceCardSelection, setChoiceCardSelection] = useState<
         ChoiceCardSelection | undefined
     >();
-    const [hasBeenSeen, setNode] = useHasBeenSeen({ threshold: 0 }, true) as HasBeenSeen;
-
-    useEffect(() => {
-        if (hasBeenSeen && tracking) {
-            // For ophan
-            if (submitComponentEvent) {
-                submitComponentEvent(createViewEventFromTracking(tracking, tracking.campaignCode));
-            }
-        }
-
-        if (submitComponentEvent && tracking) {
-            submitComponentEvent(createInsertEventFromTracking(tracking, tracking.campaignCode));
-        }
-    }, [hasBeenSeen, submitComponentEvent]);
 
     useEffect(() => {
         if (choiceCardAmounts?.amounts) {
@@ -128,7 +112,7 @@ export const ChoiceCardsBanner = ({
     const articleCount = <ChoiceCardsBannerArticleCount numArticles={numArticles ?? 0} />;
 
     return (
-        <section ref={setNode} css={banner(backgroundColor)} data-target={bannerId}>
+        <section css={banner(backgroundColor)} data-target={bannerId}>
             <Container
                 cssOverrides={
                     borderTopColorStyle

diff --git a/packages/modules/src/modules/banners/choiceCardsBanner/components/ChoiceCards.tsx b/packages/modules/src/modules/banners/choiceCardsBanner/components/ChoiceCards.tsx
@@ -149,7 +149,7 @@ export const ChoiceCards: React.FC<ChoiceCardProps> = ({
                 submitComponentEvent({
                     component: {
                         componentType: 'ACQUISITIONS_OTHER',
-                        id: componentId,
+                        id: 'contributions-banner-choice-cards',
                     },
                     action: 'VIEW',
                     abTest: {

diff --git a/packages/modules/src/modules/banners/common/BannerWrapper.tsx b/packages/modules/src/modules/banners/common/BannerWrapper.tsx
@@ -262,6 +262,7 @@ const withBannerData = (
                 separateArticleCount,
                 choiceCardAmounts,
                 tracking,
+                submitComponentEvent,
             };
 
             return (