0

I have an application with markdown posts and comments taken from a Realtime Firebase database using getStaticProps.

At first, I get all of the paths:

export async function getStaticPaths() {
  const files = readdirSync('posts')

  const paths = files.map(fileName => ({
    params: {
      postname: fileName.replace('.md', '')
    }
  }))

  return {
    paths,
    fallback: false
  }
}

And then I obviously get the markdown data along with the snapshot of the comments themselves:

export async function getStaticProps({ params: { postname } }) {
  const fileName = readFileSync(`posts/${postname}.md`, 'utf-8')
  const { data: frontmatter, content } = matter(fileName)
  const snapshot = await retrieveComments(postname).then(snapshot => {
    return { props: { snapshot } }
  })
  const slug = postname

  return {
    props: {
      frontmatter,
      content,
      snapshot,
      slug
    }
  }
}

Everything works perfectly fine when it comes to getting the markdown data, but the comments list never updates in the UI if I add a comment to the Realtime database and update the page. Everything worked fine when I used getServerSideProps. And remember that we cannot use both getStatic... and getServerSide.... What can I do? Also, this problem that the comments list never updates appears only in production.

AND THE PROBLEM IS A HUNDRED PERCENT NOT IN THE CRUD OPERATIONS WITH THE DATABASE

Kul
  • 3
  • 3

1 Answers1

0

The page is statically generated, so it will display the updated result only on next build. Assuming, you are getting updated data from server, you can Use on demand revalidation when someone posts a comment:

export default async function handler(req, res) {
  try {
    // This should be the actual path not a rewritten path
    // e.g. for "/blog/[slug]" this should be "/blog/post-1"
    await res.revalidate('/path-to-revalidate');
    return res.json({ revalidated: true });
  } catch (err) {
    // If there was an error, Next.js will continue
    // to show the last successfully generated page
    return res.status(500).send('Error revalidating');
  }
}
Shivam Jha
  • 3,160
  • 3
  • 22
  • 36