import * as fs from "fs";
import matter from 'gray-matter'
import {Metadata} from "next";
import dayjs from "dayjs";
import iconDateSvg from "@/assets/icon-date.svg";
import Image from "next/image"

import styles from './page.module.sass'
import {ShareToWechat} from "@/components/ShareToWechat/ShareToWechat";
import {Markdown} from "@/components/Markdown";

const pathname = './src/app/payment-info/[slug]/markdown'

export async function generateStaticParams() {
  console.log({pathname})
  const filenames = fs.readdirSync(pathname).filter((name) => name.endsWith('.md'))
  console.log({filenames})
  return filenames.map((filename) => ({slug: filename.replaceAll('.md', '')}))
}

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 async function PaymentInfoDetailPage({params}: { params: { slug: string } }) {
  const source = fs.readFileSync(pathname + '/' + decodeURIComponent(params.slug) + '.md').toString()
  const {data, content} = matter(source)
  return (
    <div>
      <h1>{data.title}</h1>
      <p className={styles.meta}>
        <Image src={iconDateSvg} alt={'日期'} height={16} /> {dayjs(data.date).format('YYYY-MM-DD')}
      </p>
      <Markdown>{content}</Markdown>
      <div className={styles.ShareToWechat}>
        <ShareToWechat />
      </div>
    </div>
  )
}