diff --git a/src/components/App.tsx b/src/components/App.tsx index ce1fddc..0f15d79 100644 --- a/src/components/App.tsx +++ b/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} - {routes} + {routes} {!footerExcludePaths.includes(pathname) && footer} ) diff --git a/src/components/page/Page.tsx b/src/components/page/Page.tsx index d12285a..9d82274 100644 --- 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): JSX.Element => { - const { state } = useLocation() as Location + const { state } = useLocation() as Location> + + 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)(metadata) } - const childrenArray = Children.toArray(children) + if (notifications.length) { + const childrenArray = Children.toArray(children) + + notifications.forEach((notification, index) => { + childrenArray.splice( + notification.index ?? index, + 0, + , + ) + }) - 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, - , - ) - }, - ) + return childrenArray } - return childrenArray + return children }, session)} ) diff --git a/src/components/router/ScrollRoutes.tsx b/src/components/router/ScrollRoutes.tsx deleted file mode 100644 index 34e9ba9..0000000 --- a/src/components/router/ScrollRoutes.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import { type FC, useEffect } from "react" -import { Routes, type RoutesProps } from "react-router-dom" - -import { useLocation } from "../../hooks/router" - -export interface ScrollRoutesState { - scroll: { x: number; y: number } -} - -export interface ScrollRoutesProps extends RoutesProps {} - -const ScrollRoutes: FC = props => { - const { pathname, state } = useLocation() - - let { scroll } = state || {} - scroll = scroll || { x: 0, y: 0 } - - useEffect(() => { - window.scroll(scroll.x, scroll.y) - }, [pathname, scroll.x, scroll.y]) - - return -} - -export default ScrollRoutes diff --git a/src/components/router/index.tsx b/src/components/router/index.tsx index 5415b69..3131ff2 100644 --- a/src/components/router/index.tsx +++ b/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"