add ga4 gtag (#352)

* add ga4 gtag

* fix env var handling and loading in workflow

Author: Ethan-Arrowood

.github/workflows/deploy.yaml

@@ -56,6 +56,7 @@ jobs:
           ALGOLIA_APP_ID: ${{ secrets.ALGOLIA_APP_ID }}
           ALGOLIA_SEARCH_KEY: ${{ secrets.ALGOLIA_SEARCH_KEY }}
           ALGOLIA_INDEX_NAME: ${{ secrets.ALGOLIA_INDEX_NAME }}
+          GA4_TRACKING_ID: ${{ secrets.GA4_TRACKING_ID }}
         run: |
           echo "Building Docusaurus site..."
           echo "Using DOCUSAURUS_ROUTE_BASE_PATH: $DOCUSAURUS_ROUTE_BASE_PATH"

docusaurus.config.ts

@@ -243,6 +243,19 @@ const config: Config = {
 				},
 			},
 		],
+
+		// GA4
+		...(process.env.GA4_TRACKING_ID
+			? [
+					[
+						'@docusaurus/plugin-google-gtag',
+						{
+							trackingID: process.env.GA4_TRACKING_ID || '',
+							anonymizeIP: true,
+						},
+					],
+				]
+			: []),
 	],
 
 	themes: [

package-lock.json

@@ -23,6 +23,7 @@
 	"dependencies": {
 		"@docusaurus/core": "3.9.1",
 		"@docusaurus/plugin-client-redirects": "3.9.1",
+		"@docusaurus/plugin-google-gtag": "^3.9.1",
 		"@docusaurus/preset-classic": "3.9.1",
 		"@docusaurus/remark-plugin-npm2yarn": "3.9.1",
 		"@docusaurus/theme-mermaid": "3.9.1",