Flows / Page Transitions

Page Transitions

FastComments rides along with Gatsby's client-side route transitions. The thread stays mounted and in sync as you cross-fade between statically-generated pages that share a urlId.

Step · 1 of 2urlId · gatsby-demo-transition
page-transition-test-start.tsx
import PageTransition from 'gatsby-v2-plugin-page-transitions';
import { FastCommentsCommentWidget } from 'fastcomments-react';
import { Link } from 'gatsby';

export default function Page() {
  return (
    <PageTransition>
      <Link to="/page-transition-test-end">Next</Link>
      <FastCommentsCommentWidget tenantId="demo" urlId="gatsby-demo-transition" />
    </PageTransition>
  );
}