fix: auth pages errors handler

packages/webapp/src/containers/Authentication/Login.tsx

@@ -32,13 +32,11 @@ export default function Login() {
       email: values.crediential,
       password: values.password,
     }).catch(({ response }) => {
-      const {
-        data: { errors },
-      } = response;
-      const toastBuilders = transformLoginErrorsToToasts(errors);
+      const { data: error } = response;
+      const toastMessages = transformLoginErrorsToToasts(error);
 
-      toastBuilders.forEach((builder) => {
-        Toaster.show(builder);
+      toastMessages.forEach((toastMessage) => {
+        Toaster.show(toastMessage);
       });
       setSubmitting(false);
     });

packages/webapp/src/containers/Authentication/SendResetPassword.tsx

@@ -35,7 +35,7 @@ export default function SendResetPassword() {
   // Handle form submitting.
   const handleSubmit = (values, { setSubmitting }) => {
     sendResetPasswordMutate({ email: values.crediential })
-      .then((response) => {
+      .then(() => {
         AppToaster.show({
           message: intl.get('check_your_email_for_a_link_to_reset'),
           intent: Intent.SUCCESS,
@@ -43,20 +43,9 @@ export default function SendResetPassword() {
         history.push('/auth/login');
         setSubmitting(false);
       })
-      .catch(
-        ({
-          response: {
-            data: { errors },
-          },
-        }) => {
-          const toastBuilders = transformSendResetPassErrorsToToasts(errors);
-
-          toastBuilders.forEach((builder) => {
-            AppToaster.show(builder);
-          });
-          setSubmitting(false);
-        },
-      );
+      .catch(() => {
+        setSubmitting(false);
+      });
   };
 
   return (
@@ -82,11 +71,17 @@ function SendResetPasswordFooterLinks() {
     <AuthFooterLinks>
       {!signupDisabled && (
         <AuthFooterLink>
-          <T id={'dont_have_an_account'} /> <Link to={'/auth/register'}><T id={'sign_up'} /></Link>
+          <T id={'dont_have_an_account'} />{' '}
+          <Link to={'/auth/register'}>
+            <T id={'sign_up'} />
+          </Link>
         </AuthFooterLink>
       )}
       <AuthFooterLink>
-        <T id={'return_to'} /> <Link to={'/auth/login'}><T id={'sign_in'} /></Link>
+        <T id={'return_to'} />{' '}
+        <Link to={'/auth/login'}>
+          <T id={'sign_in'} />
+        </Link>
       </AuthFooterLink>
     </AuthFooterLinks>
   );

packages/webapp/src/containers/Authentication/_components.tsx

@@ -13,12 +13,17 @@ export function AuthenticationLoadingOverlay() {
 }
 
 const AuthOverlayRoot = styled.div`
+  --x-color-background: rgba(252, 253, 255, 0.5);
+
+  .bp4-dark & {
+    --x-color-background: rgba(37, 42, 49, 0.60);
+  }
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
-  background: rgba(252, 253, 255, 0.5);
+  background: var(--x-color-background);
   display: flex;
   justify-content: center;
 `;

packages/webapp/src/containers/Authentication/utils.tsx

@@ -45,10 +45,10 @@ export const InviteAcceptSchema = Yup.object().shape({
   password: Yup.string().min(4).required().label(intl.get('password')),
 });
 
-export const transformSendResetPassErrorsToToasts = (errors) => {
+export const transformSendResetPassErrorsToToasts = (error) => {
   const toastBuilders = [];
 
-  if (errors.find((e) => e.type === 'EMAIL.NOT.REGISTERED')) {
+  if (error.code === ERRORS.EMAIL_NOT_REGISTERED) {
     toastBuilders.push({
       message: intl.get('we_couldn_t_find_your_account_with_that_email'),
       intent: Intent.DANGER,
@@ -57,38 +57,26 @@ export const transformSendResetPassErrorsToToasts = (errors) => {
   return toastBuilders;
 };
 
-export const transformLoginErrorsToToasts = (errors) => {
+export const transformLoginErrorsToToasts = (error) => {
   const toastBuilders = [];
 
-  if (errors.find((e) => e.type === LOGIN_ERRORS.INVALID_DETAILS)) {
+  if (error.code === LOGIN_ERRORS.INVALID_DETAILS) {
     toastBuilders.push({
       message: intl.get('email_and_password_entered_did_not_match'),
       intent: Intent.DANGER,
     });
-  }
-  if (errors.find((e) => e.type === LOGIN_ERRORS.USER_INACTIVE)) {
+  } else if (error.code === LOGIN_ERRORS.USER_INACTIVE) {
     toastBuilders.push({
       message: intl.get('the_user_has_been_suspended_from_admin'),
       intent: Intent.DANGER,
     });
   }
-  if (errors.find((e) => e.type === LOGIN_ERRORS.LOGIN_TO_MANY_ATTEMPTS)) {
-    toastBuilders.push({
-      message: intl.get('your_account_has_been_locked'),
-      intent: Intent.DANGER,
-    });
-  }
   return toastBuilders;
 };
 
 export const transformRegisterErrorsToForm = (errors) => {
   const formErrors = {};
 
-  if (errors.some((e) => e.type === REGISTER_ERRORS.PHONE_NUMBER_EXISTS)) {
-    formErrors.phone_number = intl.get(
-      'the_phone_number_already_used_in_another_account',
-    );
-  }
   if (errors.some((e) => e.type === REGISTER_ERRORS.EMAIL_EXISTS)) {
     formErrors.email = intl.get('the_email_already_used_in_another_account');
   }

packages/webapp/src/containers/ElementCustomize/components/CompanyLogoUpload.module.scss

@@ -2,7 +2,7 @@
   --x-border-color: #E1E1E1;
   --x-color-placeholder-text: #738091;
   
-  .bp4-dark & {    
+  :global(.bp4-dark) & {    
     --x-border-color: rgba(225, 225, 225, 0.15);
     --x-color-placeholder-text: rgba(225, 225, 225, 0.65);
   }

packages/webapp/src/containers/ElementCustomize/components/CompanyLogoUpload.tsx

@@ -53,7 +53,6 @@ export function CompanyLogoUpload({
   const [initialLocalPreview, setInitialLocalPreview] = useState<string | null>(
     initialPreview || null,
   );
-
   const openRef = useRef<() => void>(null);
 
   const handleRemove = () => {