import { PublicLayout } from '@/components/layout/public/public-layout';
import MagazineInfo from '@/components/shared/magazine-info';
import PostContentRenderer from '@/components/tip-tap/tiptap-renderer/post-content-renderer';
import { createHelpers } from '@/lib/trpc/server';
import { Metadata } from 'next';
import { notFound } from 'next/navigation';
import { buildMetadataFromContent, generateMetaTags } from '@/lib/meta-tags/server';

const privacyContent = {
  title: 'Privatlivspolitik',
  description: 'Privatlivspolitik',
  author: 'Magasinet KBH',
  created: new Date('2018-02-20T09:51:20+01:00'),
  modified: new Date('2024-08-27T09:05:17+02:00'),
  url: 'https://magasinetkbh.dk/privatlivspolitik',
};

export async function generateMetadata(): Promise<Metadata> {
  return await buildMetadataFromContent(privacyContent);
}

export default async function PrivacyPage() {
  const helpers = await createHelpers();

  const [data, config] = await Promise.all([
    helpers.page.get.fetch({
      slug: 'privatlivspolitik'
    }),
    helpers.siteConfig.values.fetch()
  ]);

  if (!data) {
    notFound();
  }

  const { jsonLd } = await generateMetaTags(privacyContent);
  return (
    <PublicLayout>
      {jsonLd && (
        <script
          type='application/ld+json'
          dangerouslySetInnerHTML={{
            __html: JSON.stringify(jsonLd).replace(/</g, '\\u003c')
          }}
        />
      )}
      <section className='mx-auto flex w-full max-w-[1362px] grow flex-col items-center p-3 md:p-[30px] xl:flex-row xl:items-start xl:border-x'>
        <div className='flex flex-col xl:flex-row'>
          <div className='w-68 shrink-0'>
            <h2 className='text-xl leading-none font-bold text-[#CBCBCB] md:text-3xl'>
              Hvad gør vi med dine data?
            </h2>
          </div>
          <div className='w-full'>
            <h1 className='py-4 text-xl font-bold md:py-6 md:text-3xl'>
              {data.title}
            </h1>
            <PostContentRenderer nodeContent={data.content} />
          </div>
        </div>
        <MagazineInfo
          subscribersCount={config.facebookPageSubscribersTotal}
          newsletterCount={config.newsletterSubscribersTotal}
        />
      </section>
    </PublicLayout>
  );
}