misc: addressed ux issues

This commit is contained in:
Sheen Capadngan
2024-10-23 00:00:15 +08:00
parent 5debeb421d
commit 571709370d
4 changed files with 18 additions and 15 deletions

View File

@ -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,

View File

@ -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,

View File

@ -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
email={user.email as string}
successCallback={mfaSuccessCallback}
closeMfa={() => toggleShowMfa.off()}
/>
<Mfa email={user.email as string} successCallback={mfaSuccessCallback} />
) : (
<div className="mx-auto mt-20 w-fit rounded-lg border-2 border-mineshaft-500 p-10 shadow-lg">
<Link href="/">

View File

@ -32,8 +32,8 @@ const codeInputProps = {
} as const;
type Props = {
successCallback: () => void;
closeMfa: () => void;
successCallback: () => void | Promise<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();
closeMfa();
await successCallback();
if (closeMfa) {
closeMfa();
}
} catch (error) {
if (triesLeft) {
setTriesLeft((left) => {