From 9665fc93f4377950db565b0c9c7b44e2b850bc6a Mon Sep 17 00:00:00 2001
From: Ivan Voskoboinyk <ivan@voskoboinyk.com>
Date: Fri, 10 May 2024 14:49:04 +0200
Subject: [PATCH] [CARE-4941] Update usages of @prezly/analytics-nextjs

---
 .../ContentRenderer/components/Attachment/Attachment.tsx  | 4 ++--
 components/ContentRenderer/components/Gallery.tsx         | 6 +++---
 components/ContentRenderer/components/Image.tsx           | 6 +++---
 components/RichText/Link.tsx                              | 8 --------
 pages/_app.tsx                                            | 7 ++++---
 5 files changed, 12 insertions(+), 19 deletions(-)

diff --git a/components/ContentRenderer/components/Attachment/Attachment.tsx b/components/ContentRenderer/components/Attachment/Attachment.tsx
index 7c9e3323..d225a47f 100644
--- 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
index b373404b..6b4b6949 100644
--- 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
index 58bcfc5d..d0ba401b 100644
--- 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
index 6f90d166..354c8fa1 100644
--- 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,12 +7,6 @@ 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}
@@ -21,7 +14,6 @@ function Link({ node, children }: PropsWithChildren<Props>) {
                 '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
index 33ce786e..857f9198 100644
--- 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>
     );