"use client"

import { FilePlus } from "lucide-react"

import { FormPageHeader } from "@/app/dashboard/_components/form"
import { CommonTemplateTabNav } from "@/components/settings/common-template/components/common-template-tab-nav"
import { EmailTemplateCreateForm } from "@/components/settings/email-templates/create/email-template-create-form"

export function CreateEmailTemplatePage() {
  return (
    <div className="flex flex-col">
      <FormPageHeader
        backHref="/dashboard/settings/email-templates"
        parentLabel="Email templates"
        currentLabel="Create new"
        titleIcon={<FilePlus className="size-4 text-primary" />}
        title="Create email template"
        description="Add a new gallery template with name, subject, category, and HTML content."
      />

      <div className="overflow-hidden rounded-lg border border-border bg-background shadow-sm">
        <CommonTemplateTabNav />
        <div className="p-4 sm:p-6">
          <EmailTemplateCreateForm />
        </div>
      </div>
    </div>
  )
}