diff --git a/src/routes/common/ActorRedirect.tsx b/src/routes/common/ActorRedirect.tsx index dff0a8d3ba..2cc91f42f5 100644 --- a/src/routes/common/ActorRedirect.tsx +++ b/src/routes/common/ActorRedirect.tsx @@ -1,7 +1,9 @@ -import { Redirect, useLocation, useParams } from "react-router"; +import { useLayoutEffect } from "react"; +import { useLocation } from "react-router"; import { isInstalled } from "#/helpers/device"; import useIonViewIsVisible from "#/helpers/useIonViewIsVisible"; +import { useOptimizedIonRouter } from "#/helpers/useOptimizedIonRouter"; import { useAppSelector } from "#/store"; export const usingActorRedirect = !isInstalled(); @@ -13,28 +15,41 @@ export default function ActorRedirect({ children }: React.PropsWithChildren) { } function ActorRedirectEnabled({ children }: React.PropsWithChildren) { - const { actor } = useParams<{ actor: string }>(); const connectedInstance = useAppSelector( (state) => state.auth.connectedInstance, ); const location = useLocation(); const ionViewIsVisible = useIonViewIsVisible(); - - if (!ionViewIsVisible) return children; - if (!connectedInstance || !actor) return children; - if (connectedInstance === actor) return children; - - const [first, second, _wrongActor, ...urlEnd] = location.pathname.split("/"); - - // no need to redirect if url doesn't have actor - if (!_wrongActor || !isPotentialActor(_wrongActor)) return children; - - return ( - - ); + const router = useOptimizedIonRouter(); + + useLayoutEffect(() => { + if (!ionViewIsVisible) return; + + const [first, second, _wrongActor, ...urlEnd] = + location.pathname.split("/"); + + // no need to redirect if url doesn't have actor + if (!_wrongActor || !isPotentialActor(_wrongActor)) return; + + if (!connectedInstance || !_wrongActor) return; + if (connectedInstance === _wrongActor) return; + + requestAnimationFrame(() => { + router.push( + [first, second, connectedInstance, ...urlEnd].join("/"), + "root", + "replace", + ); + }); + }, [ + children, + connectedInstance, + ionViewIsVisible, + location.pathname, + router, + ]); + + return children; } function isPotentialActor(host: string) {