From 4a18696e9fc9927322178cd89beb484a3b361c30 Mon Sep 17 00:00:00 2001
From: Jean-Philippe Sirois <jp@veksen.net>
Date: Thu, 21 May 2020 00:54:53 -0400
Subject: [PATCH] feat(resources): improve SEO

---
 src/components/SEO/index.tsx   | 4 +++-
 src/templates/languageHome.tsx | 8 +++++++-
 src/templates/languagePost.tsx | 8 +++++++-
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/components/SEO/index.tsx b/src/components/SEO/index.tsx
index 95aac58..400103c 100644
--- a/src/components/SEO/index.tsx
+++ b/src/components/SEO/index.tsx
@@ -8,6 +8,7 @@ interface ISEOProps {
   readonly meta?: any[]
   readonly keywords?: string[]
   readonly title: string
+  readonly subCategory?: string | null
 }
 
 export const SEO: FC<ISEOProps> = ({
@@ -16,6 +17,7 @@ export const SEO: FC<ISEOProps> = ({
   meta = [],
   keywords = [],
   title,
+  subCategory,
 }) => {
   const { site } = useStaticQuery(
     graphql`
@@ -38,7 +40,7 @@ export const SEO: FC<ISEOProps> = ({
       htmlAttributes={{
         lang,
       }}
-      title={title}
+      title={subCategory ? `${title} - ${subCategory}` : title}
       titleTemplate={`%s | ${site.siteMetadata.title}`}
       meta={[
         {
diff --git a/src/templates/languageHome.tsx b/src/templates/languageHome.tsx
index dff7dd1..584d2a1 100644
--- a/src/templates/languageHome.tsx
+++ b/src/templates/languageHome.tsx
@@ -6,9 +6,11 @@ import { ResourcesList } from "../components/ResourcesList"
 import { SEO } from "../components/SEO"
 import { PageContent } from "../components/PageContent"
 import { Footer } from "../components/Footer"
+import useSidebar from "../hooks/useSidebar"
 
 // @todo maybe find alternative type for data
 const LanguageHome: FC<any> = ({ data, pageContext }) => {
+  const { current: language } = useSidebar()
   const { relativePath } = data.file
   const { html, excerpt, fields, frontmatter, timeToRead } = data.file.post
 
@@ -18,7 +20,11 @@ const LanguageHome: FC<any> = ({ data, pageContext }) => {
 
   return (
     <Fragment>
-      <SEO title={frontmatter.title} description={excerpt} />
+      <SEO
+        title={frontmatter.title}
+        subCategory={language}
+        description={excerpt}
+      />
       <Header
         relativePath={relativePath}
         basePath="/resources"
diff --git a/src/templates/languagePost.tsx b/src/templates/languagePost.tsx
index 66cc98f..7de42d4 100644
--- a/src/templates/languagePost.tsx
+++ b/src/templates/languagePost.tsx
@@ -7,10 +7,12 @@ import { Header } from "../components/Header"
 import { Markdown } from "../components/Markdown"
 import { PageContent } from "../components/PageContent"
 import { SEO } from "../components/SEO"
+import useSidebar from "../hooks/useSidebar"
 import { buildToc } from "../utils"
 
 // @todo maybe find alternative type for data
 const LanguagePost: FC<any> = ({ data }) => {
+  const { current: language } = useSidebar()
   const { relativePath } = data.file
   const {
     html,
@@ -31,7 +33,11 @@ const LanguagePost: FC<any> = ({ data }) => {
 
   return (
     <Fragment>
-      <SEO title={frontmatter.title} description={excerpt} />
+      <SEO
+        title={frontmatter.title}
+        subCategory={language}
+        description={excerpt}
+      />
       <Header
         relativePath={relativePath}
         basePath="/resources"