diff --git a/gatsby-node.js b/gatsby-node.js
index 195523e5..8c7c758e 100644
--- a/gatsby-node.js
+++ b/gatsby-node.js
@@ -1,5 +1,6 @@
const path = require('path')
const { createFilePath } = require('gatsby-source-filesystem')
+const { paginate } = require('gatsby-awesome-pagination')
// Create slug & date for posts from file path values
exports.onCreateNode = ({ node, actions, getNode }) => {
@@ -46,9 +47,6 @@ exports.createPages = ({ graphql, actions }) => {
const { createPage } = actions
return new Promise((resolve, reject) => {
- const postTemplate = path.resolve('src/templates/Post.jsx')
- const archiveTemplate = path.resolve('src/templates/Archive.jsx')
-
resolve(
graphql(
`
@@ -76,47 +74,105 @@ exports.createPages = ({ graphql, actions }) => {
reject(result.errors)
}
- // Create Posts
const posts = result.data.allMarkdownRemark.edges
- posts.forEach(post => {
- createPage({
- path: `${post.node.fields.slug}`,
- component: postTemplate,
- context: {
- slug: post.node.fields.slug
- }
- })
- })
+ // Generate posts & posts index
+ generateContent(createPage, posts)
- // Category & Tag Pages
- const tagSet = new Set()
- const tagMap = new Map()
-
- posts.forEach(post => {
- if (post.node.frontmatter.tags) {
- post.node.frontmatter.tags.forEach(tag => {
- tagSet.add(tag)
-
- const array = tagMap.has(tag) ? tagMap.get(tag) : []
- array.push(post)
- tagMap.set(tag, array)
- })
- }
- })
-
- const tagList = Array.from(tagSet)
-
- tagList.forEach(tag => {
- createPage({
- path: `/tag/${tag}/`,
- component: archiveTemplate,
- context: { tag }
- })
- })
+ // Generate Tag Pages
+ createTagPages(createPage, posts)
resolve()
})
)
})
}
+
+const generateContent = (createPage, posts) => {
+ const postTemplate = path.resolve('src/templates/Post.jsx')
+ const postsTemplate = path.resolve('src/templates/Posts.jsx')
+
+ // Create Post pages
+ posts.forEach(post => {
+ createPage({
+ path: `${post.node.fields.slug}`,
+ component: postTemplate,
+ context: {
+ slug: post.node.fields.slug
+ }
+ })
+ })
+
+ // Create paginated front page
+ paginate({
+ createPage,
+ items: posts,
+ itemsPerPage: 5,
+ pathPrefix: '/',
+ component: postsTemplate
+ })
+}
+
+const createTagPages = (createPage, posts) => {
+ const archiveTemplate = path.resolve('src/templates/Archive.jsx')
+
+ const tagSet = new Set()
+ const tagMap = new Map()
+
+ posts.forEach(post => {
+ if (post.node.frontmatter.tags) {
+ post.node.frontmatter.tags.forEach(tag => {
+ tagSet.add(tag)
+
+ const array = tagMap.has(tag) ? tagMap.get(tag) : []
+ array.push(post)
+ tagMap.set(tag, array)
+ })
+ }
+ })
+
+ const tagList = Array.from(tagSet)
+
+ tagList.forEach(tag => {
+ // Create paginated tag pages
+ // paginate({
+ // createPage,
+ // items: tagList, // An array of objects
+ // itemsPerPage: 5,
+ // pathPrefix: `/tag/${tag.toLowerCase()}`,
+ // component: archiveTemplate
+ // })
+ createPage({
+ path: `/tag/${tag}/`,
+ component: archiveTemplate,
+ context: { tag }
+ })
+ })
+
+ // Object.keys(posts).forEach(tagName => {
+ // const pageSize = 5
+ // const pagesSum = Math.ceil(posts[tagName].length / pageSize)
+
+ // for (let page = 1; page <= pagesSum; page++) {
+ // createPage({
+ // path:
+ // page === 1
+ // ? `/tag/${tagName.toLowerCase()}`
+ // : `/tag/${tagName.toLowerCase()}/page/${page}`,
+ // component: tagTemplate,
+ // context: {
+ // posts: paginate(posts[tagName], pageSize, page),
+ // tag: tagName,
+ // pagesSum,
+ // page
+ // }
+ // })
+ // }
+ // })
+}
+
+// function paginate(array, page_size, page_number) {
+// return array
+// .slice(0)
+// .slice((page_number - 1) * page_size, page_number * page_size)
+// }
diff --git a/package.json b/package.json
index afd00c46..138fb069 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,8 @@
"last 3 versions"
],
"dependencies": {
- "gatsby": "^2.0.0-rc.8",
+ "gatsby": "^2.0.0-rc.9",
+ "gatsby-awesome-pagination": "^0.1.1",
"gatsby-image": "^2.0.0-rc.1",
"gatsby-plugin-catch-links": "^2.0.2-rc.1",
"gatsby-plugin-lunr": "^1.1.0",
diff --git a/src/templates/Archive.jsx b/src/templates/Archive.jsx
index 5ec53736..07e6fb89 100644
--- a/src/templates/Archive.jsx
+++ b/src/templates/Archive.jsx
@@ -39,7 +39,7 @@ Archive.propTypes = {
export default Archive
export const archiveQuery = graphql`
- query($tag: String) {
+ query($tag: String!) {
tag: allMarkdownRemark(
filter: { frontmatter: { tags: { eq: $tag } } }
sort: { order: DESC, fields: [fields___date] }
diff --git a/src/pages/index.jsx b/src/templates/Posts.jsx
similarity index 78%
rename from src/pages/index.jsx
rename to src/templates/Posts.jsx
index 2151e2e2..7af576c7 100644
--- a/src/pages/index.jsx
+++ b/src/templates/Posts.jsx
@@ -9,10 +9,11 @@ import PostContent from '../components/atoms/PostContent'
import PostMore from '../components/atoms/PostMore'
import PostLinkActions from '../components/atoms/PostLinkActions'
import postStyles from '../templates/Post.module.scss'
-import styles from './index.module.scss'
+import styles from './Posts.module.scss'
-const IndexPage = ({ data, location }) => {
+const IndexPage = ({ data, location, pageContext }) => {
const edges = data.allMarkdownRemark.edges
+ const { previousPagePath, nextPagePath } = pageContext
const Posts = edges.map(({ node }) => {
const { type, linkurl, title, image } = node.frontmatter
@@ -40,6 +41,12 @@ const IndexPage = ({ data, location }) => {