feat: preserve login params in forgot password screen

Author: steveiliop56

frontend/src/components/auth/login-form.tsx

@@ -17,6 +17,7 @@ interface Props {
   onSubmit: (data: LoginSchema) => void;
   loading?: boolean;
   formId?: string;
+  params?: string;
 }
 
 export const LoginForm = (props: Props) => {
@@ -71,6 +72,12 @@ export const LoginForm = (props: Props) => {
                 </FormControl>
                 <a
                   href="/forgot-password"
+                  onClick={(e) => {
+                    e.preventDefault();
+                    window.location.replace(
+                      `/forgot-password${props.params ? `${props.params}` : ""}`,
+                    );
+                  }}
                   className="text-muted-foreground hover:text-muted-foreground/80 text-sm absolute right-0 bottom-[2.565rem]" // 2.565 is *just* perfect
                 >
                   {t("forgotPasswordTitle")}

frontend/src/lib/i18n/locales/en-US.json

@@ -79,5 +79,6 @@
     "profileScopeName": "Profile",
     "profileScopeDescription": "Allows the app to access your profile information.",
     "groupsScopeName": "Groups",
-    "groupsScopeDescription": "Allows the app to access your group information."
+    "groupsScopeDescription": "Allows the app to access your group information.",
+    "backToLoginButton": "Back to login"
 }

frontend/src/lib/i18n/locales/en.json

@@ -79,5 +79,6 @@
     "profileScopeName": "Profile",
     "profileScopeDescription": "Allows the app to access your profile information.",
     "groupsScopeName": "Groups",
-    "groupsScopeDescription": "Allows the app to access your group information."
+    "groupsScopeDescription": "Allows the app to access your group information.",
+    "backToLoginButton": "Back to login"
 }

frontend/src/pages/forgot-password-page.tsx

@@ -10,12 +10,13 @@ import { Button } from "@/components/ui/button";
 import { useAppContext } from "@/context/app-context";
 import { useTranslation } from "react-i18next";
 import Markdown from "react-markdown";
-import { useNavigate } from "react-router";
+import { useLocation } from "react-router";
 
 export const ForgotPasswordPage = () => {
   const { forgotPasswordMessage } = useAppContext();
   const { t } = useTranslation();
-  const navigate = useNavigate();
+  const { search } = useLocation();
+  const searchParams = new URLSearchParams(search);
 
   return (
     <Card>
@@ -36,10 +37,13 @@ export const ForgotPasswordPage = () => {
           className="w-full"
           variant="outline"
           onClick={() => {
-            navigate("/login");
+            const eparams = searchParams.toString();
+            window.location.replace(
+              `/login${eparams.length > 0 ? `?${eparams}` : ""}`,
+            );
           }}
         >
-          {t("notFoundButton")}
+          {t("backToLoginButton")}
         </Button>
       </CardFooter>
     </Card>

frontend/src/pages/login-page.tsx

@@ -264,6 +264,10 @@ export const LoginPage = () => {
             onSubmit={(values) => loginMutate(values)}
             loading={loginIsPending || oauthIsPending}
             formId={formId}
+            params={(() => {
+              const eparams = searchParams.toString();
+              return eparams.length > 0 ? `?${eparams}` : "";
+            })()}
           />
         )}
         {providers.length == 0 && (