o2o-clinicad-frontend/src/features/plan/ui/PlanHeaderSection.tsx

35 lines
1.2 KiB
TypeScript

import { useCurrentMarketingPlan } from "@/features/plan/hooks/useCurrentMarketingPlan";
import { PlanHeaderDaysBadge } from "@/features/plan/ui/header/PlanHeaderDaysBadge";
import { PlanHeaderHeroBlobs } from "@/features/plan/ui/header/PlanHeaderHeroBlobs";
import { PlanHeaderHeroColumn } from "@/features/plan/ui/header/PlanHeaderHeroColumn";
import { PLAN_HEADER_BG_CLASS } from "@/features/plan/ui/header/planHeaderSectionClasses";
export function PlanHeaderSection() {
const { data, error } = useCurrentMarketingPlan();
if (error || !data) {
return null;
}
return (
<section
aria-label="마케팅 플랜 헤더"
className={`relative overflow-hidden scroll-mt-36 py-20 md:py-28 px-6 ${PLAN_HEADER_BG_CLASS}`}
>
<PlanHeaderHeroBlobs />
<div className="relative max-w-7xl mx-auto">
<div className="flex flex-col md:flex-row items-center md:items-start justify-between gap-10">
<PlanHeaderHeroColumn
clinicName={data.clinicName}
clinicNameEn={data.clinicNameEn}
date={data.createdAt}
targetUrl={data.targetUrl}
/>
<PlanHeaderDaysBadge />
</div>
</div>
</section>
);
}