pathame fix

gatsby-node.esm.js

@@ -46,7 +46,7 @@ exports.createPages = async ({ actions, graphql }) => {
 
   articles.forEach(({ node }) => {
     createPage({
-      path: `article/${node.frontmatter.slug}`,
+      path: `article/${node.frontmatter.slug}/`,
       component: articleTemplate,
       context: {
         slug: node.frontmatter.slug,
@@ -56,7 +56,7 @@ exports.createPages = async ({ actions, graphql }) => {
 
   snippets.forEach(({ node }) => {
     createPage({
-      path: `snippet/${node.frontmatter.slug}`,
+      path: `snippet/${node.frontmatter.slug}/`,
       component: snippetTemplate,
       context: {
         slug: node.frontmatter.slug,
@@ -66,7 +66,7 @@ exports.createPages = async ({ actions, graphql }) => {
 
   categories.forEach(({ node }) => {
     createPage({
-      path: `category/${slugify(node.frontmatter.title)}`,
+      path: `category/${slugify(node.frontmatter.title)}/`,
       component: categoryTemplate,
       context: {
         title: node.frontmatter.title,
@@ -76,7 +76,7 @@ exports.createPages = async ({ actions, graphql }) => {
 
   tags.forEach(({ node }) => {
     createPage({
-      path: `tag/${slugify(node.frontmatter.title)}`,
+      path: `tag/${slugify(node.frontmatter.title)}/`,
       component: tagTemplate,
       context: {
         title: node.frontmatter.title,

src/components/Article/Article.js

@@ -119,8 +119,9 @@ const Article = ({
                     owner,
                     admin: admin.split(","),
                     language: "ru",
-                    id: pathname,
+                    id: slug,
                     title: title,
+                    labels: ["Статья", "Обсуждение"],
                   }}
                 />
               ) : null}

src/components/Articles/ArticleCard/ArticleCard.js

@@ -10,7 +10,7 @@ const ArticleCard = ({
   return (
     <article className="article-card">
       <div className="article-card__image">
-        <Link to={`/article/${slug}`}>
+        <Link to={`/article/${slug}/`}>
           <Img
             loading="eager"
             fadeIn={false}
@@ -21,17 +21,17 @@ const ArticleCard = ({
       </div>
       <div className="article-card__heading">
         <h2>
-          <Link to={`/article/${slug}`}>{title}</Link>
+          <Link to={`/article/${slug}/`}>{title}</Link>
         </h2>
       </div>
       <div className="article-card__category">
-        <Link to={`/category/${slugify(category)}`}>{category}</Link>
+        <Link to={`/category/${slugify(category)}/`}>{category}</Link>
       </div>
       <div className="article-card__tags">
         <ul>
           {tags.map((tag, i) => (
             <li className="tag-item" key={i}>
-              <Link to={`/tag/${tag}`}>{tag}</Link>
+              <Link to={`/tag/${tag}/`}>{tag}</Link>
             </li>
           ))}
         </ul>

src/components/Articles/Categories/CategoryItem.js

@@ -15,7 +15,7 @@ const CategoryItem = ({ title }) => {
           : "tag-item"
       }
     >
-      <Link to={`/category/${slugify(title)}`}>{title}</Link>
+      <Link to={`/category/${slugify(title)}/`}>{title}</Link>
     </div>
   )
 }

src/components/Offers/Popular/PopularItem.js

@@ -6,7 +6,7 @@ const PopularItem = ({ slug, title }) => {
   return (
     <div className="article-item">
       <div className="article-item__title">
-        <Link to={`/article/${slug}`}>{title}</Link>
+        <Link to={`/article/${slug}/`}>{title}</Link>
       </div>
       <div className="article-item__views"></div>
     </div>

src/components/Offers/Tags/TagItem.js

@@ -6,7 +6,7 @@ import sligify from "../../../helpers/slugify"
 const TagItem = ({ title }) => {
   return (
     <div className="tag-item">
-      <Link to={`/tag/${sligify(title)}`}>{title}</Link>
+      <Link to={`/tag/${sligify(title)}/`}>{title}</Link>
     </div>
   )
 }

src/components/Snippet/Snippet.js

@@ -1,16 +1,14 @@
 import React from "react"
 import PropTypes from "prop-types"
-import { useLocation } from "@reach/router"
 import GitalkComponent from "gitalk/dist/gitalk-component"
 import useSiteMetadataQuery from "../../hooks/useSiteMetadataQuery"
 
-const Snippet = ({ data: { description, title, date }, html }) => {
+const Snippet = ({ data: { slug, description, title, date }, html }) => {
   const {
     siteMetadata: {
       gitalk: { clientID, clientSecret, repo, owner, admin },
     },
   } = useSiteMetadataQuery()
-  const { pathname } = useLocation()
   const [readyComments, setReadyComments] = React.useState(false)
 
   React.useEffect(() => setReadyComments(true), [setReadyComments])
@@ -40,8 +38,9 @@ const Snippet = ({ data: { description, title, date }, html }) => {
                     owner,
                     admin: admin.split(","),
                     language: "ru",
-                    id: pathname,
+                    id: slug,
                     title: title,
+                    labels: ["Сниппет", "Обсуждение"],
                   }}
                 />
               ) : null}

src/components/Snippets/SnippetItem/SnippetItem.js

@@ -7,7 +7,7 @@ const SnippetItem = ({ slug, title, date, tags }) => {
       <div className="left-info">
         <div className="snippet-item__date">{date}</div>
         <div className="snippet-item__heading">
-          <Link to={`/snippet/${slug}`}>{title}</Link>
+          <Link to={`/snippet/${slug}/`}>{title}</Link>
         </div>
       </div>
       <div className="right-info">