Next.js tips

Recommended usage with Next.js

export default function DefaultPageTransition({ children }) {
  const router = useRouter();

  // get a more friendly path name (especially for generic pages instead of [...slug])
  const pageName = router.asPath; 

  return (
    <PageTransitions
      key={router.isReady ? 'hydrated' : 'ssr'} // make sure ?querystring parsing works
      pageName={pageName}
    >
      {children}
    </PageTransitions>
  );
}