import React, { useEffect } from "react"
import { graphql } from "gatsby"

import Base from '../components/Base'
import SEO from "../components/seo"
import PostList from "../components/PostList"
import init, { greet } from "snake_game"

const IndexPage = (props) => {
  const postEdges = props.data.allMdx.edges;

  const initWasm = () => {
    init().then(_ => {
      console.log("MANN");
      console.log(greet("BRUH"));
    })
  }

  useEffect(() => {
    initWasm()
  }, [])

  return (
    <Base>
      <SEO title="Home" />
      <PostList postEdges={postEdges}/>
    </Base>
  )
}

export default IndexPage

export const pageQuery = graphql`
  query IndexQuery {
    allMdx(limit: 1000, sort: {frontmatter: {date: DESC}}) {
      edges {
        node {
          excerpt
          frontmatter {
            slug
          }
          frontmatter {
            title
            date
            archive
          }
        }
      }
    }
  }
`;