From bb4deb1ae9346254c19bfd46208fe336a2370b91 Mon Sep 17 00:00:00 2001
From: Fred KISSIE <fredkiss3@gmail.com>
Date: Fri, 3 Jul 2026 21:05:16 +0200
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20remember=20last=20used=20idp=20in?=
 =?UTF-8?q?=20dashboard=20login=20form?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/LoginForm.tsx | 55 +++++++++++++++++++++++-------------
 1 file changed, 36 insertions(+), 19 deletions(-)

diff --git a/src/components/LoginForm.tsx b/src/components/LoginForm.tsx
index fe3c80667..40685f846 100644
--- a/src/components/LoginForm.tsx
+++ b/src/components/LoginForm.tsx
@@ -30,10 +30,7 @@ import Link from "next/link";
 import { GenerateOidcUrlResponse } from "@server/routers/idp";
 import { Separator } from "./ui/separator";
 import { useTranslations } from "next-intl";
-import {
-    generateOidcUrlProxy,
-    loginProxy
-} from "@app/actions/server";
+import { generateOidcUrlProxy, loginProxy } from "@app/actions/server";
 import { redirect as redirectTo } from "next/navigation";
 import { useEnvContext } from "@app/hooks/useEnvContext";
 import IdpTypeIcon from "@app/components/IdpTypeIcon";
@@ -41,6 +38,7 @@ import IdpTypeIcon from "@app/components/IdpTypeIcon";
 import { loadReoScript } from "reodotdev";
 import { build } from "@server/build";
 import MfaInputForm from "@app/components/MfaInputForm";
+import { useLocalStorage } from "@app/hooks/useLocalStorage";
 
 export type LoginFormIDP = {
     idpId: number;
@@ -105,7 +103,6 @@ export default function LoginForm({
         }
     }, []);
 
-
     const formSchema = z.object({
         email: z.string().email({ message: t("emailInvalid") }),
         password: z.string().min(8, { message: t("passwordRequirementsChars") })
@@ -130,6 +127,10 @@ export default function LoginForm({
         }
     });
 
+    const [lastUsedIdpId, setLastUsedIdpId] = useLocalStorage<string | null>(
+        "login:last-used-idp",
+        null
+    );
 
     async function onSubmit(values: any) {
         const { email, password } = form.getValues();
@@ -179,8 +180,7 @@ export default function LoginForm({
             if (data.useSecurityKey) {
                 setError(
                     t("securityKeyRequired", {
-                        defaultValue:
-                            "Please use your security key to sign in."
+                        defaultValue: "Please use your security key to sign in."
                     })
                 );
                 return;
@@ -242,6 +242,8 @@ export default function LoginForm({
 
     async function loginWithIdp(idpId: number) {
         let redirectUrl: string | undefined;
+
+        setLastUsedIdpId(idpId.toString());
         try {
             const data = await generateOidcUrlProxy(
                 idpId,
@@ -356,7 +358,6 @@ export default function LoginForm({
             )}
 
             <div className="space-y-4">
-
                 {!mfaRequested && (
                     <>
                         <SecurityKeyAuthButton
@@ -385,25 +386,41 @@ export default function LoginForm({
                                         idp.variant || idp.name.toLowerCase();
 
                                     return (
-                                        <Button
+                                        <div
+                                            className="w-full relative"
                                             key={idp.idpId}
-                                            type="button"
-                                            variant="outline"
-                                            className="w-full inline-flex items-center space-x-2"
-                                            onClick={() => {
-                                                loginWithIdp(idp.idpId);
-                                            }}
                                         >
-                                            <IdpTypeIcon type={effectiveType} size={16} />
-                                            <span>{idp.name}</span>
-                                        </Button>
+                                            <Button
+                                                key={idp.idpId}
+                                                type="button"
+                                                variant="outline"
+                                                className="w-full inline-flex items-center space-x-2 after:absolute after:inset-0 after:z-10"
+                                                onClick={() => {
+                                                    loginWithIdp(idp.idpId);
+                                                }}
+                                            >
+                                                <IdpTypeIcon
+                                                    type={effectiveType}
+                                                    size={16}
+                                                />
+                                                <span>{idp.name}</span>
+                                            </Button>
+
+                                            {lastUsedIdpId ===
+                                                idp.idpId.toString() && (
+                                                <div className="absolute inset-0">
+                                                    <span className="absolute top-0 right-0 text-xs bg-primary text-primary-foreground rounded-bl-sm rounded-tr-sm px-2 py-0.5">
+                                                        {t("idpLastUsed")}
+                                                    </span>
+                                                </div>
+                                            )}
+                                        </div>
                                     );
                                 })}
                             </>
                         )}
                     </>
                 )}
-
             </div>
         </div>
     );