How to use useQuerySubscription on path generated using getStaticPaths

🆘 Support
1

I have a page with getStaticPaths that generate static paths for child pages and getStaticProps that gets content. I used useQuerySubscription and that helps me update content real time. Now the issue is, when I update slug in datoCMS and that is being used to generate paths, the href which picks from link from slug value in datoCMS has the new value, but the page built from getStaticPaths is not ready until next build. And so the new page fails until a build. How do we fix this?

export async function getStaticPaths({ locales }) {
    // hit the CMS to fetch the slugs of all the pages we need to build
    const slugQuery = `query MyQuery {
      allPages {
          slug
        }
      }`

    const allData = await request({ query: slugQuery })
    const paths = []
    for (const locale of locales) {
        for (const page of allData?.allPages) {
            paths.push(`/${locale}/pages/${page.slug}`)
        }
    }
    return {
        paths: paths,
        fallback: false
    }
}

const newQuery = {//query that fetches data in parent page }

//Inside the parent page
const renderedPage = ({ data }) => {
 const newData = useQuerySubscription(newQuery, initialData, token)

// in the DOM, the new data is used to generate markup
// other content here.....
<a href={`/data/${it.slug}`}> {it.name} <a>
2

hello @janakir and welcome to Community!

I think that if you are using getStaticPaths the slugs are generated at build time, so it’s correct that you need to start a new build to get the new paths.

If you want to have the paths generated at run time I think you should consider using this approach instead: Routing: Dynamic Routes | Next.js