refactor(starter): upgrade and move to typescript

internal/testing/__mocks__/all-markdown-remark.ts

@@ -1,52 +1,4 @@
-export default {
-  allMarkdownRemark: {
-    group: [
-      {
-        fieldValue: "typography",
-        totalCount: 1,
-      },
-      {
-        fieldValue: "design inspiration",
-        totalCount: 1,
-      },
-    ],
-    edges: [
-      {
-        node: {
-          id: "08870ea6-bdc8-4ec6-bf72-1e7d4488eb72",
-          fields: {
-            slug: "/posts/perfecting-the-art-of-perfection",
-            categorySlug: "/typography",
-          },
-          frontmatter: {
-            date: "2016-09-01",
-            description:
-              "An Essay on Typography by Eric Gill takes the reader back to the year 1930. The year when a conflict between two worlds came to its term. The machines of the industrial world finally took over the handicrafts.",
-            category: "typography",
-            title: "Perfecting the Art of Perfection",
-            template: "post",
-          },
-          html: "",
-        },
-      },
-      {
-        node: {
-          id: "066adc91-f87a-4e57-9fef-7a677baf5c1d",
-          fields: {
-            slug: "/posts/the-birth-of-movable-type",
-            categorySlug: "/design-inspiration",
-          },
-          frontmatter: {
-            date: "2016-09-01",
-            description:
-              "German inventor Johannes Gutenberg developed a method of movable type and used it to create one of the western world’s first major printed books, the “Forty–Two–Line” Bible.",
-            category: "design inspiration",
-            title: "Johannes Gutenberg: The Birth of Movable Type",
-            template: "post",
-          },
-          html: "",
-        },
-      },
-    ],
-  },
-};
+import edges from "./edges";
+import group from "./group";
+
+export default { group, edges };

internal/testing/__mocks__/author.ts

@@ -1,7 +1,7 @@
 import contacts from "./contacts";
 
 export default {
-  photo: "/static/photo.jpg",
+  photo: "/photo.jpg",
   bio: "Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu.",
   name: "John Doe",
   contacts,

internal/testing/__mocks__/contacts.ts

@@ -4,5 +4,4 @@ export default {
   github: "#",
   twitter: "#",
   telegram: "#",
-  vkontakte: "#",
 };

internal/testing/__mocks__/edges.ts

@@ -0,0 +1,38 @@
+export default [
+  {
+    node: {
+      id: "08870ea6-bdc8-4ec6-bf72-1e7d4488eb72",
+      fields: {
+        slug: "/posts/perfecting-the-art-of-perfection",
+        categorySlug: "/typography",
+      },
+      frontmatter: {
+        date: "2016-09-01",
+        description:
+          "An Essay on Typography by Eric Gill takes the reader back to the year 1930. The year when a conflict between two worlds came to its term. The machines of the industrial world finally took over the handicrafts.",
+        category: "typography",
+        title: "Perfecting the Art of Perfection",
+        template: "post",
+      },
+      html: "<p>An Essay on Typography by Eric Gill takes the reader back to the year 1930. The year when a conflict between two worlds came to its term. The machines of the industrial world finally took over the handicrafts.</p>",
+    },
+  },
+  {
+    node: {
+      id: "066adc91-f87a-4e57-9fef-7a677baf5c1d",
+      fields: {
+        slug: "/posts/the-birth-of-movable-type",
+        categorySlug: "/design-inspiration",
+      },
+      frontmatter: {
+        date: "2016-09-01",
+        description:
+          "German inventor Johannes Gutenberg developed a method of movable type and used it to create one of the western world’s first major printed books, the “Forty–Two–Line” Bible.",
+        category: "design inspiration",
+        title: "Johannes Gutenberg: The Birth of Movable Type",
+        template: "post",
+      },
+      html: "<p>German inventor Johannes Gutenberg developed a method of movable type and used it to create one of the western world’s first major printed books, the “Forty–Two–Line” Bible.</p>",
+    },
+  },
+];

internal/testing/__mocks__/group.ts

@@ -0,0 +1,10 @@
+export default [
+  {
+    fieldValue: "typography",
+    totalCount: 1,
+  },
+  {
+    fieldValue: "design inspiration",
+    totalCount: 1,
+  },
+];

internal/testing/__mocks__/index.ts

@@ -5,3 +5,4 @@ export { default as pageContext } from "./page-context";
 export { default as contacts } from "./contacts";
 export { default as author } from "./author";
 export { default as menu } from "./menu";
+export { default as edges } from "./edges";

internal/testing/__mocks__/markdown-remark.ts

@@ -2,15 +2,17 @@ export default {
   id: "08870ea6-bdc8-4ec6-bf72-1e7d4488eb72",
   fields: {
     slug: "/posts/perfecting-the-art-of-perfection",
+    tagsSlugs: ["/handwriting", "/helvetica"],
     categorySlug: "/typography",
   },
   frontmatter: {
     date: "2016-09-01",
     description:
       "An Essay on Typography by Eric Gill takes the reader back to the year 1930. The year when a conflict between two worlds came to its term. The machines of the industrial world finally took over the handicrafts.",
-    category: "typography",
+    category: "Typography",
+    tags: ["Handwriting", "Helvetica"],
     title: "Perfecting the Art of Perfection",
     template: "post",
   },
-  html: "",
+  html: "<p>An Essay on Typography by Eric Gill takes the reader back to the year 1930. The year when a conflict between two worlds came to its term. The machines of the industrial world finally took over the handicrafts.</p>",
 };

internal/testing/__mocks__/page-context.ts

@@ -1,12 +1,10 @@
 export default {
-  pageContext: {
-    group: "typography",
-    pagination: {
-      currentPage: 2,
-      prevPagePath: "/typography/page/1",
-      nextPagePath: "/typography/page/3",
-      hasNextPage: true,
-      hasPrevPage: true,
-    },
+  group: "typography",
+  pagination: {
+    currentPage: 2,
+    prevPagePath: "/typography/page/1",
+    nextPagePath: "/typography/page/3",
+    hasNextPage: true,
+    hasPrevPage: true,
   },
 };

internal/testing/jest-config.ts

@@ -20,6 +20,12 @@ const jestConfig: Config.InitialOptions = {
     ".+\\.(css|sass|scss)$": "identity-obj-proxy",
     ".+\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
       "identity-obj-proxy",
+    "^gatsby-page-utils/(.*)$": "gatsby-page-utils/dist/$1",
+    "^gatsby-core-utils/(.*)$": "gatsby-core-utils/dist/$1",
+    "^gatsby-plugin-utils/(.*)$": [
+      "gatsby-plugin-utils/dist/$1",
+      "gatsby-plugin-utils/$1",
+    ],
   },
   transform: { "^.+\\.(t)sx?$": ["@swc/jest", swc] },
   setupFiles: ["<rootDir>/internal/testing/jest-setup.ts"],