From 927ee73be748a862ef05b4f53d77be1b83d00f50 Mon Sep 17 00:00:00 2001
From: Kamran Ahmed <kamranahmed.se@gmail.com>
Date: Sat, 16 Nov 2019 15:21:40 +0400
Subject: [PATCH] Add dotenv file loading

---
 .env.dist                  |  1 +
 components/helmet/index.js | 24 +++++++++++++-----------
 lib/gtag.js                |  4 +---
 next.config.js             |  7 +++++++
 package.json               |  1 +
 yarn.lock                  |  5 +++++
 6 files changed, 28 insertions(+), 14 deletions(-)
 create mode 100644 .env.dist

diff --git a/.env.dist b/.env.dist
new file mode 100644
index 000000000..aa76df02a
--- /dev/null
+++ b/.env.dist
@@ -0,0 +1 @@
+GA_SECRET=
diff --git a/components/helmet/index.js b/components/helmet/index.js
index 78a288924..fc158dfec 100644
--- a/components/helmet/index.js
+++ b/components/helmet/index.js
@@ -1,7 +1,5 @@
-const { PHASE_DEVELOPMENT_SERVER } = require('next/constants');
 import NextHead from 'next/head';
 import siteConfig from 'storage/site';
-import { GA_TRACKING_ID } from 'lib/gtag';
 
 const prepareTitle = (givenTitle) => {
   givenTitle = givenTitle || siteConfig.title;
@@ -56,15 +54,19 @@ const Helmet = (props) => (
     <link rel="icon" href="/static/manifest/favicon.ico" type="image/x-icon" />
 
     { /* Global Site Tag (gtag.js) - Google Analytics */ }
-    <script async src={ `https://www.googletagmanager.com/gtag/js?id=${GA_TRACKING_ID}` } />
-    <script dangerouslySetInnerHTML={{
-      __html: `
-        window.dataLayer = window.dataLayer || [];
-        function gtag(){dataLayer.push(arguments);}
-        gtag('js', new Date());
-        gtag('config', '${GA_TRACKING_ID}');
-      `,
-    }} />
+    { process.env.GA_SECRET && (
+      <>
+        <script async src={ `https://www.googletagmanager.com/gtag/js?id=${process.env.GA_SECRET}` } />
+        <script dangerouslySetInnerHTML={{
+          __html: `
+            window.dataLayer = window.dataLayer || [];
+            function gtag(){dataLayer.push(arguments);}
+            gtag('js', new Date());
+            gtag('config', '${process.env.GA_SECRET}');
+          `,
+        }} />
+      </>
+    )}
   </NextHead>
 );
 
diff --git a/lib/gtag.js b/lib/gtag.js
index f05a9dbd6..56594ba18 100644
--- a/lib/gtag.js
+++ b/lib/gtag.js
@@ -1,5 +1,3 @@
-export const GA_TRACKING_ID = 'UA-139582634-1';
-
 // https://developers.google.com/analytics/devguides/collection/gtagjs/pages
 export const firePageView = url => {
   if (!window.gtag) {
@@ -7,7 +5,7 @@ export const firePageView = url => {
     return;
   }
 
-  window.gtag('config', GA_TRACKING_ID, {
+  window.gtag('config', process.env.GA_SECRET, {
     page_path: url,
   })
 };
diff --git a/next.config.js b/next.config.js
index cbc3387d1..f710eacd8 100644
--- a/next.config.js
+++ b/next.config.js
@@ -8,6 +8,8 @@ const {
   getRoadmapRoutes,
 } = require("./scripts/path-map");
 
+require('dotenv').config();
+
 const withMDX = require('@next/mdx')({
   extension: /\.(md|mdx)?$/,
   options: {
@@ -24,6 +26,11 @@ const options = {
     };
   },
 
+  // @todo read these from `process.env` and inject without having to write the vars here
+  env: {
+    GA_SECRET: process.env.GA_SECRET
+  },
+
   // Allow mdx and md files to be pages
   pageExtensions: ['jsx', 'js', 'mdx', 'md'],
 
diff --git a/package.json b/package.json
index 4532499cb..45cc0f08e 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
     "bootstrap": "^4.3.1",
     "classnames": "^2.2.6",
     "date-fns": "^2.6.0",
+    "dotenv": "^8.2.0",
     "font-awesome": "^4.7.0",
     "next": "^9.0.4",
     "node-sass": "^4.12.0",
diff --git a/yarn.lock b/yarn.lock
index e32dc581a..6dd274b66 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3390,6 +3390,11 @@ domutils@^1.7.0:
     dom-serializer "0"
     domelementtype "1"
 
+dotenv@^8.2.0:
+  version "8.2.0"
+  resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-8.2.0.tgz#97e619259ada750eea3e4ea3e26bceea5424b16a"
+  integrity sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==
+
 duplexify@^3.4.2, duplexify@^3.6.0:
   version "3.7.1"
   resolved "https://registry.yarnpkg.com/duplexify/-/duplexify-3.7.1.tgz#2a4df5317f6ccfd91f86d6fd25d8d8a103b88309"