From 139db50cfd1e0222871414edf97e394c3c082ab6 Mon Sep 17 00:00:00 2001
From: LordMathis <matus@namesny.com>
Date: Tue, 6 Oct 2020 20:51:49 +0200
Subject: [PATCH] Create pages from other md files

---
 gatsby-config.js            |  2 +-
 gatsby-node.js              | 43 ++++++++++++++++++++++++++++++++-----
 src/styles/page.module.scss |  5 +++++
 src/templates/page.js       | 27 +++++++++++++++++++++++
 4 files changed, 71 insertions(+), 6 deletions(-)
 create mode 100644 src/styles/page.module.scss
 create mode 100644 src/templates/page.js

diff --git a/gatsby-config.js b/gatsby-config.js
index dcce30c..5b43fe9 100644
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -23,7 +23,7 @@ module.exports = {
     {
       resolve: `gatsby-source-filesystem`,
       options: {
-        name: `data`,
+        name: `pages`,
         path: `${__dirname}/content/pages`,
       },
     },
diff --git a/gatsby-node.js b/gatsby-node.js
index 5a1cacf..185ac9e 100644
--- a/gatsby-node.js
+++ b/gatsby-node.js
@@ -22,7 +22,8 @@ exports.onCreateNode = ({ node, getNode, actions }) => {
 exports.createPages = async ({ graphql, actions, reporter }) => {
     const { createPage } = actions
 
-    const result = await graphql(
+    // Posts query
+    const posts = await graphql(
       `
         {
           allMarkdownRemark(filter:{frontmatter: {draft: {ne: true}}, fields: {collection: {eq: "posts"}}}) {
@@ -39,19 +40,51 @@ exports.createPages = async ({ graphql, actions, reporter }) => {
     )
 
     // Handle errors
-    if (result.errors) {
+    if (posts.errors) {
       reporter.panicOnBuild(`Error while running GraphQL query.`)
       return
     }
 
     // Create pages for each markdown file.
     const blogPostTemplate = path.resolve(`src/templates/blog-post.js`)
-    result.data.allMarkdownRemark.edges.forEach(({ node }) => {
+    posts.data.allMarkdownRemark.edges.forEach(({ node }) => {
       createPage({
         path: `/posts${node.fields.slug}`,
         component: blogPostTemplate,
-        // In your blog post template's graphql query, you can use pagePath
-        // as a GraphQL variable to query for data from the markdown file.
+        context: {
+          slug: node.fields.slug,
+        },
+      })
+    })
+
+    const pages = await graphql(
+      `
+        {
+          allMarkdownRemark(filter: {fields: {collection: {eq: "pages"}}}) {
+            edges {
+              node {
+                fields {
+                  slug
+                }
+              }
+            }
+          }
+        }
+      `
+    )
+
+    // Handle errors
+    if (pages.errors) {
+      reporter.panicOnBuild(`Error while running GraphQL query.`)
+      return
+    }
+
+    // Create pages for each markdown file.
+    const pageTemplate = path.resolve(`src/templates/page.js`)
+    pages.data.allMarkdownRemark.edges.forEach(({ node }) => {
+      createPage({
+        path: node.fields.slug,
+        component: pageTemplate,
         context: {
           slug: node.fields.slug,
         },
diff --git a/src/styles/page.module.scss b/src/styles/page.module.scss
new file mode 100644
index 0000000..4bd2d9b
--- /dev/null
+++ b/src/styles/page.module.scss
@@ -0,0 +1,5 @@
+@import "./variables.scss";
+
+.pageWrapper {
+    text-align: left;
+}
\ No newline at end of file
diff --git a/src/templates/page.js b/src/templates/page.js
new file mode 100644
index 0000000..980501d
--- /dev/null
+++ b/src/templates/page.js
@@ -0,0 +1,27 @@
+import React from "react"
+import { graphql } from "gatsby"
+import Layout from "../components/layout"
+import styles from "../styles/page.module.scss"
+
+export default function Page({ data }) {
+  const page = data.markdownRemark
+  return (
+    <Layout>
+      <div className={styles.blogPostWrapper}>
+        <h1>{page.frontmatter.title}</h1>
+        <div dangerouslySetInnerHTML={{ __html: page.html }} />
+      </div>
+    </Layout>
+  )
+}
+
+export const query = graphql`
+  query($slug: String!) {
+    markdownRemark(fields: { slug: { eq: $slug } }) {
+      html
+      frontmatter {
+        title
+      }
+    }
+  }
+`
\ No newline at end of file