Gatsby v5 ☂️

[eng618]

Summary

Upgrade the theme to use Gatsby v5

Justification

Keeping up with technology changes, and security compliance.

Tasks

Preview Give feedback

1. Gatsby v5: Review next branch and make issues #1425
   role: dev 🤖 +1
   
2. Gatsby v5: Verify & test next release against Carbon website #1426
   role: dev 🤖 +1
   
3. Gatsby v5: Verify & test next release againt IDL website #1427
   role: dev 🤖 +1
   
4. Gatsby v5: Create migration guidance #1428
   role: dev 🤖 +1
   
5. Gatsby v5 : code snippet bugs #1439
   role: dev 🤖 +1
   
6. Gatsby v5: Caption component bug #1440
   role: dev 🤖 +1
   
7. Gatsby v5: Search is broken #1449
   role: dev 🤖 +1
   
8. Gatsby v5: Publish, release and announce #1429
   role: dev 🤖 +1
   

[eng618]

Most of this work is done on the next branch.

The remaining pieces are as follows:

• Update layouts to support the upgraded mdx

[eng618]

For a little more context. The defaultLayouts node for the gatsby-plugin-mdx plugin is no longer a valid configuration. So, the below templates for Default.js and Homepage.js need to be converted into components that can be injected into every page. There are a few ways to do this, as outlined in the linked docs above.

{
  resolve: `gatsby-plugin-mdx`,
  options: {
    extensions: mdxExtensions,
    gatsbyRemarkPlugins: [
      ...defaultRemarkPlugins,
      ...gatsbyRemarkPlugins,
    ],
    remarkPlugins,
    defaultLayouts: {
      default: require.resolve('./src/templates/Default.js'),
      home: require.resolve('./src/templates/Homepage.js'),
      ...extraLayouts,
    },
  },
},

[muditjuneja]

More observed issues in next -

• Tables listing the component props is not being rendered correctly
• Code blocks having more than 8 lines are not being rendered correctly

[alisonjoseph]

@eng618 was looking at the webpack warnings and I think it may be something we can ignore. https://robertmarshall.dev/blog/fix-warn-chunk-commons-mini-css-extract-plugin-error-in-gatsby-js/