56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
"use client"
|
|
|
|
import { AnimatePresence } from "framer-motion";
|
|
import { Montserrat } from "next/font/google";
|
|
import { useState, useEffect } from "react";
|
|
|
|
import NavigationBar from "@/components/navigation_bar.component";
|
|
import Transitioned from "@/components/transition.component";
|
|
import Loader from "@/components/loader.component";
|
|
|
|
import { ThemeProvider } from "@/providers/theme.provider";
|
|
import { GlobalLayout } from "@/styles";
|
|
|
|
const font = Montserrat({ subsets: ["latin"] });
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: Readonly<{
|
|
children: React.ReactNode;
|
|
}>) {
|
|
const [loading, setLoading] = useState(true);
|
|
|
|
useEffect(() => {
|
|
const handleComplete = () => setLoading(false);
|
|
|
|
const timer = setTimeout(handleComplete, 1000);
|
|
return () => clearTimeout(timer);
|
|
}, []);
|
|
|
|
return <>
|
|
<html lang="en">
|
|
{/*
|
|
can't use next.Metadata,
|
|
because "use client" + styled components are
|
|
preventing it.
|
|
|
|
next/head wouldn't work too, so legacy solution is used
|
|
*/}
|
|
<head>
|
|
<title>Parafia pw. Niepokalanego Serca NMP w Borzęcie</title>
|
|
<meta name="description" content="Strona parafii pod wezwaniem Niepokalanego Serca Najświętszej Maryi Panny w Borzęcie." />
|
|
</head>
|
|
<body className={font.className}>
|
|
<ThemeProvider>
|
|
<GlobalLayout />
|
|
{loading
|
|
? <Loader />
|
|
: <AnimatePresence mode="wait">
|
|
<NavigationBar />
|
|
<Transitioned>{children}</Transitioned>
|
|
</AnimatePresence>}
|
|
</ThemeProvider>
|
|
</body>
|
|
</html>
|
|
</>;
|
|
} |