import { type Metadata } from 'next';
import { getConfigurations } from '@/lib/api/client';
import { Footer } from '@/components/layout/Footer';
import { type Locale } from '@/i18n';

interface RefundPolicyPageProps {
  params: Promise<{ locale: Locale }>;
}

export async function generateMetadata({ params }: RefundPolicyPageProps): Promise<Metadata> {
  const { locale } = await params;
  const isAr = locale === 'ar';

  return {
    title: isAr ? 'سياسة الاسترجاع والإلغاء | ShineCode' : 'Refund & Cancellation Policy | ShineCode',
    description: isAr
      ? 'تعرف على سياسة الاسترجاع والإلغاء لخدمات ShineCode في الإمارات.'
      : 'Learn about the refund and cancellation policies for ShineCode beauty and wellness services in UAE.',
    alternates: {
      canonical: `https://shinecode.ae/${locale}/refund-policy`,
      languages: {
        en: `https://shinecode.ae/en/refund-policy`,
        ar: `https://shinecode.ae/ar/refund-policy`,
        'x-default': `https://shinecode.ae/en/refund-policy`,
      },
    },
    openGraph: {
      title: isAr ? 'سياسة الاسترجاع والإلغاء | ShineCode' : 'Refund & Cancellation Policy | ShineCode',
      description: isAr
        ? 'تعرف على سياسة الاسترجاع والإلغاء لخدمات ShineCode في الإمارات.'
        : 'Learn about the refund and cancellation policies for ShineCode beauty and wellness services in UAE.',
      url: `https://shinecode.ae/${locale}/refund-policy`,
      siteName: 'ShineCode',
      images: ['https://shinecode.ae/images/frontend/socialP.webp'],
      locale: isAr ? 'ar_AE' : 'en_AE',
    },
  };
}

export default async function RefundPolicyPage({ params }: RefundPolicyPageProps) {
  const { locale } = await params;
  const isAr = locale === 'ar';

  let htmlContent: string | null = null;
  try {
    const configRes = await getConfigurations({ revalidate: 86400, tags: ['configurations'] });
    if (configRes.ok && configRes.data?.refund_policy) {
      htmlContent = configRes.data.refund_policy as string;
    }
  } catch (err) {
    console.error('[RefundPolicyPage] Error loading policy from API:', err);
  }

  return (
    <div className="min-h-screen bg-background flex flex-col">
      <main id="main-content" className="flex-1 py-16 md:py-20">
        <div className="container mx-auto px-4 max-w-4xl">
          <h1 className="text-3xl md:text-4xl font-bold text-ink mb-6 text-start">
            {isAr ? 'سياسة الاسترجاع والإلغاء' : 'Refund & Cancellation Policy'}
          </h1>
          {htmlContent ? (
            <div
              className="bg-surface border border-subtle rounded-2xl p-6 md:p-8 shadow-xs overflow-hidden"
              dangerouslySetInnerHTML={{ __html: htmlContent }}
            />
          ) : (
            <div className="bg-surface border border-subtle rounded-2xl p-6 md:p-8 text-muted space-y-4">
              <p>
                {isAr
                  ? 'في حال لم يتم تقديم الخدمة المحجوزة، تلتزم ShineCode باسترجاع كامل المبلغ. يرجى التواصل عبر contact@shinecode.ae خلال 24 ساعة من الموعد.'
                  : 'Should a booked service not be delivered, ShineCode will refund the full amount. Please reach out to contact@shinecode.ae within 24 hours.'}
              </p>
            </div>
          )}
        </div>
      </main>
      <Footer locale={locale} />
    </div>
  );
}