import { notFound } from 'next/navigation';
import Image from 'next/image';
import Link from 'next/link';

import Contact from './Contact';
import { getPostHtml } from '@/lib/markdown';

import styles from './page.module.scss';

export async function generateMetadata({
  params,
}: {
  params: { slug: string };
}) {
  const { title, excerpt } = await getPostHtml('case', params.slug);

  return {
    title,
    description:
      excerpt ||
      '平凯数据库已广泛应用在金融、政府与公共服务、公共通信和信息服务、能源、交通与物流、制造与高科技、快消与零售、互联网等多个行业',
  };
}

export default async function CaseDetailPage({
  params,
}: {
  params: { slug: string };
}) {
  const post = await getPostHtml('case', params.slug);

  if (!post) {
    notFound();
  }

  return (
    <div>
      <div className={styles.banner}>
        <div className={styles.container}>
          <div className={styles.inner}>
            <h1>{post.title}</h1>
            <h5>{post.excerpt}</h5>
            <Link href="/case" className="button-link reverse">
              查看全部客户案例
            </Link>
          </div>
        </div>
      </div>
      <div className={styles.container}>
        <div className={styles.postContainer}>
          <div className={styles.content}>
            <div
              className="markdown-body"
              dangerouslySetInnerHTML={{ __html: post.contentHtml }}
            />
          </div>
          <div className={styles.company}>
            <div className={styles.companyContainer}>
              <Image
                src={post.thumbnail}
                alt={post.title}
                width={120}
                height={40}
              />
              <h5>客户简介</h5>
              <p>行业：{post.industry||[].join(' ')}</p>
              <p>{post.company_desc}</p>
              <Contact />
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}