91 lines
2.6 KiB
TypeScript

import { type PropsWithChildren } from 'react'
import { Toaster } from 'react-hot-toast'
import { DialogNews } from '~/components/dialog/news'
import { DialogSuccess } from '~/components/dialog/success'
import { useNewsContext } from '~/contexts/news'
import { Banner } from '~/layouts/news/banner'
import { FormForgotPassword } from '~/layouts/news/form-forgot-password'
import { FormLogin } from '~/layouts/news/form-login'
import { FormRegister } from '~/layouts/news/form-register'
import { FooterLinks } from './footer-links'
import { FooterNewsletter } from './footer-newsletter'
import { FormSubscribePlan } from './form-subscribe-plan'
import { HeaderMenu } from './header-menu'
import { HeaderTop } from './header-top'
export const NewsDefaultLayout = (properties: PropsWithChildren) => {
const { children } = properties
const {
isLoginOpen,
setIsLoginOpen,
isRegisterOpen,
setIsRegisterOpen,
isForgetOpen,
setIsForgetOpen,
isSuccessOpen,
setIsSuccessOpen,
isSubscribeOpen,
setIsSubscribeOpen,
} = useNewsContext()
return (
<main className="relative min-h-dvh bg-[#ECECEC]">
<header>
<HeaderTop />
<HeaderMenu />
</header>
<div className="sm:mx-[50px] sm:my-[25px] sm:grid sm:gap-y-[25px]">
<Banner />
{children}
</div>
<footer className="grid w-full grid-cols-1 gap-6 bg-[#2E2F7C] px-5 py-20 text-white sm:grid-cols-5 sm:gap-16 sm:px-16">
<FooterNewsletter />
<FooterLinks />
</footer>
<Toaster />
<DialogNews
isOpen={isLoginOpen}
onClose={() => setIsLoginOpen(false)}
description="Selamat Datang, silakan daftarkan akun Anda untuk melanjutkan!"
>
<FormLogin />
</DialogNews>
<DialogNews
isOpen={isRegisterOpen}
onClose={() => setIsRegisterOpen(false)}
description="Selamat Datang, silakan isi keterangan akun Anda untuk melanjutkan!"
>
<FormRegister />
</DialogNews>
<DialogNews
isOpen={isForgetOpen}
onClose={() => setIsForgetOpen(false)}
description="Selamat Datang, silakan isi keterangan akun Anda untuk melanjutkan!"
>
<FormForgotPassword />
</DialogNews>
<DialogNews
isOpen={isSubscribeOpen}
onClose={() => setIsSubscribeOpen(false)}
description="Selamat Datang, silakan Pilih Subscribe Plan Anda untuk melanjutkan!"
>
<FormSubscribePlan />
</DialogNews>
<DialogSuccess
isOpen={isSuccessOpen}
onClose={() => {
setIsSuccessOpen(undefined)
}}
/>
</main>
)
}