Merge pull request #5583 from PrestigePvP/tre/eng-4621-add-recent-login-awareness

feat(eng-4621): add recent login awareness to login page

Author: PrestigePvP

frontend/src/hooks/index.ts

@@ -1,5 +1,6 @@
 export { useDebounce } from "./useDebounce";
 export * from "./useGetProjectTypeFromRoute";
+export { useLastLogin } from "./useLastLogin";
 export { useLocalStorageState } from "./useLocalStorageState";
 export { usePagination } from "./usePagination";
 export { usePersistentState } from "./usePersistentState";

frontend/src/hooks/useLastLogin.ts

@@ -0,0 +1,30 @@
+import { useCallback } from "react";
+
+import { LoginMethod } from "@app/hooks/api/admin/types";
+
+import { useLocalStorageState } from "./useLocalStorageState";
+
+const LAST_LOGIN_KEY = "infisical.lastLogin";
+
+export type LastLogin = {
+  method: LoginMethod;
+  orgSlug?: string;
+  timestamp: number;
+};
+
+export const useLastLogin = () => {
+  const [lastLogin, setLastLogin] = useLocalStorageState<LastLogin | null>(LAST_LOGIN_KEY, null);
+
+  const saveLastLogin = useCallback(
+    (entry: Omit<LastLogin, "timestamp">) => {
+      setLastLogin({ ...entry, timestamp: Date.now() });
+    },
+    [setLastLogin]
+  );
+
+  const clearLastLogin = useCallback(() => {
+    setLastLogin(null);
+  }, [setLastLogin]);
+
+  return { lastLogin, saveLastLogin, clearLastLogin };
+};

frontend/src/pages/auth/LoginLdapPage/LoginLDAPPage.tsx

@@ -6,18 +6,24 @@ import { Link, useNavigate } from "@tanstack/react-router";
 import { createNotification } from "@app/components/notifications";
 import { Button, Input } from "@app/components/v2";
 import { useServerConfig } from "@app/context";
+import { LoginMethod } from "@app/hooks/api/admin/types";
 import { loginLDAPRedirect } from "@app/hooks/api/auth/queries";
+import { useLastLogin } from "@app/hooks/useLastLogin";
 
 export const LoginLdapPage = () => {
   const { t } = useTranslation();
   const navigate = useNavigate();
   const { config } = useServerConfig();
+  const { lastLogin, saveLastLogin } = useLastLogin();
   const queryParams = new URLSearchParams(window.location.search);
   const passedOrgSlug = queryParams.get("organizationSlug");
   const passedUsername = queryParams.get("username");
 
+  const lastLoginSlug =
+    lastLogin?.method === LoginMethod.LDAP && lastLogin.orgSlug ? lastLogin.orgSlug : "";
+
   const [organizationSlug, setOrganizationSlug] = useState(
-    config.defaultAuthOrgSlug || passedOrgSlug || ""
+    config.defaultAuthOrgSlug || passedOrgSlug || lastLoginSlug
   );
   const [username, setUsername] = useState(passedUsername || "");
   const [password, setPassword] = useState("");
@@ -40,6 +46,8 @@ export const LoginLdapPage = () => {
         return;
       }
 
+      saveLastLogin({ method: LoginMethod.LDAP, orgSlug: organizationSlug });
+
       createNotification({
         text: "Successfully logged in",
         type: "success"