Upgrade to latest deps and fix issues

gatsby-browser.js

@@ -1 +1 @@
-require("prismjs/themes/prism-tomorrow.css");
+import "prismjs/themes/prism-tomorrow.css";

gatsby-config.js

@@ -4,7 +4,7 @@ module.exports = {
   siteMetadata: {
     title: "Irmin",
     description: "",
-    author: "@tarides_"
+    author: "@tarides_",
   },
   plugins: [
     "gatsby-plugin-sharp",
@@ -13,20 +13,19 @@ module.exports = {
       resolve: `gatsby-source-filesystem`,
       options: {
         path: `${__dirname}/data/tutorial/`,
-        name: `tutorial`
-      }
+        name: `tutorial`,
+      },
     },
     {
       resolve: `gatsby-transformer-remark`,
       options: {
-        pedantic: false,
         plugins: [
           `gatsby-remark-autolink-headers`,
           {
             resolve: `gatsby-remark-images`,
             options: {
-              maxWidth: 680
-            }
+              maxWidth: 680,
+            },
           },
           {
             resolve: `gatsby-remark-prismjs`,
@@ -35,23 +34,23 @@ module.exports = {
               inlineCodeMarker: null,
               aliases: { shell: "shell-session", ocamlskip: "ocaml" },
               showLineNumbers: false,
-              noInlineHighlight: true
-            }
-          },
-          {
-            resolve: `gatsby-plugin-favicon`,
-            options: {
-                logo: "./src/images/favicon.png",
+              noInlineHighlight: true,
             },
-          }
-        ]
-      }
+          },
+        ],
+      },
+    },
+    {
+      resolve: "gatsby-plugin-manifest",
+      options: {
+        icon: "src/images/icon.png",
+      },
     },
     {
       resolve: `gatsby-plugin-google-fonts`,
       options: {
-        fonts: [`Ubuntu Mono`, `Titillium Web:400,600,700`]
-      }
-    }
-  ]
+        fonts: [`Ubuntu Mono`, `Titillium Web:400,600,700`],
+      },
+    },
+  ],
 };

gatsby-node.js

@@ -1,11 +1,11 @@
 const path = require(`path`);
 
-exports.createPages = ({ actions, graphql }) => {
-  const { createPage } = actions;
+const tutorialTemplate = path.resolve(`src/templates/tutorial.js`);
 
-  const tutorialTemplate = path.resolve(`src/templates/tutorial.js`);
+exports.createPages = async ({ graphql, actions, reporter }) => {
+  const { createPage } = actions;
 
-  return graphql(`
+  const result = await graphql(`
     {
       allMarkdownRemark(limit: 1000) {
         edges {
@@ -17,17 +17,24 @@ exports.createPages = ({ actions, graphql }) => {
         }
       }
     }
-  `).then(result => {
-    if (result.errors) {
-      return Promise.reject(result.errors);
-    }
+  `);
+
+  if (result.errors) {
+    reporter.panicOnBuild(
+      `There was an error loading tutorials`,
+      result.errors,
+    );
+    return;
+  }
+
+  const tutorials = result.data.allMarkdownRemark.edges;
 
-    return result.data.allMarkdownRemark.edges.forEach(({ node }) => {
-      createPage({
-        path: node.frontmatter.path,
-        component: tutorialTemplate,
-        context: {} // additional data can be passed via context
-      });
+  tutorials.forEach(({ node }) => {
+    const { path } = node.frontmatter;
+    createPage({
+      path,
+      component: tutorialTemplate,
+      context: { id: path },
     });
   });
 };

package.json

@@ -4,20 +4,20 @@
   "version": "1.0.0",
   "author": "Tarides <[email protected]>",
   "dependencies": {
-    "gatsby": "^2.19.27",
-    "gatsby-plugin-favicon": "^3.1.6",
+    "gatsby": "^5.11.0",
     "gatsby-plugin-google-fonts": "^1.0.1",
-    "gatsby-plugin-react-helmet": "^3.1.22",
-    "gatsby-plugin-sharp": "^2.4.5",
-    "gatsby-remark-autolink-headers": "^2.1.24",
-    "gatsby-remark-images": "^3.1.44",
-    "gatsby-remark-prismjs": "^3.3.32",
-    "gatsby-source-filesystem": "^2.1.48",
-    "gatsby-transformer-remark": "^2.6.53",
+    "gatsby-plugin-manifest": "^5.11.0",
+    "gatsby-plugin-react-helmet": "^6.11.0",
+    "gatsby-plugin-sharp": "^5.11.0",
+    "gatsby-remark-autolink-headers": "^6.11.0",
+    "gatsby-remark-images": "^7.11.0",
+    "gatsby-remark-prismjs": "^7.11.0",
+    "gatsby-source-filesystem": "^5.11.0",
+    "gatsby-transformer-remark": "^6.11.0",
     "prismjs": "^1.27.0",
-    "react": "^16.13.0",
-    "react-dom": "^16.13.0",
-    "react-helmet": "^5.2.1"
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-helmet": "^6.1.0"
   },
   "keywords": [
     "gatsby"
@@ -33,9 +33,9 @@
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "devDependencies": {
-    "gatsby-cli": "^2.10.0",
-    "prettier": "^1.19.1",
-    "url-loader": "^3.0.0"
+    "gatsby-cli": "^5.11.0",
+    "prettier": "^3.0.0",
+    "url-loader": "^4.1.1"
   },
   "repository": {
     "type": "git",

src/templates/tutorial.js

@@ -50,8 +50,8 @@ export default function Template({ data }) {
 }
 
 export const pageQuery = graphql`
-  query($path: String!) {
-    markdownRemark(frontmatter: { path: { eq: $path } }) {
+  query ($id: String!) {
+    markdownRemark(frontmatter: { path: { eq: $id } }) {
       html
       frontmatter {
         path