misc: addressed ux issues

backend/src/server/routes/v1/sso-router.ts

@@ -288,7 +288,6 @@ export const registerSsoRouter = async (server: FastifyZodProvider) => {
       });
 
       return {
-        mfaEnabled: false,
         encryptionVersion: data.user.encryptionVersion,
         token: data.token.access,
         publicKey: data.user.publicKey,

backend/src/server/routes/v3/login-router.ts

@@ -95,7 +95,6 @@ export const registerLoginRouter = async (server: FastifyZodProvider) => {
       }),
       response: {
         200: z.object({
-          mfaEnabled: z.literal(false),
           encryptionVersion: z.number().default(1).nullable().optional(),
           protectedKey: z.string().nullable(),
           protectedKeyIV: z.string().nullable(),
@@ -131,7 +130,6 @@ export const registerLoginRouter = async (server: FastifyZodProvider) => {
       });
 
       return {
-        mfaEnabled: false,
         encryptionVersion: data.user.encryptionVersion,
         token: data.token.access,
         publicKey: data.user.publicKey,

frontend/src/pages/login/select-organization.tsx

@@ -46,6 +46,7 @@ export default function LoginPage() {
   const selectOrg = useSelectOrganization();
   const { data: user, isLoading: userLoading } = useGetUser();
   const [shouldShowMfa, toggleShowMfa] = useToggle(false);
+  const [isInitialOrgCheckLoading, setIsInitialOrgCheckLoading] = useState(true);
 
   const [mfaSuccessCallback, setMfaSuccessCallback] = useState<() => void>(() => {});
 
@@ -169,19 +170,22 @@ export default function LoginPage() {
     }
   }, [router]);
 
-  // Case: User has no organizations.
-  // This can happen if the user was previously a member, but the organization was deleted or the user was removed.
   useEffect(() => {
     if (organizations.isLoading || !organizations.data) return;
 
+    // Case: User has no organizations.
+    // This can happen if the user was previously a member, but the organization was deleted or the user was removed.
     if (organizations.data.length === 0) {
       router.push("/org/none");
     } else if (organizations.data.length === 1) {
       if (callbackPort) {
         handleCliRedirect();
+        setIsInitialOrgCheckLoading(false);
       } else {
         handleSelectOrganization(organizations.data[0]);
       }
+    } else {
+      setIsInitialOrgCheckLoading(false);
     }
   }, [organizations.isLoading, organizations.data]);
 
@@ -191,7 +195,11 @@ export default function LoginPage() {
     }
   }, [defaultSelectedOrg]);
 
-  if (userLoading || !user) {
+  if (
+    userLoading ||
+    !user ||
+    ((isInitialOrgCheckLoading || defaultSelectedOrg) && !shouldShowMfa)
+  ) {
     return <LoadingScreen />;
   }
 
@@ -205,11 +213,7 @@ export default function LoginPage() {
         <meta name="og:description" content={t("login.og-description") ?? ""} />
       </Head>
       {shouldShowMfa ? (
-        <Mfa
+        <Mfa email={user.email as string} successCallback={mfaSuccessCallback} />
-          email={user.email as string}
-          successCallback={mfaSuccessCallback}
-          closeMfa={() => toggleShowMfa.off()}
-        />
       ) : (
         <div className="mx-auto mt-20 w-fit rounded-lg border-2 border-mineshaft-500 p-10 shadow-lg">
           <Link href="/">

frontend/src/views/Login/Mfa.tsx

@@ -32,8 +32,8 @@ const codeInputProps = {
 } as const;
 
 type Props = {
-  successCallback: () => void;
+  successCallback: () => void | Promise<void>;
-  closeMfa: () => void;
+  closeMfa?: () => void;
   hideLogo?: boolean;
   email: string;
 };
@@ -58,8 +58,10 @@ export const Mfa = ({ successCallback, closeMfa, hideLogo, email }: Props) => {
       SecurityClient.setMfaToken("");
       SecurityClient.setToken(token);
 
-      successCallback();
+      await successCallback();
-      closeMfa();
+      if (closeMfa) {
+        closeMfa();
+      }
     } catch (error) {
       if (triesLeft) {
         setTriesLeft((left) => {