<commit_before>import React from "react";
import Link from "gatsby-link";
import get from "lodash/get";
import Helmet from "react-helmet";

import Header from "../components/header";
import Intro from "../components/intro";

import "../styles/main.scss";

export const pageQuery = graphql`
  query IndexQuery {
    site {
      siteMetadata {
        title
      }
    }
    projectPosts: allMarkdownRemark(
      filter: { fileAbsolutePath: { glob: "**/src/projects/**" } }
      sort: { fields: [frontmatter___date], order: DESC }
    ) {
      edges {
        node {
          frontmatter {
            title
            path
          }
        }
      }
    }
    blogPosts: allMarkdownRemark(
      filter: { fileAbsolutePath: { glob: "**/src/posts/**" } }
      sort: { fields: [frontmatter___date], order: DESC }
    ) {
      edges {
        node {
          frontmatter {
            title
            path
          }
        }
      }
    }
  }
`;

class Index extends React.Component {
  render() {
    const { data, location } = this.props;
    const siteTitle = get(data, "site.siteMetadata.title");
    return (
      <div>
        <Helmet title={get(data, "site.siteMetadata.title")} />
        <Header siteTitle={siteTitle} location={location} />

        <Intro />

        <section>
          <div className="l-wrapper">
            <div className="l-inner-narrow">
              <h2>Personal Projects</h2>
              <ul>
                {data.projectPosts.edges.map(edge => {
                  const post = edge.node;
                  return (
                    <li key={post.frontmatter.path}>
                      <div>
                        <Link to={post.frontmatter.path}>
                          <p>{post.frontmatter.title}</p>
                        </Link>
                      </div>
                    </li>
                  );
                })}
              </ul>
            </div>
          </div>
        </section>

        <section>
          <div className="l-wrapper">
            <div className="l-inner-narrow">
              <h2>Blog Posts</h2>
              <ul>
                {data.blogPosts.edges.map(edge => {
                  const post = edge.node;
                  return (
                    <li key={post.frontmatter.path}>
                      <Link to={post.frontmatter.path}>
                        <p>{post.frontmatter.title}</p>
                      </Link>
                    </li>
                  );
                })}
              </ul>
            </div>
          </div>
        </section>
        <hr />
      </div>
    );
  }
}

export default Index;<commit_msg>Move main section out of index<commit_after>import React from "react";
import Link from "gatsby-link";
import get from "lodash/get";
import Helmet from "react-helmet";

import Header from "../components/header";
import Intro from "../components/intro";

import "../styles/main.scss";

export const pageQuery = graphql`
  query IndexQuery {
    site {
      siteMetadata {
        title
      }
    }
    projectPosts: allMarkdownRemark(
      filter: { fileAbsolutePath: { glob: "**/src/projects/**" } }
      sort: { fields: [frontmatter___date], order: DESC }
    ) {
      edges {
        node {
          frontmatter {
            title
            path
          }
        }
      }
    }
    blogPosts: allMarkdownRemark(
      filter: { fileAbsolutePath: { glob: "**/src/posts/**" } }
      sort: { fields: [frontmatter___date], order: DESC }
    ) {
      edges {
        node {
          frontmatter {
            title
            path
          }
        }
      }
    }
  }
`;

function MainContent(props) {
  const { data } = props;

  return (
    <div>
      <section>
        <div className="l-wrapper">
          <div className="l-inner-narrow">
            <h2>Personal Projects</h2>
            <ul>
              {data.projectPosts.edges.map(edge => {
                const post = edge.node;
                return (
                  <li key={post.frontmatter.path}>
                    <div>
                      <Link to={post.frontmatter.path}>
                        <p>{post.frontmatter.title}</p>
                      </Link>
                    </div>
                  </li>
                );
              })}
            </ul>
          </div>
        </div>
      </section>

      <section>
        <div className="l-wrapper">
          <div className="l-inner-narrow">
            <h2>Blog Posts</h2>
            <ul>
              {data.blogPosts.edges.map(edge => {
                const post = edge.node;
                return (
                  <li key={post.frontmatter.path}>
                    <Link to={post.frontmatter.path}>
                      <p>{post.frontmatter.title}</p>
                    </Link>
                  </li>
                );
              })}
            </ul>
          </div>
        </div>
      </section>
    </div>
  );
}

class Index extends React.Component {
  render() {
    const { data, location } = this.props;
    const siteTitle = get(data, "site.siteMetadata.title");
    return (
      <div>
        <Helmet title={get(data, "site.siteMetadata.title")} />
        <Header siteTitle={siteTitle} location={location} />

        <Intro />
        <MainContent data={data} />
      </div>
    );
  }
}

export default Index;
{'fraction_non_alphanumeric': 0.13165735567970205, 'fraction_numerical': 0.0014897579143389199, 'mean_word_length': 1.2379166666666668, 'pattern_counts': {'":': 0, '<': 85, '<?xml version=': 0, '>': 89, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3845959', 'n_tokens_mistral': 1568, 'n_tokens_neox': 1481, 'n_words': 301}