Problem using google spreadsheet as source for a Next.JS website: changes won't update pages

Question

I made this restaurant's website and uses Google Spreadsheet to feed content into the menu pages. The choice of such method was based on simplicity and client expertise.

I'm using google-spreadsheet package to fetch all the information I need from this document on Google Drive...

//** ../pages/api/cardapios/index.js
import { GoogleSpreadsheet } from "google-spreadsheet";

export default async function getCardapioFromSlug(indexNumber) {
  try {

    const doc = new GoogleSpreadsheet(<%GOOGLE_SPREADSHEET_ID%>)
    
    await doc.useServiceAccountAuth({
      client_email: process.env.GOOGLE_SHEETS_SERVICE_ACCOUNT_EMAIL,
      private_key: process.env.GOOGLE_SHEETS_PRIVATE_KEY,
    });
    
    await doc.loadInfo()
    
    const cardapio = doc.sheetsByIndex[indexNumber]
    
    const rows = await cardapio.getRows()
    
    if (rows.length) {
      return rows.map(({
        Código,
        Produto,
        Unidade,
        Descrição,
        Valor,
        Procedência,
        Categoria
      }) => {
        return {
          Código,
          Produto,
          Unidade,
          Descrição,
          Valor,
          Procedência,
          Categoria
        }
      })
    }
  } catch (err) {
    console.log(err)
  }

  return [];
}

...then feeding it into the page using getStaticProps() function. It worked like a charm once I've got all things setup properly.

// ../pages/unidades/[slug].js
export async function getStaticProps({ params }) {
  const sanityData = await getCardapio(params.slug)

  const indexNumber = sanityData[0].id
  // console.log("index number", indexNumber)
  const produtos = await getCardapioFromSlug(indexNumber)
  const produtosStringfied = JSON.stringify(produtos)
  const produtosArray = JSON.parse(produtosStringfied)
  return {
    props: {
      cardapio: {
        info: sanityData[0] || null,
        items: produtosArray || null
      }

    },
    revalidate: 1
  }
}

The problem is after we changed values for some cells in the source document, the content wasn't automatically updated in the site.

I've tried redeploying (with both build cache on and off) it so the build process would grab the content from the document one more time and update the site, but it didn't worked. One idea was to make a webhook that would be avaiable for the client to run a simple command on his machine and rebuild the page with the new info, but this approach seems to be useless.

I red some articles ( this one for instance ) on custom webhooks for Google Spreadsheets but I can't really understand how it would trigger something on my page. Don't really think it would actually work.

Now I'm kind of stuck on where should I go. Perhaps I should rewrite my getStaticProps() ?

Answer 1

The issue has nothing to due with the code itself, but the misuse of the API. The id from the spreadsheet was wrong, still using a prototype which was used as base to the final one the client has. Changed the env var and everything went fine.

Had to force deploy ignoring build cache via vercel cli . Thanks to anyone that spent time commenting and wondering about this issue.