From c359aefdac08d258fa7c7c70c010b92afa7d9924 Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Tue, 3 Jan 2023 21:02:25 +0400 Subject: [PATCH] Add GA tracking --- src/components/Analytics/Analytics.astro | 16 +++++++ src/components/Analytics/analytics.ts | 53 ++++++++++++++++++++++++ src/layouts/BaseLayout.astro | 8 +++- 3 files changed, 76 insertions(+), 1 deletion(-) create mode 100644 src/components/Analytics/Analytics.astro create mode 100644 src/components/Analytics/analytics.ts diff --git a/src/components/Analytics/Analytics.astro b/src/components/Analytics/Analytics.astro new file mode 100644 index 000000000..883a42c0e --- /dev/null +++ b/src/components/Analytics/Analytics.astro @@ -0,0 +1,16 @@ +--- +--- + + + + diff --git a/src/components/Analytics/analytics.ts b/src/components/Analytics/analytics.ts new file mode 100644 index 000000000..375d6b17d --- /dev/null +++ b/src/components/Analytics/analytics.ts @@ -0,0 +1,53 @@ +export {}; + +declare global { + interface Window { + gtag: any; + fireEvent: (props: EventType) => void; + firePageView: (url: string) => void; + } +} + +/** + * Tracks the page view on google analytics + * @see https://developers.google.com/analytics/devguides/collection/gtagjs/pages + * @param url URL to track + * @returns void + */ +window.firePageView = (url: string) => { + if (!window.gtag) { + console.warn('Missing GTAG - Analytics disabled'); + return; + } + + window.gtag('config', 'UA-139582634-1', { + page_path: url, + }); +}; + +type EventType = { + action: string; + category: string; + label?: string; + value?: string; +}; + +/** + * Tracks the event on google analytics + * @see https://developers.google.com/analytics/devguides/collection/gtagjs/events + * @param props Event properties + * @returns void + */ +window.fireEvent = (props: EventType) => { + const { action, category, label, value } = props; + if (!window.gtag) { + console.warn('Missing GTAG - Analytics disabled'); + return; + } + + window.gtag('event', action, { + event_category: category, + event_label: label, + value: value, + }); +}; diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index 741385607..6d9aaf269 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -7,6 +7,7 @@ import type { SponsorType } from '../components/Sponsor/Sponsor.astro'; import Sponsor from '../components/Sponsor/Sponsor.astro'; import YouTubeBanner from '../components/YouTubeBanner.astro'; import { siteConfig } from '../lib/config'; +import Analytics from '../components/Analytics/Analytics.astro'; export interface Props { title: string; @@ -34,7 +35,10 @@ const { - {noIndex && } + + + + + +