Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Upgrade dependencies, only load GTM when cookie consent is given
- Loading branch information
Showing
5 changed files
with
458 additions
and
1,352 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,37 +1,75 @@ | ||
| import type { AppProps } from "next/app" | ||
| import Head from "next/head" | ||
| import { useEffect } from "react" | ||
| import { useEffect, useRef, useState } from "react" | ||
| import CookieConsent, { getCookieConsentValue } from "react-cookie-consent" | ||
| import "tailwindcss/tailwind.css" | ||
| import Footer from "../components/Footer" | ||
| import NavBar from "../components/NavBar" | ||
| import "../public/global.css" | ||
| import * as gtag from "../utils/gtag" | ||
| import Script from "next/script" | ||
|
|
||
| export default function MyApp({ Component, pageProps, router }: AppProps) { | ||
| const [consented, setConsented] = useState(null as boolean | undefined | null) | ||
|
|
||
| useEffect(() => { | ||
| const value = getCookieConsentValue() | ||
| if (value == "true") | ||
| setConsented(true) | ||
| else if (value == "true") | ||
| setConsented(false) | ||
| else | ||
| setConsented(undefined) | ||
| }, []) | ||
|
|
||
| useEffect(() => { | ||
| if (!consented) | ||
| return | ||
|
|
||
| const handleRouteChange = (url: string) => { | ||
| gtag.pageview(url) | ||
| } | ||
| router.events.on("routeChangeComplete", handleRouteChange) | ||
| return () => { | ||
| router.events.off("routeChangeComplete", handleRouteChange) | ||
| } | ||
| }, [router.events]) | ||
| }, [router.events, consented]) | ||
|
|
||
| return <div className="bg-slate-50 dark:bg-slate-700 min-h-screen flex flex-col items-center justify-between text-slate-900 dark:text-slate-100"> | ||
| <Head> | ||
| <title>{router.pathname.substring(1).replace(/^\w/, w => w.toUpperCase())} | Hu Tao</title> | ||
| <link rel="icon" href="/favicon.ico" /> | ||
| <meta httpEquiv="content-language" content="en-us"></meta> | ||
|
|
||
| {consented && <Script async | ||
| src={`https://www.googletagmanager.com/gtag/js?id=${gtag.GA_TRACKING_ID}`} | ||
| />} | ||
| </Head> | ||
|
|
||
| <div className="w-full"> | ||
| <div className="w-full flex-1"> | ||
| <div className="absolute z-10"> | ||
| <CookieConsent | ||
| buttonText="Accept all cookies" | ||
| declineButtonText="Refuse non-essential cookies" | ||
| enableDeclineButton | ||
| onAccept={() => { | ||
| setConsented(true) | ||
| }} | ||
| onDecline={() => { | ||
| setConsented(false) | ||
| }} | ||
| > | ||
| This website uses cookies to enhance the user experience. | ||
| <div style={{ fontSize: "12px" }}>Currently we only use these for analytic purposes, intended to figure out where to focus our efforts.</div> | ||
| </CookieConsent> | ||
| </div> | ||
|
|
||
| <NavBar location={router.asPath} /> | ||
| <div className="p-4 flex flex-col w-full flex-1 px-1 lg:px-20 items-center justify-center"> | ||
| <Component {...pageProps} location={router.asPath} /> | ||
| </div> | ||
|
|
||
| <Footer location={router.asPath} marginBottom={consented || consented == null ? 3 : 80} /> | ||
| </div> | ||
| <Footer location={router.asPath} /> | ||
| </div> | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.