From a201528a9776ec3e2759f47eba87c6d1122345ef Mon Sep 17 00:00:00 2001 From: angbur <41025473+angbur@users.noreply.github.com> Date: Sun, 22 Jan 2023 14:38:58 +0100 Subject: [PATCH] Add opt-in Google Analitics integration (#165) --- .github/workflows/main-branch.yml | 5 +++- .github/workflows/pull-request.yml | 2 +- astro.config.ts | 8 +++++- package-lock.json | 36 ++++++++++++++++++++++-- package.json | 1 + src/web/analytics/analytics.astro | 10 +++++++ src/web/analytics/clarity.astro | 22 +++++++++++++++ src/web/analytics/google-analytics.astro | 17 +++++++++++ src/web/components/layout.astro | 2 ++ 9 files changed, 97 insertions(+), 6 deletions(-) create mode 100644 src/web/analytics/analytics.astro create mode 100644 src/web/analytics/clarity.astro create mode 100644 src/web/analytics/google-analytics.astro diff --git a/.github/workflows/main-branch.yml b/.github/workflows/main-branch.yml index ac0ecec..2216a4a 100644 --- a/.github/workflows/main-branch.yml +++ b/.github/workflows/main-branch.yml @@ -60,9 +60,9 @@ jobs: - name: Install dependencies run: npm ci - name: Run Astro build command + run: npm run build env: PUBLIC_APP_ENV: snapshot - run: npm run build - name: Percy check env: PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }} @@ -85,6 +85,9 @@ jobs: run: npm ci - name: Run Astro build command run: npm run build + env: + PUBLIC_GA_MEASUREMENT_ID: ${{ secrets.PUBLIC_GA_MEASUREMENT_ID }} + PUBLIC_CLARITY_PROJECT_ID: ${{ secrets.PUBLIC_CLARITY_PROJECT_ID }} - name: Deploy to Netlify id: netlify uses: nwtgck/actions-netlify@v2 diff --git a/.github/workflows/pull-request.yml b/.github/workflows/pull-request.yml index d2e1f68..aa83f87 100644 --- a/.github/workflows/pull-request.yml +++ b/.github/workflows/pull-request.yml @@ -60,9 +60,9 @@ jobs: - name: Install dependencies run: npm ci - name: Run Astro build command + run: npm run build env: PUBLIC_APP_ENV: snapshot - run: npm run build - name: Percy check env: PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }} diff --git a/astro.config.ts b/astro.config.ts index f1785cb..0db81c8 100644 --- a/astro.config.ts +++ b/astro.config.ts @@ -1,12 +1,18 @@ import image from '@astrojs/image'; import tailwind from '@astrojs/tailwind'; +import partytown from '@astrojs/partytown'; import compress from 'astro-compress'; import { defineConfig } from 'astro/config'; import { visualizer } from 'rollup-plugin-visualizer'; // https://astro.build/config export default defineConfig({ - integrations: [tailwind(), image(), compress()], + integrations: [ + tailwind(), + image(), + compress(), + partytown({ config: { forward: ['dataLayer.push', 'clarity.push'] } }), + ], vite: { plugins: [visualizer()], }, diff --git a/package-lock.json b/package-lock.json index 390e84b..cdfdffa 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "devscard", "version": "0.0.1", "dependencies": { + "@astrojs/partytown": "1.0.2", "@floating-ui/dom": "1.1.0", "iconify-icon": "1.0.2", "nanoid": "4.0.0" @@ -157,6 +158,15 @@ "vfile-message": "^3.0.0" } }, + "node_modules/@astrojs/partytown": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@astrojs/partytown/-/partytown-1.0.2.tgz", + "integrity": "sha512-+pUjLxdp0SYqUO+X+FjFN95KxK7w4Rs5gIMQ7scKUWd2073D3/5hTlij9qNmX5Bk/tFHUfTivKIZ5p233Lpa9Q==", + "dependencies": { + "@builder.io/partytown": "^0.7.1", + "mrmime": "^1.0.0" + } + }, "node_modules/@astrojs/prism": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@astrojs/prism/-/prism-1.0.1.tgz", @@ -588,6 +598,14 @@ "node": ">=6.9.0" } }, + "node_modules/@builder.io/partytown": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@builder.io/partytown/-/partytown-0.7.5.tgz", + "integrity": "sha512-Zbr2Eo0AQ4yzmQr/36/h+6LKjmdVBB3Q5cGzO6rtlIKB/IOpbQVUZW+XAnhpJmJr9sIF97OZjgbhG9k7Sjn4yw==", + "bin": { + "partytown": "bin/partytown.cjs" + } + }, "node_modules/@emmetio/abbreviation": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/@emmetio/abbreviation/-/abbreviation-2.2.3.tgz", @@ -5915,7 +5933,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz", "integrity": "sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==", - "dev": true, "engines": { "node": ">=10" } @@ -9541,6 +9558,15 @@ "vfile-message": "^3.0.0" } }, + "@astrojs/partytown": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@astrojs/partytown/-/partytown-1.0.2.tgz", + "integrity": "sha512-+pUjLxdp0SYqUO+X+FjFN95KxK7w4Rs5gIMQ7scKUWd2073D3/5hTlij9qNmX5Bk/tFHUfTivKIZ5p233Lpa9Q==", + "requires": { + "@builder.io/partytown": "^0.7.1", + "mrmime": "^1.0.0" + } + }, "@astrojs/prism": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@astrojs/prism/-/prism-1.0.1.tgz", @@ -9862,6 +9888,11 @@ "to-fast-properties": "^2.0.0" } }, + "@builder.io/partytown": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@builder.io/partytown/-/partytown-0.7.5.tgz", + "integrity": "sha512-Zbr2Eo0AQ4yzmQr/36/h+6LKjmdVBB3Q5cGzO6rtlIKB/IOpbQVUZW+XAnhpJmJr9sIF97OZjgbhG9k7Sjn4yw==" + }, "@emmetio/abbreviation": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/@emmetio/abbreviation/-/abbreviation-2.2.3.tgz", @@ -13667,8 +13698,7 @@ "mrmime": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz", - "integrity": "sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==", - "dev": true + "integrity": "sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==" }, "ms": { "version": "2.1.2", diff --git a/package.json b/package.json index f852fd1..632a303 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ }, "devDependencies": { "@astrojs/image": "0.12.1", + "@astrojs/partytown": "1.0.2", "@astrojs/react": "1.2.2", "@astrojs/tailwind": "2.1.3", "@percy/cli": "1.17.0", diff --git a/src/web/analytics/analytics.astro b/src/web/analytics/analytics.astro new file mode 100644 index 0000000..5502ba0 --- /dev/null +++ b/src/web/analytics/analytics.astro @@ -0,0 +1,10 @@ +--- +import Clarity from './clarity.astro'; +import GoogleAnalytics from './google-analytics.astro'; + +const GA_MEASUREMENT_ID = import.meta.env.PUBLIC_GA_MEASUREMENT_ID; +const CLARITY_PROJECT_ID = import.meta.env.PUBLIC_CLARITY_PROJECT_ID; +--- + +{GA_MEASUREMENT_ID && } +{CLARITY_PROJECT_ID && } diff --git a/src/web/analytics/clarity.astro b/src/web/analytics/clarity.astro new file mode 100644 index 0000000..b28cd6f --- /dev/null +++ b/src/web/analytics/clarity.astro @@ -0,0 +1,22 @@ +--- +export interface Props { + id: string; +} + +const { id } = Astro.props; +--- + + diff --git a/src/web/analytics/google-analytics.astro b/src/web/analytics/google-analytics.astro new file mode 100644 index 0000000..ee4f5d7 --- /dev/null +++ b/src/web/analytics/google-analytics.astro @@ -0,0 +1,17 @@ +--- +export interface Props { + id: string; +} + +const { id } = Astro.props; +--- + + + diff --git a/src/web/components/layout.astro b/src/web/components/layout.astro index ec8948d..ad59179 100644 --- a/src/web/components/layout.astro +++ b/src/web/components/layout.astro @@ -1,5 +1,6 @@ --- import type { Data } from '@/types/data'; +import Analytics from '@/web/analytics/analytics.astro'; export interface Props extends Pick {} @@ -34,6 +35,7 @@ const { seo, i18n } = Astro.props; window.localStorage.setItem('theme', theme); +