mirror of
https://github.com/jakejarvis/jarv.is.git
synced 2025-07-21 02:01:16 -04:00
173
pages/_app.tsx
Normal file
173
pages/_app.tsx
Normal file
@@ -0,0 +1,173 @@
|
||||
// @ts-nocheck
|
||||
// ^ type checking causes a bunch of issues in DefaultSeo, BE CAREFUL
|
||||
|
||||
import { useEffect } from "react";
|
||||
import { useRouter } from "next/router";
|
||||
import Script from "next/script";
|
||||
import type { AppProps } from "next/app";
|
||||
import { DefaultSeo, SocialProfileJsonLd } from "next-seo";
|
||||
import * as config from "../lib/config";
|
||||
|
||||
import meJpg from "../public/static/images/me.jpg";
|
||||
import faviconIco from "../public/static/images/favicon.ico";
|
||||
import appleTouchIconPng from "../public/static/images/apple-touch-icon.png";
|
||||
|
||||
import "../styles/index.scss";
|
||||
|
||||
export default function App({ Component, pageProps }: AppProps) {
|
||||
const router = useRouter();
|
||||
|
||||
useEffect(() => {
|
||||
// https://nextjs.org/docs/messages/next-script-for-ga
|
||||
// https://developers.google.com/analytics/devguides/collection/gtagjs/single-page-applications#measure_virtual_pageviews
|
||||
const handlePageview = (url: string) => {
|
||||
if (typeof window.gtag === "function") {
|
||||
window.gtag("set", "page_path", url);
|
||||
window.gtag("event", "page_view");
|
||||
}
|
||||
};
|
||||
|
||||
router.events.on("routeChangeComplete", handlePageview);
|
||||
return () => {
|
||||
router.events.off("routeChangeComplete", handlePageview);
|
||||
};
|
||||
}, [router.events]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<DefaultSeo
|
||||
defaultTitle={`${config.siteName} – ${config.shortDescription}`}
|
||||
titleTemplate={`%s – ${config.siteName}`}
|
||||
description={config.longDescription}
|
||||
canonical={`${config.baseURL}/`}
|
||||
openGraph={{
|
||||
site_name: config.siteName,
|
||||
title: `${config.siteName} – ${config.shortDescription}`,
|
||||
url: `${config.baseURL}/`,
|
||||
locale: "en_US",
|
||||
type: "website",
|
||||
images: [
|
||||
{
|
||||
url: `${config.baseURL}${meJpg.src}`,
|
||||
alt: `${config.siteName} – ${config.shortDescription}`,
|
||||
},
|
||||
],
|
||||
}}
|
||||
twitter={{
|
||||
handle: `@${config.twitterHandle}`,
|
||||
site: `@${config.twitterHandle}`,
|
||||
cardType: "summary",
|
||||
}}
|
||||
facebook={{
|
||||
appId: config.facebookAppId,
|
||||
}}
|
||||
additionalLinkTags={[
|
||||
{
|
||||
rel: "icon",
|
||||
href: "data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%236fbc4e' d='m27.7 5 17.1 9.8 8.5-4.9-17-9.9z'/%3E%3Cpath fill='%23ffb900' d='m27.7 14.8 8.6 4.9v19.7l8.5 4.9V14.8L27.7 5zm-8.5 24.6-8.5-4.9v19.6l17 9.9v-9.8l-8.5-5z'/%3E%3Cpath fill='%23009cdf' d='M27.7 44.3v-9.8l-8.5 4.9v9.8zm17.1 0-17.1 9.9V64l25.6-14.7V9.9l-8.5 4.9z'/%3E%3Cpath fill='%236fbc4e' d='m10.7 34.5 8.5 4.9 8.5-4.9-8.5-4.9zm8.5 14.7 8.5 5 17.1-9.9-8.5-4.9z'/%3E%3C/svg%3E",
|
||||
type: "image/svg+xml",
|
||||
},
|
||||
{
|
||||
rel: "icon",
|
||||
href: faviconIco.src,
|
||||
},
|
||||
{
|
||||
rel: "apple-touch-icon",
|
||||
href: appleTouchIconPng.src,
|
||||
sizes: `${appleTouchIconPng.width}x${appleTouchIconPng.height}`,
|
||||
},
|
||||
{
|
||||
rel: "manifest",
|
||||
href: "/site.webmanifest",
|
||||
},
|
||||
{
|
||||
rel: "alternate",
|
||||
href: `/feed.xml`,
|
||||
type: "application/rss+xml",
|
||||
title: `${config.siteName} (RSS)`,
|
||||
},
|
||||
{
|
||||
rel: "alternate",
|
||||
href: `/feed.atom`,
|
||||
type: "application/atom+xml",
|
||||
title: `${config.siteName} (Atom)`,
|
||||
},
|
||||
{
|
||||
rel: "webmention",
|
||||
href: `https://webmention.io/${config.webmentionId}/webmention`,
|
||||
},
|
||||
{
|
||||
rel: "pingback",
|
||||
href: `https://webmention.io/${config.webmentionId}/xmlrpc`,
|
||||
},
|
||||
{
|
||||
rel: "humans",
|
||||
href: `/humans.txt`,
|
||||
},
|
||||
{
|
||||
rel: "pgpkey",
|
||||
href: `/pubkey.asc`,
|
||||
type: "application/pgp-keys",
|
||||
},
|
||||
]}
|
||||
additionalMetaTags={[
|
||||
{
|
||||
name: "viewport",
|
||||
content: "width=device-width, initial-scale=1",
|
||||
},
|
||||
{
|
||||
name: "author",
|
||||
content: config.authorName,
|
||||
},
|
||||
{
|
||||
name: "monetization",
|
||||
content: config.monetization,
|
||||
},
|
||||
{
|
||||
name: "twitter:dnt",
|
||||
content: "on",
|
||||
},
|
||||
{
|
||||
name: "twitter:widgets:csp",
|
||||
content: "on",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<SocialProfileJsonLd
|
||||
type="Person"
|
||||
name="Jake Jarvis"
|
||||
url={`${config.baseURL}/`}
|
||||
sameAs={[
|
||||
`${config.baseURL}/`,
|
||||
"https://github.com/jakejarvis",
|
||||
"https://keybase.io/jakejarvis",
|
||||
"https://twitter.com/jakejarvis",
|
||||
"https://medium.com/@jakejarvis",
|
||||
"https://www.linkedin.com/in/jakejarvis/",
|
||||
"https://www.facebook.com/jakejarvis",
|
||||
"https://www.instagram.com/jakejarvis/",
|
||||
"https://mastodon.social/@jakejarvis",
|
||||
]}
|
||||
/>
|
||||
|
||||
{/* Inline script to restore light/dark theme preference ASAP */}
|
||||
<Script id="restore_theme" strategy="afterInteractive">{`
|
||||
try {
|
||||
var pref = localStorage.getItem("dark_mode"),
|
||||
dark = pref === "true" || (!pref && window.matchMedia("(prefers-color-scheme: dark)").matches);
|
||||
document.documentElement.setAttribute("data-theme", dark ? "dark" : "light");
|
||||
} catch (e) {}`}</Script>
|
||||
|
||||
<Script src={`https://www.googletagmanager.com/gtag/js?id=UA-1563964-4`} strategy="afterInteractive" />
|
||||
<Script id="ga4" strategy="afterInteractive">{`
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
gtag('config', 'UA-1563964-4', {
|
||||
anonymize_ip: true
|
||||
});`}</Script>
|
||||
|
||||
<Component {...pageProps} />
|
||||
</>
|
||||
);
|
||||
}
|
Reference in New Issue
Block a user