Nye-TeeOff/frontend/src/app/layout.tsx

124 lines
3.7 KiB
TypeScript

import type { Metadata } from "next";
import { Mulish, Oswald } from "next/font/google";
import Script from "next/script";
import { Suspense } from "react";
import "./globals.css";
import Header from "@/components/Header";
import MatomoTracker from "@/components/MatomoTracker";
import SiteFooter from "@/components/SiteFooter";
import {
DEFAULT_DESCRIPTION,
DEFAULT_OG_IMAGE,
SITE_URL,
createOrganizationJsonLd,
createWebsiteJsonLd,
} from "@/app/seo";
const uiFont = Mulish({
subsets: ["latin"],
variable: "--font-ui",
display: "swap",
});
const displayFont = Oswald({
subsets: ["latin"],
variable: "--font-display",
display: "swap",
});
export const metadata: Metadata = {
metadataBase: new URL(SITE_URL),
title: {
default: "TeeOff.no - Komplett oversikt over ALLE norske golfbaner",
template: "%s | TeeOff.no",
},
description: DEFAULT_DESCRIPTION,
applicationName: "TeeOff",
manifest: "/site.webmanifest",
alternates: {
canonical: "/",
},
openGraph: {
type: "website",
locale: "nb_NO",
siteName: "TeeOff",
title: "TeeOff.no - Komplett oversikt over ALLE norske golfbaner",
description: DEFAULT_DESCRIPTION,
url: SITE_URL,
images: [
{
url: DEFAULT_OG_IMAGE,
width: 1600,
height: 900,
alt: "TeeOff.no",
},
],
},
twitter: {
card: "summary_large_image",
site: "@TeeOffno",
creator: "@TeeOffno",
title: "TeeOff.no - Komplett oversikt over ALLE norske golfbaner",
description: DEFAULT_DESCRIPTION,
images: [DEFAULT_OG_IMAGE],
},
robots: {
index: true,
follow: true,
googleBot: {
index: true,
follow: true,
'max-snippet': -1,
'max-image-preview': "large",
'max-video-preview': -1,
},
},
icons: {
icon: [
{ url: "/android-chrome-192x192.png", type: "image/png", sizes: "192x192" },
{ url: "/android-chrome-512x512.png", type: "image/png", sizes: "512x512" },
],
shortcut: [{ url: "/android-chrome-192x192.png", type: "image/png" }],
apple: [{ url: "/apple-touch-icon.png", sizes: "180x180", type: "image/png" }],
},
};
export default function RootLayout({ children }: { children: React.ReactNode }) {
const organizationJsonLd = createOrganizationJsonLd();
const websiteJsonLd = createWebsiteJsonLd();
return (
<html lang="nb">
<body className={`${uiFont.variable} ${displayFont.variable} antialiased`}>
<Script id="matomo-init" strategy="afterInteractive">
{`
var _paq = window._paq = window._paq || [];
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://analyse.envide.no/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '36']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
`}
</Script>
<Suspense fallback={null}>
<MatomoTracker />
</Suspense>
<script
type="application/ld+json"
dangerouslySetInnerHTML={{ __html: JSON.stringify(organizationJsonLd) }}
/>
<script
type="application/ld+json"
dangerouslySetInnerHTML={{ __html: JSON.stringify(websiteJsonLd) }}
/>
<Header />
{children}
<SiteFooter />
</body>
</html>
);
}