groq conversion, start preparing changes to schema, refetch data with…

… groq, remove postcss reference and remove sanity-source-plugin`

web/gatsby-config.js

@@ -74,15 +74,6 @@ module.exports = {
         layout: require.resolve(`./src/layouts/index.tsx`)
       }
     },
-    {
-      resolve: 'gatsby-source-sanity',
-      options: {
-        projectId: process.env.SANITY_PROJECT_ID,
-        dataset: process.env.SANITY_DATASET,
-        token: process.env.SANITY_API_TOKEN,
-        watchMode: true
-      }
-    },
     {
       resolve: `gatsby-plugin-create-client-paths`,
       options: { prefixes: [`/account/*`, `/docs/*`, `/previews/*`] },
@@ -100,20 +91,6 @@ module.exports = {
     },
     `gatsby-plugin-typescript`,
     `gatsby-plugin-tslint`,
-    {
-      resolve: `gatsby-plugin-postcss`,
-      options: {
-        postCssPlugins: [
-          require(`postcss-preset-env`)({ stage: 0 }),
-          require('postcss-import'),
-          require('postcss-nested'),
-          require('postcss-cssnext'),
-          require('postcss-calc'),
-          require('postcss-discard-comments'),
-          require('postcss-reporter')
-        ]
-      }
-    },
 
     // this (optional) plugin enables Progressive Web App + Offline functionality
     // To learn more, visit: https://gatsby.dev/offline

web/gatsby-node.js

@@ -1,139 +1,73 @@
-
-exports.createPages = async ({graphql, actions}) => {
-  const {createPage} = actions
-
-  // Handle Redirects
-  const redirectsQuery = await graphql(`
-    {
-      allSanityRedirect {
-        edges {
-          node {
-            id
-            fromPath
-            statusCode
-            toPath
-          }
-        }
-      }
-    }
-  `)
-
-  if (redirectsQuery.errors) {
-    throw redirectsQuery.errors
-  }
-
-  //
-  // === Redirects ===
-  //
-  const redirects = redirectsQuery.data.allSanityRedirect.edges || []
-  redirects.forEach(redirect => {
-    const {
-      fromPath,
-      toPath,
-      statusCode
-    } = redirect.node
-    actions.createRedirect({
-      fromPath: fromPath,
-      toPath: toPath,
-      isPermanent: statusCode === 301, // use as fallback. this is part of Gatsby's API
-      statusCode: statusCode || 302 // Netlify specific. Will override `isPermanent`
+// Setup environment variables
+require('dotenv').config({ path: `.env.${process.env.NODE_ENV || 'development'}` });
+
+const { filter } = require('rxjs/operators');
+const client = require('./src/api/sanity');
+
+const {
+  getAllPageData,
+  createAllPages,
+} = require('./src/build/createPages');
+
+const CURRENT_COMMIT = require('child_process')
+  .execSync('git rev-parse HEAD')
+  .toString()
+  .trim();
+
+exports.createPages = ({ actions }) => new Promise((resolve, reject) => {
+  getAllPageData()
+    .then(allResponses => {
+      createAllPages(
+        allResponses,
+        actions,
+        resolve,
+        reject
+      )
     });
+});
+
+exports.onCreateWebpackConfig = ({
+  plugins,
+  actions,
+}) => {
+  actions.setWebpackConfig({
+    plugins: [
+      plugins.define({
+        'process.env.GITCOMMIT': JSON.stringify(CURRENT_COMMIT),
+      }),
+    ],
   });
+};
 
-  // Query Pages
-  const pagesQuery = await graphql(`
-    {
-      allSanityPage {
-        edges {
-          node {
-            _rawContent(resolveReferences: {maxDepth: 9})
-          }
-        }
-      }
-    }
-  `)
+exports.onCreatePage = async ({ page, actions }) => {
+  const { deletePage } = actions;
 
-  if (pagesQuery.errors) {
-    throw pagesQuery.errors
+  // Delete dev 404 page for accounts to work in dev
+  if (page.internalComponentName === 'ComponentDev404Page') {
+    deletePage(page);
   }
-
-  const pages = pagesQuery.data.allSanityPage.edges || []
-  pages.forEach((edge, index) => {
-    const path = `/${edge.node._rawContent.main.slug.current === 'home' ? '' : edge.node._rawContent.main.slug.current}`
-
-    createPage({
-      path,
-      component: require.resolve('./src/templates/page.tsx'),
-      context: {...edge.node._rawContent},
+};
+
+exports.sourceNodes = async ({
+  actions,
+  createContentDigest,
+  createNodeId,
+}) => {
+  client
+    .listen('*[!(_id in path("_.**"))]')
+    .pipe(filter(event => !event.documentId.startsWith('drafts.')))
+    .subscribe(() => {
+      const update = { date: new Date() };
+
+      actions.createNode({
+        id: createNodeId(1),
+        internal: {
+          type: 'update',
+          content: JSON.stringify(update),
+          contentDigest: createContentDigest(update),
+        },
+      });
+
+      console.log('[gatsby-node]: CMS update triggered');
     })
-  })
-
-  // Query Products
-  const productsQuery = await graphql(`
-  {
-    allSanityProduct {
-      edges {
-        node {
-          _rawContent(resolveReferences: {maxDepth: 9})
-        }
-      }
-    }
-  }
-`)
-
-  if (productsQuery.errors) {
-    throw productsQuery.errors
-  }
-
-  const products = productsQuery.data.allSanityProduct.edges || []
-  products.forEach((edge, index) => {
-  const path = `/products/${edge.node._rawContent.main.slug.current}`
-
-    createPage({
-      path,
-      component: require.resolve('./src/templates/product.tsx'),
-      context: {...edge.node._rawContent},
-    })
-  })
-
-  // Query Collections
-  const collectionsQuery = await graphql(`
-  {
-    allSanityCollection {
-      edges {
-        node {
-          _rawContent(resolveReferences: {maxDepth: 9})
-        }
-      }
-    }
-  }
-`)
-
-  if (collectionsQuery.errors) {
-    throw collectionsQuery.errors
-  }
-
-  const collections = collectionsQuery.data.allSanityCollection.edges || []
-  collections.forEach((edge, index) => {
-    const path = `/collection/${edge.node._rawContent.main.slug.current}`
-
-    createPage({
-      path,
-      component: require.resolve('./src/templates/page.tsx'),
-      context: {...edge.node._rawContent},
-    })
-  })
-}
-
-exports.onCreatePage = ({ page, actions }) => {
-  const { createPage } = actions
-  if (page.path.startsWith('/docs')) {
-    page.context.layout = 'docs'
-    createPage(page)
-  }
-
-  if (page.path.startsWith('/account')) {
-    page.context.layout = 'accounts'
-    createPage(page)
-  }
-}
+};

web/src/api/queries.js

@@ -0,0 +1,72 @@
+const groq = require('groq')
+
+const slugQuery = groq`
+  'slug': content.main.slug.current
+`
+
+const asset = groq`{
+  _type,
+  _key,
+  alt,
+  caption,
+  '_id': image.asset->_id,
+  'dimensions': image.asset->metadata.dimensions,
+  'url': image.asset->url,
+}`
+
+
+const moduleQuery = groq`
+  _type == 'nestedPages' => {
+    ...,
+    page[] {
+      ...,
+      linkedPage->
+    }
+  },
+  _type == 'productGrid' => {
+    ...,
+    products[]-> {
+      ...,
+    }
+  }
+`
+
+const pageQuery = groq`
+  ${slugQuery},
+  ...,
+  'modules': content.main.modules[] {
+    ...,
+    ${moduleQuery}
+  },
+`
+
+const productQuery = groq`
+  ${slugQuery},
+  ...,
+  'modules': content.main.modules[] {
+    ...,
+    ${moduleQuery}
+  },
+  'main': content.main {
+    ...,
+    mainImage {
+      asset-> {
+        _id
+      }
+    }
+  }
+`
+module.exports.collections = groq`*[_type == "collection"] {
+  ${pageQuery}
+}`
+module.exports.pages = groq`*[_type == "page"] {
+  ${pageQuery}
+}`
+
+module.exports.products = groq`*[_type == "product"]{
+  ${productQuery}
+}`
+
+
+module.exports.pageQuery = pageQuery 
+module.exports.productQuery = productQuery

web/src/api/sanity.js

@@ -0,0 +1,8 @@
+const sanityClient = require('@sanity/client');
+
+module.exports = sanityClient({
+  projectId: process.env.GATSBY_SANITY_PROJECT_ID,
+  dataset: process.env.GATSBY_SANITY_DATASET,
+  token: process.env.SANITY_API_TOKEN,
+  useCdn: false
+});