Пытаемся разобраться в параметрах функции здесь, откуда роутер и что он делает?

Question

Это _app по умолчанию, если я хочу создать веб-сайт с плавным переходом между страницами, я еще не совсем понимаю, как это работает. Не могли бы вы помочь мне лучше понять структуру?

import React from 'react';
import App from 'next/app';
import { AnimatePresence } from 'framer-motion';

import Layout from '../components/layout';

class MyApp extends App {
  render() {
    const { Component, pageProps, router } = this.props;

    return (
      <Layout>
        <AnimatePresence exitBeforeEnter>
          <Component {...pageProps} key={router.route} />
        </AnimatePresence>
      </Layout>
    );
  }
}

export default MyApp;