update title tag. inject script after consent

trilitech · Sep 4, 2024 · 5ff3fbc · 5ff3fbc
1 parent 6ee0b43
commit 5ff3fbc
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 17 deletions.
diff --git a/components/CookieBanner.tsx b/components/CookieBanner.tsx
@@ -14,18 +14,43 @@ import { PrimaryButton } from './buttons/PrimaryButton'
 import { SecondaryButton } from './buttons/SecondaryButton'
 import Cookies from 'js-cookie'
 
+function injectGoogleAnalyticsScripts() {
+  const scriptTag1 = document.createElement('script')
+  scriptTag1.setAttribute('strategy', 'afterInteractive')
+  scriptTag1.setAttribute(
+    'src',
+    'https://www.googletagmanager.com/gtag/js?id=G-39LG2721KV'
+  )
+
+  const scriptTag2 = document.createElement('script')
+  scriptTag2.setAttribute('id', 'google-analytics')
+  scriptTag2.setAttribute('strategy', 'afterInteractive')
+  scriptTag2.innerHTML = `
+      window.dataLayer = window.dataLayer || [];
+      function gtag(){dataLayer.push(arguments);}
+      gtag('js', new Date());
+      gtag('config', 'G-39LG2721KV');
+    `
+
+  document.head.appendChild(scriptTag1)
+  document.head.appendChild(scriptTag2)
+}
+
 export const CookieBanner = () => {
   const [isOpen, setIsOpen] = useState(false)
 
   useEffect(() => {
     const consent = Cookies.get('cookie-consent')
     if (!consent) {
       setIsOpen(true)
+    } else if (consent === 'accepted') {
+      injectGoogleAnalyticsScripts()
     }
   }, [])
 
   const handleAccept = () => {
     Cookies.set('cookie-consent', 'accepted', { expires: 365 })
+    injectGoogleAnalyticsScripts()
     setIsOpen(false)
   }
 

diff --git a/pages/_document.tsx b/pages/_document.tsx
@@ -6,22 +6,6 @@ export default function Document() {
     <Html lang='en'>
       <Head>
         <link rel='icon' href='/favicon.ico' />
-        <Script
-          strategy='afterInteractive'
-          src='https://www.googletagmanager.com/gtag/js?id=G-39LG2721KV'
-        />
-        <Script
-          id='google-analytics'
-          strategy='afterInteractive'
-          dangerouslySetInnerHTML={{
-            __html: `
-                window.dataLayer = window.dataLayer || [];
-                function gtag(){dataLayer.push(arguments);}
-                gtag('js', new Date());
-                gtag('config', 'G-39LG2721KV');
-              `
-          }}
-        />
       </Head>
       <body>
         <Main />

diff --git a/pages/index.tsx b/pages/index.tsx
@@ -96,7 +96,7 @@ export default function Home() {
   return (
     <>
       <Head>
-        <title>Staking App | Tezos</title>
+        <title>Staking Tezos | Tezos</title>
         <meta key='og.site_name' property='og:site_name' content='Tezos' />
         <meta name='description' content={metaDescription} />
         <meta property='og:description' content={metaDescription} />