"use client"

import { usePathname } from "next/navigation"
import { motion } from "framer-motion"

import { Header } from "@widgets/Header"

const AUTH_ROUTES = ["/login", "/register", "/under_maintenance"]

export default function EssentialTemplate({
	children,
}: {
	children: React.ReactNode
}) {
	const pathname = usePathname()
	const isAuthPage = AUTH_ROUTES.includes(pathname ?? "")

	if (isAuthPage) {
		return <>{children}</>
	}

	return (
		<div>
			<Header />
			<motion.div
				key={pathname}
				initial={{ opacity: 0, y: 8 }}
				animate={{ opacity: 1, y: 0 }}
				transition={{ duration: 0.25, ease: [0.16, 1, 0.3, 1] }}
			>
				{children}
			</motion.div>
		</div>
	)
}
