diff --git a/src/components/WhatsNewBanner/index.tsx b/src/components/WhatsNewBanner/index.tsx
index 95dd6e14665..9a2eb81e606 100644
--- a/src/components/WhatsNewBanner/index.tsx
+++ b/src/components/WhatsNewBanner/index.tsx
@@ -1,11 +1,13 @@
 import { Link, View } from '@aws-amplify/ui-react';
 import { FiArrowRightCircle } from 'react-icons/fi';
 import { BannerContainer } from './styles';
+import { trackWhatsNewBanner } from '../../utils/track';
 
 export default function WhatsNewBanner({ href, content }) {
   return (
     <BannerContainer>
       <Link
+        onClick={trackWhatsNewBanner}
         href={href}
         padding={'4px 16px'}
         borderRadius={16}
diff --git a/src/utils/track.ts b/src/utils/track.ts
index 3fbb932cfed..5c35881a8f9 100644
--- a/src/utils/track.ts
+++ b/src/utils/track.ts
@@ -198,3 +198,19 @@ export const trackCopyClicks = (data) => {
     );
   });
 };
+
+// Track the click on the "Whats new" banner component
+export const trackWhatsNewBanner = () => {
+  const opt = {
+    event: {
+      type: 'click',
+      name: 'WhatsNewBanner'
+    }
+  };
+
+  AWSMA.ready(() => {
+    document.dispatchEvent(
+      new CustomEvent(AWSMA.TRIGGER_EVENT, { detail: opt })
+    );
+  });
+};