Awaiting the Cloudinary Promise

gatsby-node.js

require("dotenv").config({
  path: `.env.${process.env.NODE_ENV}`
})

const path = require("path")
const createPaginatedPages = require("gatsby-paginate")
const cloudinary = require("cloudinary").v2

cloudinary.config({
  cloud_name: `${process.env.CLOUDINARY_NAME}`,
  api_key: `${process.env.CLOUDINARY_API_KEY}`,
  api_secret: `${process.env.CLOUDINARY_SECRET}`
})

// Implement the Gatsby API “onCreatePage”. This is
// called after every page is created.
exports.onCreatePage = async ({ page, actions }) => {
  const { createPage } = actions
  // page.matchPath is a special key that's used for matching pages
  // only on the client.
  if (page.path.match(/^\/app/)) {
    page.matchPath = "/admin/*"

    // Update the page.
    createPage(page)
  }
}

exports.createPages = async ({ graphql, actions }) => {
  const { createPage } = actions

  const { data, errors } = await graphql(
    `
        {
          allWordpressPost(limit: ${process.env.BLOG_LIMIT}) {
            edges {
              node {
                id
                slug
                title
                content
                excerpt
                date
                modified
                categories {
                  name
                }
                author {
                  name
                }
                featured_media {
                  localFile {
                    childImageSharp {
                      fluid {
                        src
                        srcSet
                        sizes
                        aspectRatio
                      }
                    }
                  }
                }
              }
            }
          }
        }
      `
  )

  if (errors) {
    return Promise.reject(errors)
  }

  createPaginatedPages({
    edges: result.data.allWordpressPost.edges,
    createPage: createPage,
    pageTemplate: "./src/components/elements/blog/PostsTemplate.tsx",
    pageLength: 5,
    pathPrefix: "/blog"
  })

  await Promise.all(
    result.data.allWordpressPost.edges.map(({ node }) => {
      const cloudinaryPromise = new Promise((resolve, reject) => {
        return cloudinary.uploader.upload(
          `./public${node.featured_media.localFile.childImageSharp.fluid.src}`,
          (error, result) => {
            if (result) {
              resolve(result)
            }
            if (error) {
              reject(new Error("ERROR WITH CLOUDINARY UPLOAD"))
            }
          }
        )
      })

      return cloudinaryPromise.then(data => {
        return createPage({
          path: "blog/" + node.slug,
          component: path.resolve(
            "./src/components/elements/blog/PostTemplate.tsx"
          ),
          context: {
            slug: node.slug,
            imageSharp: node.featured_media,
            title: node.title,
            author: node.author.name,
            categories: node.categories,
            modified: node.modified,
            content: node.content,
            excerpt: node.excerpt,
            cloudinaryURL: data.url
          }
        })
      })
    })
  )
  // we're done, and awaiting successfully. Wahoo!
}