I changed the UID, but page with old UID is still active?

Developing with Prismic
10

Hi @kris & @marcellothearcane.

This behavior is happening because the UID field stores all previous values and allows you to query the document with these, even after the value has been changed. The reason it was designed this way was so that old link using the old UID value would still work (you wouldn't end up with broken links everywhere when you change the UID value).

So what we recommend doing is adding a check that compares the UID used to the current UID value. If it's an old UID value, then you redirect to the page using the new value.

In your particular case, the reason the old UID value works is indeed because you have fallback set to true. What I've done in my Next.js websites is add a useEffect to check if the UID value is out-of-date. Here is a simple example page that does this:

import React, { useEffect } from 'react'
import { useRouter } from 'next/router'
import Prismic from 'prismic-javascript'
import Custom404 from '../404'
import linkResolver from '../../utils/linkResolver'

export default function Page({ document, uid }) {
  const router = useRouter()
  if (router.isFallback) {
    return <h1>Loading...</h1>
  }

  if (!document) {
    return <Custom404 />
  }

  useEffect(() => {
    if (document.uid !== uid) {
      const forwardUrl = linkResolver(document)
      router.replace(forwardUrl)
    }
  }, [document])

  return (
    <div>
      ...your page content
    </div> 
  )
}

export async function getStaticPaths() {
  // getStaticPaths code
}

export async function getStaticProps({ params }) {
  const document = await Prismic.client('https://your-repo-name.cdn.prismic.io/api/v2')
    .getByUID('page', params.uid)

  return {
    props: { document, uid: params.uid },
  }
}

Give that a try and let me know if it solves your issue for you :grinning:

4 Likes