Define icons, theme color and viewport once

Icons were set in both the layout metadata and every page's metadata,
and theme-color was output twice. Inherit icons from the layout and
export the viewport from the layout instead of from each page.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/app/[locale]/blog/[slug]/page.tsx

@@ -1,12 +1,12 @@
 import Footer from "@/components/page-sections/footer"
-import { generateSeoMetadata, generateSeoViewport } from "@/components/seo"
+import { generateSeoMetadata } from "@/components/seo"
 import Back from "@/components/ui/back"
 
 import { urlFor } from "@/lib/imageUrlBuilder"
 import { getBlogPost } from "@/lib/sanity"
 
 import { PortableText, PortableTextComponents } from "@portabletext/react"
-import { Metadata, Viewport } from "next"
+import { Metadata } from "next"
 import type { Locale } from "next-intl"
 import { notFound } from "next/navigation"
 import Image from "next/image"
@@ -71,10 +71,6 @@ export async function generateMetadata({
   })
 }
 
-export function generateViewport(): Viewport {
-  return generateSeoViewport()
-}
-
 const components: PortableTextComponents = {
   types: {
     image: ({ value }: { value: ImageValue }) => {

src/app/[locale]/event/[slug]/page.tsx

@@ -1,10 +1,10 @@
-import { generateSeoMetadata, generateSeoViewport } from "@/components/seo"
+import { generateSeoMetadata } from "@/components/seo"
 import Back from "@/components/ui/back"
 
 import { formatEventDate } from "@/lib/dates"
 import { getEvent } from "@/lib/sanity"
 
-import { Metadata, Viewport } from "next"
+import { Metadata } from "next"
 import type { Locale } from "next-intl"
 import { notFound } from "next/navigation"
 import { getTranslations } from "next-intl/server"
@@ -47,10 +47,6 @@ export async function generateMetadata({
   })
 }
 
-export function generateViewport(): Viewport {
-  return generateSeoViewport()
-}
-
 const Event = async ({ params }: EventPageParams) => {
   const { slug, locale } = await params
 

src/app/[locale]/layout.tsx

@@ -1,10 +1,11 @@
 import "@/app/globals.css"
 
 import { hasLocale, NextIntlClientProvider } from "next-intl"
-import type { Metadata } from "next"
+import type { Metadata, Viewport } from "next"
 import { notFound } from "next/navigation"
 
 import LanguageSelector from "@components/ui/languageSelector"
+import { THEME_COLOR } from "@/components/seo"
 import UmamiAnalytics from "@/components/umamiAnalytics"
 import { routing } from "@/i18n/routing"
 
@@ -19,6 +20,11 @@ export const metadata: Metadata = {
   },
 }
 
+export const viewport: Viewport = {
+  themeColor: THEME_COLOR,
+  colorScheme: "dark",
+}
+
 export function generateStaticParams() {
   return routing.locales.map(locale => ({ locale }))
 }

src/app/[locale]/page.tsx

@@ -5,9 +5,9 @@ import Events from "@/components/page-sections/events"
 import Footer from "@/components/page-sections/footer"
 import Hero from "@/components/page-sections/hero"
 import Office from "@/components/page-sections/office"
-import { generateSeoMetadata, generateSeoViewport } from "@/components/seo"
+import { generateSeoMetadata } from "@/components/seo"
 
-import { Metadata, Viewport } from "next"
+import { Metadata } from "next"
 import type { Locale } from "next-intl"
 
 export const revalidate = 3600 // 1 hour
@@ -26,10 +26,6 @@ export async function generateMetadata({
   return generateSeoMetadata({ locale })
 }
 
-export function generateViewport(): Viewport {
-  return generateSeoViewport()
-}
-
 export default function Home() {
   return (
     <>

src/components/seo.tsx

@@ -1,7 +1,9 @@
-import { Metadata, Viewport } from "next"
+import { Metadata } from "next"
 import type { Locale } from "next-intl"
 import { getTranslations } from "next-intl/server"
 
+export const THEME_COLOR = "#7d36e7"
+
 type SeoProps = {
   locale: Locale
   title?: string
@@ -22,17 +24,11 @@ export async function generateSeoMetadata({
   const defaultTitle = "UiO Gaming"
   const metaDescription = description || t("description")
   const siteUrl = "https://uiogaming.no"
-  const themeColor = "#7d36e7"
 
   return {
     title: title ? `${title} | ${defaultTitle}` : defaultTitle,
     description: metaDescription,
     authors: author ? [{ name: author }] : [{ name: "UiO Gaming" }],
-    icons: {
-      icon: "/logo_2024_neon_pink.png",
-      shortcut: "/logo_2024_neon_pink.png",
-      apple: "/logo_2024_neon_pink.png",
-    },
     openGraph: {
       title: title || defaultTitle,
       description: metaDescription,
@@ -62,17 +58,9 @@ export async function generateSeoMetadata({
       images: imageURL ? [imageURL] : [`${siteUrl}/logo_2024_neon_trans.png`],
     },
     other: {
-      "theme-color": themeColor,
-      "msapplication-TileColor": themeColor,
-      "msapplication-navbutton-color": themeColor,
+      "msapplication-TileColor": THEME_COLOR,
+      "msapplication-navbutton-color": THEME_COLOR,
       "apple-mobile-web-app-status-bar-style": "black-translucent",
     },
   }
 }
-
-export function generateSeoViewport(): Viewport {
-  return {
-    themeColor: "#7d36e7",
-    colorScheme: "dark",
-  }
-}