From 63a6be214398816b1c438d010fada48300afed59 Mon Sep 17 00:00:00 2001 From: Prateek Shourya Date: Wed, 22 May 2024 17:31:56 +0530 Subject: [PATCH] [WEB-1404] chore: auth ui / ux fixes (#4552) * chore: update deactivated account alert message to show support email if available in env. * chore: clear error_info on email check. * chore: fix log-in / sign-up forms alignment and minor ux copy fix. * fix: auth redirection to `/sign-in` issue. * chore: update `back to sign in` url in forgot password screen. --- turbo.json | 1 + web/components/account/auth-forms/auth-header.tsx | 12 ++++++------ web/components/account/auth-forms/auth-root.tsx | 1 + web/helpers/authentication.helper.tsx | 4 +++- web/helpers/common.helper.ts | 2 ++ web/lib/wrappers/authentication-wrapper.tsx | 6 +++--- web/next.config.js | 10 ++++++++++ web/pages/accounts/forgot-password.tsx | 2 +- web/pages/index.tsx | 4 ++-- web/pages/sign-up.tsx | 4 ++-- 10 files changed, 31 insertions(+), 15 deletions(-) diff --git a/turbo.json b/turbo.json index e980747df..c08733c85 100644 --- a/turbo.json +++ b/turbo.json @@ -20,6 +20,7 @@ "NEXT_PUBLIC_POSTHOG_KEY", "NEXT_PUBLIC_POSTHOG_HOST", "NEXT_PUBLIC_POSTHOG_DEBUG", + "NEXT_PUBLIC_SUPPORT_EMAIL", "SENTRY_AUTH_TOKEN" ], "pipeline": { diff --git a/web/components/account/auth-forms/auth-header.tsx b/web/components/account/auth-forms/auth-header.tsx index ef2f90242..c9b01d5e9 100644 --- a/web/components/account/auth-forms/auth-header.tsx +++ b/web/components/account/auth-forms/auth-header.tsx @@ -21,29 +21,29 @@ type TAuthHeader = { const Titles = { [EAuthModes.SIGN_IN]: { [EAuthSteps.EMAIL]: { - header: "Log in or sign up", + header: "Log in or Sign up", subHeader: "", }, [EAuthSteps.PASSWORD]: { - header: "Log in or sign up", + header: "Log in or Sign up", subHeader: "Log in using your password.", }, [EAuthSteps.UNIQUE_CODE]: { - header: "Log in or sign up", + header: "Log in or Sign up", subHeader: "Log in using your unique code.", }, }, [EAuthModes.SIGN_UP]: { [EAuthSteps.EMAIL]: { - header: "Sign up or log in", + header: "Sign up or Log in", subHeader: "", }, [EAuthSteps.PASSWORD]: { - header: "Sign up or log in", + header: "Sign up or Log in", subHeader: "Sign up using your password", }, [EAuthSteps.UNIQUE_CODE]: { - header: "Sign up or log in", + header: "Sign up or Log in", subHeader: "Sign up using your unique code", }, }, diff --git a/web/components/account/auth-forms/auth-root.tsx b/web/components/account/auth-forms/auth-root.tsx index 425780f66..66f32f9fd 100644 --- a/web/components/account/auth-forms/auth-root.tsx +++ b/web/components/account/auth-forms/auth-root.tsx @@ -97,6 +97,7 @@ export const AuthRoot: FC = observer((props) => { // submit handler- email verification const handleEmailVerification = async (data: IEmailCheckData) => { setEmail(data.email); + setErrorInfo(undefined); await authService .emailCheck(data) .then(async (response) => { diff --git a/web/helpers/authentication.helper.tsx b/web/helpers/authentication.helper.tsx index cf5907451..f2438299e 100644 --- a/web/helpers/authentication.helper.tsx +++ b/web/helpers/authentication.helper.tsx @@ -1,5 +1,7 @@ import { ReactNode } from "react"; import Link from "next/link"; +// helpers +import { SUPPORT_EMAIL } from "./common.helper"; export enum EPageTypes { PUBLIC = "PUBLIC", @@ -126,7 +128,7 @@ const errorCodeMessages: { }, [EAuthenticationErrorCodes.USER_ACCOUNT_DEACTIVATED]: { title: `User account deactivated`, - message: () => `User account deactivated. Please contact your administrator.`, + message: () => `User account deactivated. Please contact ${!!SUPPORT_EMAIL ? SUPPORT_EMAIL : "administrator"}.`, }, [EAuthenticationErrorCodes.INVALID_PASSWORD]: { title: `Invalid password`, diff --git a/web/helpers/common.helper.ts b/web/helpers/common.helper.ts index 74ac8cb49..8f7cb48a9 100644 --- a/web/helpers/common.helper.ts +++ b/web/helpers/common.helper.ts @@ -9,6 +9,8 @@ export const ADMIN_BASE_PATH = process.env.NEXT_PUBLIC_ADMIN_BASE_PATH || ""; export const SPACE_BASE_URL = process.env.NEXT_PUBLIC_SPACE_BASE_URL || ""; export const SPACE_BASE_PATH = process.env.NEXT_PUBLIC_SPACE_BASE_PATH || ""; +export const SUPPORT_EMAIL = process.env.NEXT_PUBLIC_SUPPORT_EMAIL || ""; + export const GOD_MODE_URL = encodeURI(`${ADMIN_BASE_URL}${ADMIN_BASE_PATH}/`); export const debounce = (func: any, wait: number, immediate: boolean = false) => { diff --git a/web/lib/wrappers/authentication-wrapper.tsx b/web/lib/wrappers/authentication-wrapper.tsx index a598d8a0e..774dabdba 100644 --- a/web/lib/wrappers/authentication-wrapper.tsx +++ b/web/lib/wrappers/authentication-wrapper.tsx @@ -93,7 +93,7 @@ export const AuthenticationWrapper: FC = observer((props if (pageType === EPageTypes.ONBOARDING) { if (!currentUser?.id) { - router.push("/sign-in"); + router.push("/"); return <>; } else { if (currentUser && currentUserProfile?.id && isUserOnboard) { @@ -106,7 +106,7 @@ export const AuthenticationWrapper: FC = observer((props if (pageType === EPageTypes.SET_PASSWORD) { if (!currentUser?.id) { - router.push("/sign-in"); + router.push("/"); return <>; } else { if (currentUser && !currentUser?.is_password_autoset && currentUserProfile?.id && isUserOnboard) { @@ -125,7 +125,7 @@ export const AuthenticationWrapper: FC = observer((props return <>; } } else { - router.push("/sign-in"); + router.push("/"); return <>; } } diff --git a/web/next.config.js b/web/next.config.js index 89918b1d1..1cb49a40d 100644 --- a/web/next.config.js +++ b/web/next.config.js @@ -41,6 +41,16 @@ const nextConfig = { source: "/sign-in", destination: "/", permanent: true + }, + { + source: "/register", + destination: "/sign-up", + permanent: true + }, + { + source: "/login", + destination: "/", + permanent: true } ] }, diff --git a/web/pages/accounts/forgot-password.tsx b/web/pages/accounts/forgot-password.tsx index 00cf0982e..f5c9df44f 100644 --- a/web/pages/accounts/forgot-password.tsx +++ b/web/pages/accounts/forgot-password.tsx @@ -176,7 +176,7 @@ const ForgotPasswordPage: NextPageWithLayout = () => { > {resendTimerCode > 0 ? `Resend in ${resendTimerCode} seconds` : "Send reset link"} - + Back to sign in diff --git a/web/pages/index.tsx b/web/pages/index.tsx index c6cd6340f..3336185c7 100644 --- a/web/pages/index.tsx +++ b/web/pages/index.tsx @@ -31,7 +31,7 @@ const HomePage: NextPageWithLayout = observer(() => { return (
- +
{
-
+
diff --git a/web/pages/sign-up.tsx b/web/pages/sign-up.tsx index dcfb2e165..a3013e920 100644 --- a/web/pages/sign-up.tsx +++ b/web/pages/sign-up.tsx @@ -33,7 +33,7 @@ const SignInPage: NextPageWithLayout = observer(() => { return (
- +
{
-
+