Dúvida: Recuperação de Cookie do lado do Client (React + NextJs)

Olha mano, não sei se serve para você, mas no meu caso que eu precisava apenas pegar a authorização JWT eu segui o padrão do NextJS com o getServerSideProps:

import { getCookie } from "cookies-next"

...

export async function getServerSideProps ({req, res}) {

    const token = getCookie("chaveJWT", { req, res });
    ...
    const tokenIsValid = verificaID(token)
    ...
    const redirectObj = {
		redirect: {
			permanent: false,
			destination: "/login",
		},
		props: {},
	};

    if (tokenIsValid) {
        return {
            props: {
                objetoGet,
            },
          };

    }
    return redirectObj
    

}

Opa, eu entendi a sua ideia mas recomendo você salvar no banco... Porque vocẽ ta levando em consideração que a pessoa vai seguir o fluxo de confirmação no mesmo lugar, por exemplo, estou no meu laptop, vou criar uma conta e confirmar o e-mail pelo laptop, mas eu por exemplo costumo muito usar o notebook e quando chega e-mail de validação eu abro o celular e confirmo rapido. Nesse cenário não vai funcionar )=

Da uma olhada na lib nookies
https://github.com/maticzav/nookies#readme

import { parseCookies, setCookie, destroyCookie } from 'nookies'

function handleClick() {
  // Simply omit context parameter.
  // Parse
  const cookies = parseCookies()
  console.log({ cookies })

  // Set
  setCookie(null, 'fromClient', 'value', {
    maxAge: 30 * 24 * 60 * 60,
    path: '/',
  })

  // Destroy
  // destroyCookie(null, 'cookieName')
}

export default function Me() {
  return <button onClick={handleClick}>Set Cookie</button>
}

Exemplo de uso real

'use client'
import { parseCookies } from 'nookies'
import { ReactNode, useEffect } from 'react'
import { useRouter } from 'next/navigation'

export default function ProviderAuth({ children }: { children: ReactNode }) {
  const { token } = parseCookies()
  const router = useRouter()
  useEffect(() => {
    if (token !== process.env.NEXT_PUBLIC_SECRET_KEY) {
      router.push('/')
    }
  }, [])
  return <div>{children}</div>
}