Gatsby mock: expanded useStaticQuery to support Templates, refactoring

__mocks__/gatsby.js

@@ -1,49 +1,79 @@
 import React from 'react';
 const Gatsby = jest.requireActual('gatsby');
 
-const fluidImagesShapeMock = [
+const fluidImageShapes = [
   {
     aspectRatio: 2,
-    src: `test_image.jpg`,
-    srcSet: `some srcSet`,
-    srcSetWebp: `some srcSetWebp`,
-    sizes: `(max-width: 600px) 100vw, 600px`,
-    base64: `string_of_base64`,
+    src: 'test_image.jpg',
+    srcSet: 'some srcSet',
+    srcSetWebp: 'some srcSetWebp',
+    sizes: '(max-width: 600px) 100vw, 600px',
+    base64: 'string_of_base64',
   },
   {
     aspectRatio: 3,
-    src: `test_image_2.jpg`,
-    srcSet: `some other srcSet`,
-    srcSetWebp: `some other srcSetWebp`,
-    sizes: `(max-width: 600px) 100vw, 600px`,
-    base64: `string_of_base64`,
-    media: `only screen and (min-width: 768px)`,
+    src: 'test_image_2.jpg',
+    srcSet: 'some other srcSet',
+    srcSetWebp: 'some other srcSetWebp',
+    sizes: '(max-width: 400px) 100vw, 400px',
+    base64: 'string_of_base64',
   },
 ];
 
+const useStaticQuery = () => ({
+  site: {
+    siteMetadata: {
+      title: 'Test title',
+      description: 'Test description',
+      author: 'Test author',
+      siteUrl: 'https://testsiteurl/',
+    },
+  },
+  file: {
+    childImageSharp: {
+      fluid: fluidImageShapes[0],
+    },
+  },
+  onyx: {
+    childImageSharp: {
+      fluid: fluidImageShapes[0],
+    },
+  },
+  pikachu: {
+    childImageSharp: {
+      fluid: fluidImageShapes[1],
+    },
+  },
+  gengar: {
+    childImageSharp: {
+      fluid: fluidImageShapes[0],
+    },
+  },
+  castform: {
+    childImageSharp: {
+      fluid: fluidImageShapes[1],
+    },
+  },
+  glalie: {
+    childImageSharp: {
+      fluid: fluidImageShapes[0],
+    },
+  },
+  celebi: {
+    childImageSharp: {
+      fluid: fluidImageShapes[1],
+    },
+  },
+});
+
 module.exports = {
   ...Gatsby,
   graphql: jest.fn(),
   Link: jest.fn().mockImplementation(({ to, ...rest }) =>
-    React.createElement(`a`, {
+    React.createElement('a', {
       ...rest,
       href: to,
     }),
   ),
-  StaticQuery: jest.fn(),
-  useStaticQuery: jest.fn().mockReturnValue({
-    site: {
-      siteMetadata: {
-        title: '',
-        description: '',
-        author: '',
-        siteUrl: '',
-      },
-    },
-    file: {
-      childImageSharp: {
-        fluid: fluidImagesShapeMock[0],
-      },
-    },
-  }),
+  useStaticQuery: useStaticQuery,
 };