import * as fs from "fs";
import matter from 'gray-matter'
import {Metadata} from "next"
import Image from "next/image";
import dayjs from "dayjs";
import Link from "next/link";

import {Banner} from "@/components/Banner/Banner";
import iconDateSvg from '@/assets/icon-date.svg'

import styles from './page.module.sass'
import bannerImage from './pingcap-news.svg'

const pathname = './src/app/news/[slug]/markdown'

const title = '新闻报道'
// const description = ''

export const metadata: Metadata = {
  title,
  // description,
}

// export async function generateStaticParams() {
//   console.log({pathname})
//   const filenames = fs.readdirSync(pathname)
//   console.log({filenames})
//   return filenames
// }

// export async function generateMetadata({params}: { params: { slug: string } }): Promise<Metadata> {
//   const source = fs.readFileSync(pathname + '/' + decodeURIComponent(params.slug) + '.md').toString()
//   const {data, content} = matter(source)
//   return {
//     ...data,
//     description: data.summary,
//   }
// }

export default function NewsListPage() {
  const filenames = fs.readdirSync(pathname).filter((name) => name.endsWith('.md'))
  // console.log({filenames})
  const items: {title: string, date: Date, summary: string, slug: string}[] = []
  for (const filename of filenames) {
    const filepath = pathname + '/' + filename
    // console.log({filepath})
    try {
      const source = fs.readFileSync(filepath).toString()
      const {data, content} = matter(source)
      // console.log({data})
      const meta = data as {title: string, date: Date, summary: string}
      if (!(meta.title == null)) {
        items.push({...meta, slug: filename.replaceAll('.md', '')})
      }
    } catch (e) {
      console.error(e, {filename})
    }
  }
  // console.log({items})
  return (
    <div className={styles.container}>
      <section className={styles.banner}>
        <Banner
          title={title}
          // description={description}
          image={<Image className={styles.banner_image} src={bannerImage} alt={''} height={200} />}
        />
      </section>
      <main>
        <section className={styles.list}>
          {items.sort((a, b) => a.date < b.date ? 1 : -1).map((value) => (
            <div key={value.slug} className={styles.item}>
              <div className={styles.item_title}>
                <Link href={`/news/${value.slug}`}>{value.title}</Link>
              </div>
              <div className={styles.item_date}><Image src={iconDateSvg} alt={'日期'} height={16} /> {dayjs(value.date).format('YYYY-MM-DD')}</div>
              <div className={styles.item_summary}>{value.summary}</div>
            </div>
          ))}
        </section>
      </main>
    </div>
  )
}