From 3131c6be947fac033a6531415ac50ea962bd4803 Mon Sep 17 00:00:00 2001
From: Mohammed Modi <mohammedmodi@gmail.com>
Date: Tue, 10 May 2022 15:19:41 +0530
Subject: [PATCH] Removed unwanted static query compenents

---
 gatsby-node.js                                | 53 ++++++++++++++++++-
 src/components/layout.js                      | 32 +++--------
 src/components/pinnedNode/allPinned.js        | 51 ------------------
 .../pinnedNode/engineeringPinned.js           | 52 ------------------
 src/components/pinnedNode/growthPinned.js     | 52 ------------------
 src/components/pinnedNode/identityPinned.js   | 52 ------------------
 src/templates/blog-list-template.js           | 35 ++++++++++--
 7 files changed, 90 insertions(+), 237 deletions(-)
 delete mode 100644 src/components/pinnedNode/allPinned.js
 delete mode 100644 src/components/pinnedNode/engineeringPinned.js
 delete mode 100644 src/components/pinnedNode/growthPinned.js
 delete mode 100644 src/components/pinnedNode/identityPinned.js

diff --git a/gatsby-node.js b/gatsby-node.js
index 6031abafd..d9a96aa63 100644
--- a/gatsby-node.js
+++ b/gatsby-node.js
@@ -8,14 +8,22 @@ exports.createPages = async ({ graphql, actions }) => {
   const tagResults = await graphql(
     `
       {
-        allMarkdownRemark {
+        allMarkdownRemark(sort: { fields: frontmatter___date, order: DESC }) {
           totalCount
+          edges {
+            node {
+              id
+            }
+          }
         }
         tagsGroup: allMarkdownRemark(limit: 2000) {
           group(field: frontmatter___tags) {
             fieldValue
           }
         }
+        markdownRemark(frontmatter: { pinned: { eq: true } }) {
+          id
+        }
       }
     `
   )
@@ -41,8 +49,20 @@ exports.createPages = async ({ graphql, actions }) => {
       {
         allMarkdownRemark(
           filter: { fields: { slug: { regex: "//engineering//" } } }
+          sort: { fields: frontmatter___date, order: DESC }
         ) {
           totalCount
+          edges {
+            node {
+              id
+            }
+          }
+        }
+        markdownRemark(
+          frontmatter: { pinned: { eq: true } }
+          fields: { slug: { regex: "//engineering//" } }
+        ) {
+          id
         }
       }
     `
@@ -52,8 +72,20 @@ exports.createPages = async ({ graphql, actions }) => {
       {
         allMarkdownRemark(
           filter: { fields: { slug: { regex: "//identity//" } } }
+          sort: { fields: frontmatter___date, order: DESC }
         ) {
           totalCount
+          edges {
+            node {
+              id
+            }
+          }
+        }
+        markdownRemark(
+          frontmatter: { pinned: { eq: true } }
+          fields: { slug: { regex: "//identity//" } }
+        ) {
+          id
         }
       }
     `
@@ -63,8 +95,20 @@ exports.createPages = async ({ graphql, actions }) => {
       {
         allMarkdownRemark(
           filter: { fields: { slug: { regex: "//growth//" } } }
+          sort: { fields: frontmatter___date, order: DESC }
         ) {
           totalCount
+          edges {
+            node {
+              id
+            }
+          }
+        }
+        markdownRemark(
+          frontmatter: { pinned: { eq: true } }
+          fields: { slug: { regex: "//growth//" } }
+        ) {
+          id
         }
       }
     `
@@ -114,6 +158,12 @@ exports.createSchemaCustomization = ({ actions }) => {
 
 const createTypePages = (type, results, createPage) => {
   const postsPerPage = 6
+  let pinnedId = ""
+  if (results.data.markdownRemark) {
+    pinnedId = results.data.markdownRemark.id
+  } else {
+    pinnedId = results.data.allMarkdownRemark.edges[0].node.id
+  }
   const total = results.data.allMarkdownRemark.totalCount
   const numPages = Math.ceil(total / postsPerPage)
   Array.from({ length: numPages }).forEach((_, i) => {
@@ -126,6 +176,7 @@ const createTypePages = (type, results, createPage) => {
         currentPage: i + 1,
         type: `/${type}/`,
         numPages: numPages,
+        pinned: pinnedId,
       },
     })
   })
diff --git a/src/components/layout.js b/src/components/layout.js
index e25194141..fd0292f54 100644
--- a/src/components/layout.js
+++ b/src/components/layout.js
@@ -4,10 +4,6 @@ import Footer from "./footer"
 import Header from "./header"
 import layoutStyles from "./layout.module.scss"
 import PinnedCard from "./pinnedCard"
-import AllPinned from "./pinnedNode/allPinned"
-import EngPinned from "./pinnedNode/engineeringPinned"
-import GrowthPinned from "./pinnedNode/growthPinned"
-import IdentityPinned from "./pinnedNode/identityPinned"
 
 const Layout = ({ postPage, children, pinned, pinnedData, pathname, type }) => {
   return (
@@ -40,17 +36,13 @@ const Layout = ({ postPage, children, pinned, pinnedData, pathname, type }) => {
                 pathname={pathname}
                 type={type}
               />
-              <div className={layoutStyles.pinnedwrap}>
-                <div className={layoutStyles.blogContentPinned}>
-                  {pinned ? (
-                    pinnedData.length ? (
-                      <PinnedCard node={pinnedData[0].node} />
-                    ) : (
-                      getFirstNode(type)
-                    )
-                  ) : null}
+              {pinned ? (
+                <div className={layoutStyles.pinnedwrap}>
+                  <div className={layoutStyles.blogContentPinned}>
+                    <PinnedCard node={pinnedData} />
+                  </div>
                 </div>
-              </div>
+              ) : null}
               <div className={layoutStyles.blogContent}>
                 <div className={layoutStyles.content}>{children}</div>
               </div>
@@ -67,16 +59,4 @@ const Layout = ({ postPage, children, pinned, pinnedData, pathname, type }) => {
   )
 }
 
-const getFirstNode = type => {
-  if (type === "engineering") {
-    return <EngPinned />
-  } else if (type === "growth") {
-    return <GrowthPinned />
-  } else if (type === "identity") {
-    return <IdentityPinned />
-  } else {
-    return <AllPinned />
-  }
-}
-
 export default Layout
diff --git a/src/components/pinnedNode/allPinned.js b/src/components/pinnedNode/allPinned.js
deleted file mode 100644
index 74ed34f6f..000000000
--- a/src/components/pinnedNode/allPinned.js
+++ /dev/null
@@ -1,51 +0,0 @@
-import { graphql, StaticQuery } from "gatsby"
-import React from "react"
-import PinnedCard from "../pinnedCard"
-
-const AllPinned = () => {
-  return (
-    <StaticQuery
-      query={graphql`
-        query {
-          allMarkdownRemark(
-            limit: 1
-            sort: { fields: [frontmatter___date], order: DESC }
-          ) {
-            edges {
-              node {
-                excerpt
-                fields {
-                  slug
-                }
-                html
-                frontmatter {
-                  date(formatString: "MMMM DD, YYYY")
-                  description
-                  title
-                  tags
-                  pinned
-                  coverImage {
-                    childImageSharp {
-                      fluid {
-                        ...GatsbyImageSharpFluid_noBase64
-                      }
-                    }
-                  }
-                  author {
-                    id
-                    github
-                  }
-                }
-              }
-            }
-          }
-        }
-      `}
-      render={({ allMarkdownRemark: { edges } }) => (
-        <PinnedCard node={edges[0].node} />
-      )}
-    />
-  )
-}
-
-export default AllPinned
diff --git a/src/components/pinnedNode/engineeringPinned.js b/src/components/pinnedNode/engineeringPinned.js
deleted file mode 100644
index 38f2d488b..000000000
--- a/src/components/pinnedNode/engineeringPinned.js
+++ /dev/null
@@ -1,52 +0,0 @@
-import { graphql, StaticQuery } from "gatsby"
-import React from "react"
-import PinnedCard from "../pinnedCard"
-
-const EngPinned = () => {
-  return (
-    <StaticQuery
-      query={graphql`
-        query {
-          allMarkdownRemark(
-            filter: { fields: { slug: { regex: "//engineering//" } } }
-            limit: 1
-            sort: { fields: [frontmatter___date], order: DESC }
-          ) {
-            edges {
-              node {
-                excerpt
-                fields {
-                  slug
-                }
-                html
-                frontmatter {
-                  date(formatString: "MMMM DD, YYYY")
-                  description
-                  title
-                  tags
-                  pinned
-                  coverImage {
-                    childImageSharp {
-                      fluid {
-                        ...GatsbyImageSharpFluid_noBase64
-                      }
-                    }
-                  }
-                  author {
-                    id
-                    github
-                  }
-                }
-              }
-            }
-          }
-        }
-      `}
-      render={({ allMarkdownRemark: { edges } }) => (
-        <PinnedCard node={edges[0].node} />
-      )}
-    />
-  )
-}
-
-export default EngPinned
diff --git a/src/components/pinnedNode/growthPinned.js b/src/components/pinnedNode/growthPinned.js
deleted file mode 100644
index a0e61bd5b..000000000
--- a/src/components/pinnedNode/growthPinned.js
+++ /dev/null
@@ -1,52 +0,0 @@
-import { graphql, StaticQuery } from "gatsby"
-import React from "react"
-import PinnedCard from "../pinnedCard"
-
-const GrowthPinned = () => {
-  return (
-    <StaticQuery
-      query={graphql`
-        query {
-          allMarkdownRemark(
-            filter: { fields: { slug: { regex: "//growth//" } } }
-            limit: 1
-            sort: { fields: [frontmatter___date], order: DESC }
-          ) {
-            edges {
-              node {
-                excerpt
-                fields {
-                  slug
-                }
-                html
-                frontmatter {
-                  date(formatString: "MMMM DD, YYYY")
-                  description
-                  title
-                  tags
-                  pinned
-                  coverImage {
-                    childImageSharp {
-                      fluid {
-                        ...GatsbyImageSharpFluid_noBase64
-                      }
-                    }
-                  }
-                  author {
-                    id
-                    github
-                  }
-                }
-              }
-            }
-          }
-        }
-      `}
-      render={({ allMarkdownRemark: { edges } }) => (
-        <PinnedCard node={edges[0].node} />
-      )}
-    />
-  )
-}
-
-export default GrowthPinned
diff --git a/src/components/pinnedNode/identityPinned.js b/src/components/pinnedNode/identityPinned.js
deleted file mode 100644
index 8e5df4a4e..000000000
--- a/src/components/pinnedNode/identityPinned.js
+++ /dev/null
@@ -1,52 +0,0 @@
-import { graphql, StaticQuery } from "gatsby"
-import React from "react"
-import PinnedCard from "../pinnedCard"
-
-const IdentityPinned = () => {
-  return (
-    <StaticQuery
-      query={graphql`
-        query {
-          allMarkdownRemark(
-            filter: { fields: { slug: { regex: "//identity//" } } }
-            limit: 1
-            sort: { fields: [frontmatter___date], order: DESC }
-          ) {
-            edges {
-              node {
-                excerpt
-                fields {
-                  slug
-                }
-                html
-                frontmatter {
-                  date(formatString: "MMMM DD, YYYY")
-                  description
-                  title
-                  tags
-                  pinned
-                  coverImage {
-                    childImageSharp {
-                      fluid {
-                        ...GatsbyImageSharpFluid_noBase64
-                      }
-                    }
-                  }
-                  author {
-                    id
-                    github
-                  }
-                }
-              }
-            }
-          }
-        }
-      `}
-      render={({ allMarkdownRemark: { edges } }) => (
-        <PinnedCard node={edges[0].node} />
-      )}
-    />
-  )
-}
-
-export default IdentityPinned
diff --git a/src/templates/blog-list-template.js b/src/templates/blog-list-template.js
index 6b4f13aca..aaf34ef04 100644
--- a/src/templates/blog-list-template.js
+++ b/src/templates/blog-list-template.js
@@ -9,8 +9,7 @@ const { startCase } = require("lodash")
 
 const BlogList = ({ data, pageContext, location }) => {
   const { currentPage, numPages, type } = pageContext
-  const posts = data.allMarkdownRemark.edges
-  const pinnedNode = posts.filter(edges => edges.node.frontmatter.pinned)
+  const pinnedNode = data.markdownRemark
   const bType = type.replace(/[^a-z]/gi, "")
 
   return (
@@ -54,7 +53,12 @@ const BlogList = ({ data, pageContext, location }) => {
 export default BlogList
 
 export const blogListQuery = graphql`
-  query blogListQuery($skip: Int!, $limit: Int!, $type: String!) {
+  query blogListQuery(
+    $skip: Int!
+    $limit: Int!
+    $type: String!
+    $pinned: String!
+  ) {
     allMarkdownRemark(
       filter: { fields: { slug: { regex: $type } } }
       sort: { fields: [frontmatter___date], order: DESC }
@@ -89,5 +93,30 @@ export const blogListQuery = graphql`
         }
       }
     }
+    markdownRemark(id: { eq: $pinned }) {
+      excerpt
+      fields {
+        slug
+      }
+      html
+      frontmatter {
+        date(formatString: "MMMM DD, YYYY")
+        description
+        title
+        tags
+        pinned
+        coverImage {
+          childImageSharp {
+            fluid {
+              ...GatsbyImageSharpFluid_noBase64
+            }
+          }
+        }
+        author {
+          id
+          github
+        }
+      }
+    }
   }
 `