remove scroll routes

src/components/App.tsx

@@ -2,10 +2,9 @@ import { CssBaseline, ThemeProvider } from "@mui/material"
 import { type ThemeProviderProps } from "@mui/material/styles/ThemeProvider"
 import { useCallback, type FC, type ReactNode } from "react"
 import { Provider, type ProviderProps } from "react-redux"
-import { BrowserRouter } from "react-router-dom"
+import { BrowserRouter, Routes as RouterRoutes } from "react-router-dom"
 import { type Action } from "redux"
 
-import { ScrollRoutes } from "./router"
 import { InactiveDialog, ScreenTimeDialog } from "../features"
 import { useCountdown, useEventListener, useLocation } from "../hooks"
 // import "../scripts"
@@ -43,7 +42,7 @@ const Routes: FC<
   return (
     <>
       {!headerExcludePaths.includes(pathname) && header}
-      <ScrollRoutes>{routes}</ScrollRoutes>
+      <RouterRoutes>{routes}</RouterRoutes>
       {!footerExcludePaths.includes(pathname) && footer}
     </>
   )

src/components/page/Page.tsx

@@ -1,4 +1,4 @@
-import { Children } from "react"
+import { Children, useEffect } from "react"
 import { useLocation, type Location } from "react-router-dom"
 
 import {
@@ -15,6 +15,7 @@ export type PageState = {
     index?: number
     props: NotificationProps
   }>
+  scroll: { x: number; y: number }
 }
 
 export interface PageProps<
@@ -30,7 +31,15 @@ const Page = <
   children,
   session,
 }: PageProps<SessionUserType>): JSX.Element => {
-  const { state } = useLocation() as Location<unknown>
+  const { state } = useLocation() as Location<null | Partial<PageState>>
+
+  let { scroll, notifications } = state || {}
+  scroll = scroll || { x: 0, y: 0 }
+  notifications = notifications || []
+
+  useEffect(() => {
+    window.scroll(scroll.x, scroll.y)
+  }, [scroll.x, scroll.y])
 
   return (
     <>
@@ -41,32 +50,21 @@ const Page = <
             : (children as UseSessionChildrenFunction<false>)(metadata)
         }
 
-        const childrenArray = Children.toArray(children)
+        if (notifications.length) {
+          const childrenArray = Children.toArray(children)
+
+          notifications.forEach((notification, index) => {
+            childrenArray.splice(
+              notification.index ?? index,
+              0,
+              <Notification {...notification.props} />,
+            )
+          })
 
-        if (
-          typeof state === "object" &&
-          state !== null &&
-          "notifications" in state &&
-          Array.isArray(state.notifications) &&
-          state.notifications.every(
-            (notification: unknown) =>
-              typeof notification === "object" &&
-              notification !== null &&
-              "props" in notification,
-          )
-        ) {
-          ;(state.notifications as PageState["notifications"]).forEach(
-            (notification, index) => {
-              childrenArray.splice(
-                notification.index ?? index,
-                0,
-                <Notification {...notification.props} />,
-              )
-            },
-          )
+          return childrenArray
         }
 
-        return childrenArray
+        return children
       }, session)}
     </>
   )

src/components/router/index.tsx

@@ -10,5 +10,3 @@ export * from "./LinkTab"
 export { default as LinkTab } from "./LinkTab"
 export * from "./Navigate"
 export { default as Navigate } from "./Navigate"
-export * from "./ScrollRoutes"
-export { default as ScrollRoutes } from "./ScrollRoutes"