wrap in article and add copy links

Author: jamiehenson

gatsby-config.ts

@@ -52,6 +52,13 @@ export const plugins = [
   },
   {
     resolve: 'gatsby-plugin-mdx',
+    options: {
+      gatsbyRemarkPlugins: [
+        {
+          resolve: `gatsby-remark-autolink-headers`,
+        },
+      ],
+    },
   },
   {
     resolve: `gatsby-source-filesystem`,

package.json

@@ -62,6 +62,7 @@
     "gatsby-plugin-root-import": "^2.0.9",
     "gatsby-plugin-sharp": "^5.8.1",
     "gatsby-plugin-sitemap": "^6.12.1",
+    "gatsby-remark-autolink-headers": "^6.14.0",
     "gatsby-source-filesystem": "^5.12.0",
     "gatsby-transformer-remark": "^6.12.0",
     "gatsby-transformer-sharp": "^5.3.0",

src/components/Layout/MDXWrapper.tsx

@@ -4,6 +4,7 @@ import { PageProps } from 'gatsby';
 import '../../styles/global.css';
 import PageTitle from '../PageTitle';
 import { MarkdownProvider } from '../Markdown';
+import Article from '../Article';
 
 type PageContextType = {
   title: string;
@@ -15,10 +16,12 @@ const MDXWrapper: React.FC<MDXWrapperProps> = ({ children, pageContext }) => {
   const { title } = pageContext;
 
   return (
-    <MarkdownProvider>
-      {title && <PageTitle>{title}</PageTitle>}
-      {children}
-    </MarkdownProvider>
+    <Article>
+      <MarkdownProvider>
+        {title && <PageTitle>{title}</PageTitle>}
+        {children}
+      </MarkdownProvider>
+    </Article>
   );
 };
 

yarn.lock

@@ -8112,6 +8112,17 @@ gatsby-react-router-scroll@^6.13.1:
     "@babel/runtime" "^7.20.13"
     prop-types "^15.8.1"
 
+gatsby-remark-autolink-headers@^6.14.0:
+  version "6.14.0"
+  resolved "https://registry.yarnpkg.com/gatsby-remark-autolink-headers/-/gatsby-remark-autolink-headers-6.14.0.tgz#7a37104b30c55eb666fbd4824294d90b22dc3743"
+  integrity sha512-hQkhnj1mMLR+Nd3VjCvgJjGGnrNZcNh+dnFyi9qv5nKtbo24yf2vS99v5c+0KLw9d90kSmdpiEkvA+Bhbh9Kzg==
+  dependencies:
+    "@babel/runtime" "^7.20.13"
+    github-slugger "^1.5.0"
+    lodash "^4.17.21"
+    mdast-util-to-string "^2.0.0"
+    unist-util-visit "^2.0.3"
+
 gatsby-script@^2.13.0:
   version "2.13.0"
   resolved "https://registry.yarnpkg.com/gatsby-script/-/gatsby-script-2.13.0.tgz#0fa7316739ebc31da217091e54db8ef86f41dbb3"
@@ -8499,7 +8510,7 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/github-from-package/-/github-from-package-0.0.0.tgz#97fb5d96bfde8973313f20e8288ef9a167fa64ce"
   integrity sha512-SyHy3T1v2NUXn29OsWdxmK6RwHD+vkj3v8en8AOBZ1wBQ/hCAQ5bAQTD02kW4W9tUp/3Qh6J8r9EvntiyCmOOw==
 
-github-slugger@^1.2.1:
+github-slugger@^1.2.1, github-slugger@^1.5.0:
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/github-slugger/-/github-slugger-1.5.0.tgz#17891bbc73232051474d68bd867a34625c955f7d"
   integrity sha512-wIh+gKBI9Nshz2o46B0B3f5k/W+WI9ZAv6y5Dn5WJ5SK1t0TnDimB4WE5rmTD05ZAIn8HALCZVmCsvj0w0v0lw==