// components/footerLinks/GDPRPolicy.tsx
"use client";

import React from "react";
import { WebsiteFooter } from "@/components/website/WebsiteFooter";
import { WebsiteHeader } from "../website/WebsiteHeader";

interface GDPRPolicyProps {
  gdprPolicyPageData: {
    gdprPolicyPage?: {
      pageTitle?: string;
      shortContent?: string;
      fullContent?: string;
    };
    headerFooterImage?: any;
    socialLinks?: any[];
  } | null;
}

const GDPRPolicy = ({ gdprPolicyPageData }: GDPRPolicyProps) => {
  if (!gdprPolicyPageData?.gdprPolicyPage) {
    return (
      <div className="min-h-screen w-full flex items-center justify-center">
        <p className="text-muted-foreground">Loading...</p>
      </div>
    );
  }

  const { pageTitle, shortContent, fullContent } = gdprPolicyPageData.gdprPolicyPage;

  return (
    <div className="min-h-screen w-full flex flex-col">
              <WebsiteHeader headerData={gdprPolicyPageData?.headerFooterImage} />

      {/* Main Content */}
      <div className="flex-1 w-full py-10 px-5 md:px-0 md:max-w-5xl mx-auto">
        <h1 className="text-3xl font-bold mt-5 text-foreground">{pageTitle}</h1>
        <div className="w-full h-px bg-border my-4"></div>

        {shortContent && (
          <div
            className="prose max-w-full
                       list-disc list-outside 
                       [&>ul]:list-disc [&>ul]:pl-6
                       [&>ol]:list-decimal [&>ol]:pl-6
                       prose-p:text-muted-foreground prose-li:text-muted-foreground
                       prose-headings:text-foreground prose-strong:text-foreground
                       leading-relaxed"
            dangerouslySetInnerHTML={{ __html: shortContent }}
          />
        )}

        {fullContent && (
          <div
            className="prose max-w-full mt-4
                       list-disc list-outside 
                       [&>ul]:list-disc [&>ul]:pl-6
                       [&>ol]:list-decimal [&>ol]:pl-6
                       prose-p:text-muted-foreground prose-li:text-muted-foreground
                       prose-headings:text-foreground prose-strong:text-foreground
                       leading-relaxed"
            dangerouslySetInnerHTML={{ __html: fullContent }}
          />
        )}
      </div>

      {/* Footer */}
      <WebsiteFooter
        footerData={gdprPolicyPageData?.headerFooterImage}
        socialLinks={gdprPolicyPageData?.socialLinks}
      />
    </div>
  );
};

export default GDPRPolicy;