replacement scrollToTop by ScrollRestoration of react-router-dom

package.json

@@ -42,7 +42,7 @@
     "react-icons": "5.2.1",
     "react-intersection-observer": "9.10.2",
     "react-lazy-load": "4.0.1",
-    "react-router-dom": "6.23.0",
+    "react-router-dom": "6.23.1",
     "react-share": "4.4.1",
     "zustand": "4.5.2"
   },

src/pages/layout/Layout.tsx

@@ -4,18 +4,15 @@ import { Outlet } from 'react-router-dom';
 import { SkeletonMain } from '@components/skeletons/SkeletonMain';
 import { Nav } from '@components/nav/Nav';
 import { Footer } from '@components/Footer';
-import { ScrollToTop } from '@utils/ScrollToTop';
 
 export function Layout() {
   return (
     <>
-      <ScrollToTop>
-        <Nav />
-        <Suspense fallback={<SkeletonMain />}>
-          <Outlet />
-        </Suspense>
-        <Footer />
-      </ScrollToTop>
+      <Nav />
+      <Suspense fallback={<SkeletonMain />}>
+        <Outlet />
+      </Suspense>
+      <Footer />
     </>
   );
 }

src/routes.tsx

@@ -1,5 +1,5 @@
 import React, { lazy } from 'react';
-import { createBrowserRouter } from 'react-router-dom';
+import { ScrollRestoration, createBrowserRouter } from 'react-router-dom';
 
 import { Home } from '@pages/Home';
 import { Login } from '@pages/Login';
@@ -25,7 +25,12 @@ const NewBook = lazy(() => import('@pages/NewBook'));
 export const routes = createBrowserRouter([
   {
     path: '/',
-    element: <Layout />,
+    element: (
+      <>
+        <ScrollRestoration />
+        <Layout />
+      </>
+    ),
     errorElement: <div>Error 500 o Error Boundary</div>,
     children: [
       {