import type { Metadata, Viewport } from "next";
import "./globals.css";
import Intro from "./intro";

const SITE = "https://francktwl.fr";
const NAME = "Franck Thiaw-Woaye-Lapierre";
const TAGLINE = "Développeur web & DevOps à La Réunion";
const DESCRIPTION =
  "Franck Thiaw-Woaye-Lapierre — étudiant en L3 informatique à La Réunion. " +
  "Développement web (Laravel, React) et DevOps : serveurs Linux, Docker, auto-hébergement.";

export const metadata: Metadata = {
  metadataBase: new URL(SITE),
  title: {
    default: `${NAME} — ${TAGLINE}`,
    template: `%s · ${NAME}`,
  },
  description: DESCRIPTION,
  applicationName: `${NAME} · Portfolio`,
  authors: [{ name: NAME, url: SITE }],
  creator: NAME,
  publisher: NAME,
  keywords: [
    NAME,
    "Franck Thiaw Woaye Lapierre",
    "francktwl",
    "développeur La Réunion",
    "développeur web Réunion",
    "DevOps La Réunion",
    "DevOps Réunion 974",
    "administrateur système Réunion",
    "développeur Laravel Réunion",
    "auto-hébergement",
    "Linux",
    "Docker",
    "portfolio développeur Réunion",
  ],
  category: "technology",
  alternates: { canonical: "/" },
  openGraph: {
    type: "profile",
    firstName: "Franck",
    lastName: "Thiaw-Woaye-Lapierre",
    username: "francktwl",
    url: SITE,
    siteName: `${NAME} — Portfolio`,
    title: `${NAME} — ${TAGLINE}`,
    description: DESCRIPTION,
    locale: "fr_FR",
  },
  twitter: {
    card: "summary_large_image",
    title: `${NAME} — ${TAGLINE}`,
    description: DESCRIPTION,
  },
  robots: {
    index: true,
    follow: true,
    googleBot: {
      index: true,
      follow: true,
      "max-image-preview": "large",
      "max-snippet": -1,
      "max-video-preview": -1,
    },
  },

};

export const viewport: Viewport = {
  themeColor: "#0d1117",
};

export default function RootLayout({ children }: LayoutProps<"/">) {
  return (
    <html lang="fr" className="h-full">
      <body className="min-h-full antialiased">
        {children}
        <Intro />
        <noscript>
          <style>{`[data-intro-overlay]{display:none!important}`}</style>
        </noscript>
      </body>
    </html>
  );
}