fix(gatsby-plugin-manifest): favicon path respects hybrid mode (#8315)

Author: zauni

packages/gatsby-plugin-manifest/src/gatsby-node.js

@@ -35,7 +35,7 @@ exports.onPostBootstrap = (args, pluginOptions) =>
     // Determine destination path for icons.
     const iconPath = path.join(
       `public`,
-      manifest.icons[0].src.substring(0, manifest.icons[0].src.lastIndexOf(`/`))
+      path.dirname(manifest.icons[0].src)
     )
 
     //create destination directory if it doesn't exist

packages/gatsby-plugin-manifest/src/gatsby-ssr.js

@@ -4,11 +4,19 @@ import { withPrefix } from "gatsby"
 exports.onRenderBody = ({ setHeadComponents }, pluginOptions) => {
   // If icons were generated, also add a favicon link.
   if (pluginOptions.icon) {
+    let favicon = `/icons/icon-48x48.png`
+
+    // The icon path could be different in hybrid mode
+    // this takes the first one of the possible icons
+    if (pluginOptions.icons && pluginOptions.icons.length) {
+      favicon = pluginOptions.icons[0].src
+    }
+
     setHeadComponents([
       <link
         key={`gatsby-plugin-manifest-icon-link`}
         rel="shortcut icon"
-        href={withPrefix(`/icons/icon-48x48.png`)}
+        href={withPrefix(favicon)}
       />,
     ])
   }