diff --git a/app/gatsby-node.js b/app/gatsby-node.js index 0b13726..21adc35 100644 --- a/app/gatsby-node.js +++ b/app/gatsby-node.js @@ -1,12 +1,6 @@ const fs = require("fs") const categories = JSON.parse(fs.readFileSync("src/data/categories.json")) - -function createSlug (categoryName) { - categoryName = categoryName.toLowerCase(); - categoryName = categoryName.replace(/ /g, "-"); - categoryName = categoryName.replace(/,/g, ""); - return categoryName; -}; +var slugify = require('slugify') exports.createPages = async function ({ actions, graphql }) { const { createPage } = actions @@ -34,8 +28,9 @@ exports.createPages = async function ({ actions, graphql }) { } `, {categoryName: category.name}) + console.log(category.name, data.data) createPage({ - path: createSlug(category.name), + path: slugify(category.name), component: require.resolve("./src/templates/categoryTemplate.js"), context: { categoryName: category.name, diff --git a/app/package-lock.json b/app/package-lock.json index dd243b6..f920e84 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -19779,9 +19779,9 @@ } }, "slugify": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/slugify/-/slugify-1.4.0.tgz", - "integrity": "sha512-FtLNsMGBSRB/0JOE2A0fxlqjI6fJsgHGS13iTuVT28kViI4JjUiNqp/vyis0ZXYcMnpR3fzGNkv+6vRlI2GwdQ==" + "version": "1.4.5", + "resolved": "https://registry.npmjs.org/slugify/-/slugify-1.4.5.tgz", + "integrity": "sha512-WpECLAgYaxHoEAJ8Q1Lo8HOs1ngn7LN7QjXgOLbmmfkcWvosyk4ZTXkTzKyhngK640USTZUlgoQJfED1kz5fnQ==" }, "snapdragon": { "version": "0.8.2", diff --git a/app/package.json b/app/package.json index f88eada..5dc8d62 100644 --- a/app/package.json +++ b/app/package.json @@ -22,7 +22,8 @@ "react-dom": "^16.10.2", "react-helmet": "^5.2.1", "react-star-rating-component": "^1.4.1", - "react-star-ratings": "^2.3.0" + "react-star-ratings": "^2.3.0", + "slugify": "^1.4.5" }, "devDependencies": { "eslint": "^7.7.0", diff --git a/app/src/components/sidebar.js b/app/src/components/sidebar.js index dcc3299..513249b 100644 --- a/app/src/components/sidebar.js +++ b/app/src/components/sidebar.js @@ -2,13 +2,7 @@ import React from "react" import { Nav } from "react-bootstrap" import { StaticQuery, graphql } from "gatsby" import "../styles/sidebar.css" - -function createSlug(categoryName) { - categoryName = categoryName.toLowerCase() - categoryName = categoryName.replace(/ /g, "-") - categoryName = categoryName.replace(/,/g, "") - return categoryName -} +var slugify = require('slugify') export default () => { return ( @@ -20,6 +14,7 @@ export default () => { node { id name + emoji } } } @@ -34,8 +29,8 @@ export default () => { {data.allCategoriesJson.edges.map(function(x, index) { return ( - - {x.node.name} + + {x.node.emoji} {x.node.name} ) diff --git a/app/src/data/categories.json b/app/src/data/categories.json index 11e5cb5..4c1194e 100644 --- a/app/src/data/categories.json +++ b/app/src/data/categories.json @@ -1,18 +1,21 @@ [ { - "name": "🚀 Startups and Business" + "name": "Startups and Business", + "emoji": "🚀" }, { - "name": "☯️ Philosophy and Psychology" + "name": "Philosophy And Psychology", + "emoji": "☯️" }, { - "name": "👩🏾 Autobiographies and Biographies" + "name": "Autobiographies and Biographies", + "emoji": "👩🏾" }, { "name": "History" }, { - "name": "Evolution, Science and Medicine" + "name": "Science and Medicine" }, { "name": "Logic and Problem Solving" @@ -38,9 +41,6 @@ { "name": "Theater and Film" }, - { - "name": "Fiction" - }, { "name": "Health" },