[CARE-4941] Update usages of @prezly/analytics-nextjs

prezly · May 10, 2024 · 9665fc9 · 9665fc9
1 parent 8b405e7
commit 9665fc9
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 19 deletions.
diff --git a/components/ContentRenderer/components/Attachment/Attachment.tsx b/components/ContentRenderer/components/Attachment/Attachment.tsx
@@ -1,4 +1,4 @@
-import { STORY_FILE, useAnalytics } from '@prezly/analytics-nextjs';
+import { DOWNLOAD, useAnalytics } from '@prezly/analytics-nextjs';
 import type { AttachmentNode } from '@prezly/story-content-format';
 import { translations } from '@prezly/theme-kit-intl';
 import { UploadcareFile } from '@prezly/uploadcare';
@@ -26,7 +26,7 @@ function Attachment({ node }: Props) {
     const fileType = fileExtension?.toUpperCase();
 
     function handleClick() {
-        track(STORY_FILE.DOWNLOAD, { id: file.uuid });
+        track(DOWNLOAD.ATTACHMENT, { id: file.uuid });
     }
 
     return (

diff --git a/components/ContentRenderer/components/Gallery.tsx b/components/ContentRenderer/components/Gallery.tsx
@@ -1,4 +1,4 @@
-import { STORY_GALLERY_IMAGE, useAnalytics } from '@prezly/analytics-nextjs';
+import { VIEW, DOWNLOAD, useAnalytics } from '@prezly/analytics-nextjs';
 import { Elements } from '@prezly/content-renderer-react-js';
 import type { GalleryNode } from '@prezly/story-content-format';
 
@@ -13,10 +13,10 @@ function Gallery({ node }: Props) {
         <Elements.Gallery
             node={node}
             onImageDownload={(image) => {
-                track(STORY_GALLERY_IMAGE.DOWNLOAD, { id: image.uuid });
+                track(DOWNLOAD.GALLERY_IMAGE, { id: image.uuid });
             }}
             onPreviewOpen={(image) => {
-                track(STORY_GALLERY_IMAGE.VIEW, { id: image.uuid });
+                track(VIEW.GALLERY_IMAGE, { id: image.uuid });
             }}
         />
     );

diff --git a/components/ContentRenderer/components/Image.tsx b/components/ContentRenderer/components/Image.tsx
@@ -1,4 +1,4 @@
-import { STORY_IMAGE, useAnalytics } from '@prezly/analytics-nextjs';
+import { DOWNLOAD, VIEW, useAnalytics } from '@prezly/analytics-nextjs';
 import { Elements } from '@prezly/content-renderer-react-js';
 import type { ImageNode } from '@prezly/story-content-format';
 import type { PropsWithChildren } from 'react';
@@ -14,10 +14,10 @@ function Image({ node, children }: PropsWithChildren<Props>) {
         <Elements.Image
             node={node}
             onDownload={(image) => {
-                track(STORY_IMAGE.DOWNLOAD, { id: image.uuid });
+                track(DOWNLOAD.IMAGE, { id: image.uuid });
             }}
             onPreviewOpen={(image) => {
-                track(STORY_IMAGE.VIEW, { id: image.uuid });
+                track(VIEW.IMAGE, { id: image.uuid });
             }}
         >
             {children}

diff --git a/components/RichText/Link.tsx b/components/RichText/Link.tsx
@@ -1,4 +1,3 @@
-import { STORY_LINK, useAnalytics } from '@prezly/analytics-nextjs';
 import type { LinkNode } from '@prezly/story-content-format';
 import classNames from 'classnames';
 import type { PropsWithChildren } from 'react';
@@ -8,20 +7,13 @@ interface Props {
 }
 
 function Link({ node, children }: PropsWithChildren<Props>) {
-    const { track } = useAnalytics();
-
-    function handleClick() {
-        track(STORY_LINK.CLICK, { href: node.href });
-    }
-
     return (
         <a
             href={node.href}
             className={classNames(
                 'text-neutral-200 underline hover:text-blue-400 active:text-blue-500',
                 'focus:text-blue-400 focus:outline-none',
             )}
-            onClick={handleClick}
         >
             {children}
         </a>

diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -1,4 +1,4 @@
-import { AnalyticsContextProvider } from '@prezly/analytics-nextjs';
+import { AnalyticsProvider, Tracking } from '@prezly/analytics-nextjs';
 import { DEFAULT_LOCALE, LocaleObject } from '@prezly/theme-kit-core';
 import type { PageProps } from '@prezly/theme-kit-nextjs';
 import { NewsroomContextProvider } from '@prezly/theme-kit-nextjs';
@@ -36,14 +36,15 @@ function App({ Component, pageProps }: AppProps) {
                 defaultLocale={DEFAULT_LOCALE}
                 messages={translations}
             >
-                <AnalyticsContextProvider
+                <AnalyticsProvider
                     isEnabled={isTrackingEnabled}
                     newsroom={newsroom}
                     story={currentStory}
                 >
+                    <Tracking />
                     {/* eslint-disable-next-line react/jsx-props-no-spreading */}
                     <Component {...customPageProps} />
-                </AnalyticsContextProvider>
+                </AnalyticsProvider>
             </IntlProvider>
         </NewsroomContextProvider>
     );