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';

import Link from '../../components/Link';
import { List, ListItem } from '../../components/List';

// @ts-ignore
import md from './logs.md';

interface Props {
  posts: Post[]
};

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

  return(
    <DefaultPage
      path={"/logs"}
    >
      <>
        <Markdown md={md} />
        <List variant="unordered">
        {
          posts.map(({ directory, meta }) => (
            <ListItem key={directory}><Link href={'/logs/' + directory}>{meta.name}</Link></ListItem>
          ))
        }
        </List>
      </>
    </DefaultPage>
  );
};

export default Logs;


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

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