import DefaultPage from '../../templates/Default';
import Markdown from '../../components/Markdown';
import styles from './index.module.scss';

import { GetStaticProps, GetStaticPropsContext } from 'next';
import React, { FC } from 'react';
import { getPosts, Post } from '../../utils/Posts';
// @ts-ignore
import md from './logs.md';

interface Props {
  posts: Post[]
};

const Logs : FC<Props> = ({ posts }) => {
  

  return(
    <DefaultPage
      path={"/logs"}
    >
      <>
        <Markdown md={md} />
        <ul className={styles.logList}>
        {
          posts.map(({ directory, meta }) => (
            <li key={directory}><a href={'/logs/' + directory}>{meta.name}</a></li>
          ))
        }
        </ul>
      </>
    </DefaultPage>
  );
};

export default Logs;


export const getStaticProps: GetStaticProps = async (
  context: GetStaticPropsContext
) => {
  const posts = await getPosts();

  return {
    props: { posts: posts },
  }
}