fix: Portal frontend 5 (#60)

* fix: scroll to top of page * remove scroll routes
ocadotechnology · Sep 20, 2024 · 3006f91 · 3006f91
1 parent 65d2459
commit 3006f91
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 50 deletions.
diff --git a/src/components/ScrollRoutes.tsx b/src/components/ScrollRoutes.tsx
diff --git a/src/components/index.ts b/src/components/index.ts
@@ -14,8 +14,6 @@ export * from "./ItemizedList"
 export { default as ItemizedList } from "./ItemizedList"
 export * from "./OrderedGrid"
 export { default as OrderedGrid } from "./OrderedGrid"
-export * from "./ScrollRoutes"
-export { default as ScrollRoutes } from "./ScrollRoutes"
 export * from "./SyncError"
 export { default as SyncError } from "./SyncError"
 export * from "./TablePagination"

diff --git a/src/components/page/Page.tsx b/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)}
     </>
   )