Redirect to original page after login when returnPath is set

platformplatform · Jan 11, 2025 · 9a920e4 · 9a920e4
1 parent 5181fc7
commit 9a920e4
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/application/account-management/WebApp/routes/login/index.tsx b/application/account-management/WebApp/routes/login/index.tsx
@@ -18,6 +18,11 @@ import { loggedInPath, signUpPath } from "@repo/infrastructure/auth/constants";
 import { useIsAuthenticated } from "@repo/infrastructure/auth/hooks";
 
 export const Route = createFileRoute("/login/")({
+  validateSearch: (search) => {
+    return {
+      returnPath: search.returnPath as string | undefined
+    };
+  },
   component: function LoginRoute() {
     const isAuthenticated = useIsAuthenticated();
 
@@ -40,6 +45,7 @@ export const Route = createFileRoute("/login/")({
 
 export function LoginForm() {
   const [email, setEmail] = useState("");
+  const { returnPath } = Route.useSearch();
 
   const [{ success, errors, data, title, message }, action, isPending] = useActionState(
     api.actionPost("/api/account-management/authentication/login/start"),
@@ -55,7 +61,7 @@ export function LoginForm() {
       expireAt: new Date(Date.now() + validForSeconds * 1000)
     });
 
-    return <Navigate to="/login/verify" />;
+    return <Navigate to="/login/verify" search={{ returnPath }} />;
   }
 
   return (

diff --git a/application/account-management/WebApp/routes/login/verify.tsx b/application/account-management/WebApp/routes/login/verify.tsx
@@ -17,8 +17,14 @@ import { FormErrorMessage } from "@repo/ui/components/FormErrorMessage";
 import { loggedInPath } from "@repo/infrastructure/auth/constants";
 import { useActionState, useEffect } from "react";
 import { useIsAuthenticated } from "@repo/infrastructure/auth/hooks";
+import { useSearch } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/login/verify")({
+  validateSearch: (search) => {
+    return {
+      returnPath: search.returnPath as string | undefined
+    };
+  },
   component: function LoginVerifyRoute() {
     const isAuthenticated = useIsAuthenticated();
 
@@ -42,6 +48,7 @@ export const Route = createFileRoute("/login/verify")({
 export function CompleteLoginForm() {
   const { email, loginId, expireAt } = getLoginState();
   const { expiresInString, isExpired } = useExpirationTimeout(expireAt);
+  const { returnPath } = Route.useSearch();
 
   const [{ success, title, message, errors }, action] = useActionState(
     api.actionPost("/api/account-management/authentication/login/{id}/complete"),
@@ -66,9 +73,9 @@ export function CompleteLoginForm() {
 
   useEffect(() => {
     if (success) {
-      window.location.href = loggedInPath;
+      window.location.href = returnPath || loggedInPath;
     }
-  }, [success]);
+  }, [success, returnPath]);
 
   useEffect(() => {
     if (isExpired) {