mirror of
				https://github.com/open-metadata/OpenMetadata.git
				synced 2025-11-04 04:29:13 +00:00 
			
		
		
		
	fix(ui): show error and success message mutually exclusive (#19194)
(cherry picked from commit bfa943bbba3a7d1949a95618ad14d6d3697d7ffd)
This commit is contained in:
		
							parent
							
								
									1721f4c38f
								
							
						
					
					
						commit
						ccfd3c9d06
					
				@ -169,18 +169,7 @@ const BasicAuthProvider = ({
 | 
			
		||||
  };
 | 
			
		||||
 | 
			
		||||
  const handleForgotPassword = async (email: string) => {
 | 
			
		||||
    try {
 | 
			
		||||
      await generatePasswordResetLink(email);
 | 
			
		||||
    } catch (err) {
 | 
			
		||||
      if (
 | 
			
		||||
        (err as AxiosError).response?.status ===
 | 
			
		||||
        HTTP_STATUS_CODE.FAILED_DEPENDENCY
 | 
			
		||||
      ) {
 | 
			
		||||
        showErrorToast(t('server.forgot-password-email-error'));
 | 
			
		||||
      } else {
 | 
			
		||||
        showErrorToast(t('server.email-not-found'));
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    await generatePasswordResetLink(email);
 | 
			
		||||
  };
 | 
			
		||||
 | 
			
		||||
  const handleResetPassword = async (payload: PasswordResetRequest) => {
 | 
			
		||||
 | 
			
		||||
@ -13,13 +13,16 @@
 | 
			
		||||
 | 
			
		||||
import Icon from '@ant-design/icons/lib/components/Icon';
 | 
			
		||||
import { Button, Card, Col, Divider, Form, Input, Row, Typography } from 'antd';
 | 
			
		||||
import { AxiosError } from 'axios';
 | 
			
		||||
import React, { useCallback, useState } from 'react';
 | 
			
		||||
import { useTranslation } from 'react-i18next';
 | 
			
		||||
import { useHistory } from 'react-router-dom';
 | 
			
		||||
import { ReactComponent as IconSuccessBadge } from '../../assets/svg/success-badge.svg';
 | 
			
		||||
import { useBasicAuth } from '../../components/Auth/AuthProviders/BasicAuthProvider';
 | 
			
		||||
import BrandImage from '../../components/common/BrandImage/BrandImage';
 | 
			
		||||
import { HTTP_STATUS_CODE } from '../../constants/Auth.constants';
 | 
			
		||||
import { ROUTES } from '../../constants/constants';
 | 
			
		||||
import { showErrorToast } from '../../utils/ToastUtils';
 | 
			
		||||
import './forgot-password.styles.less';
 | 
			
		||||
 | 
			
		||||
const ForgotPassword = () => {
 | 
			
		||||
@ -34,9 +37,16 @@ const ForgotPassword = () => {
 | 
			
		||||
    async (data: { email: string }) => {
 | 
			
		||||
      try {
 | 
			
		||||
        setLoading(true);
 | 
			
		||||
        handleForgotPassword && (await handleForgotPassword(data.email));
 | 
			
		||||
        await handleForgotPassword?.(data.email);
 | 
			
		||||
        setShowResetLinkSentAlert(true);
 | 
			
		||||
      } catch (error) {
 | 
			
		||||
        showErrorToast(
 | 
			
		||||
          (error as AxiosError).response?.status ===
 | 
			
		||||
            HTTP_STATUS_CODE.FAILED_DEPENDENCY
 | 
			
		||||
            ? t('server.forgot-password-email-error')
 | 
			
		||||
            : t('server.email-not-found')
 | 
			
		||||
        );
 | 
			
		||||
 | 
			
		||||
        setShowResetLinkSentAlert(false);
 | 
			
		||||
      } finally {
 | 
			
		||||
        setLoading(false);
 | 
			
		||||
 | 
			
		||||
@ -13,19 +13,31 @@
 | 
			
		||||
import { act, fireEvent, render } from '@testing-library/react';
 | 
			
		||||
import React from 'react';
 | 
			
		||||
import { useBasicAuth } from '../../components/Auth/AuthProviders/BasicAuthProvider';
 | 
			
		||||
import { showErrorToast } from '../../utils/ToastUtils';
 | 
			
		||||
import ForgotPassword from './ForgotPassword.component';
 | 
			
		||||
 | 
			
		||||
const mockPush = jest.fn();
 | 
			
		||||
const handleForgotPassword = jest.fn();
 | 
			
		||||
const mockHandleForgotPassword = jest.fn();
 | 
			
		||||
const mockHandleError = jest.fn().mockImplementation(() => {
 | 
			
		||||
  return Promise.reject({
 | 
			
		||||
    response: {
 | 
			
		||||
      data: { message: 'Error!' },
 | 
			
		||||
    },
 | 
			
		||||
  });
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
jest.mock('../../components/Auth/AuthProviders/BasicAuthProvider', () => {
 | 
			
		||||
  return {
 | 
			
		||||
    useBasicAuth: jest.fn().mockImplementation(() => ({
 | 
			
		||||
      handleResetPassword: handleForgotPassword,
 | 
			
		||||
      handleForgotPassword: mockHandleForgotPassword,
 | 
			
		||||
    })),
 | 
			
		||||
  };
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
jest.mock('../../utils/ToastUtils', () => ({
 | 
			
		||||
  showErrorToast: jest.fn(),
 | 
			
		||||
}));
 | 
			
		||||
 | 
			
		||||
jest.mock('react-router-dom', () => ({
 | 
			
		||||
  useHistory: jest.fn().mockImplementation(() => ({
 | 
			
		||||
    push: mockPush,
 | 
			
		||||
@ -43,7 +55,9 @@ describe('ForgotPassword', () => {
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
  it('calls handleForgotPassword with the correct email', async () => {
 | 
			
		||||
    (useBasicAuth as jest.Mock).mockReturnValue({ handleForgotPassword });
 | 
			
		||||
    (useBasicAuth as jest.Mock).mockReturnValue({
 | 
			
		||||
      handleForgotPassword: mockHandleForgotPassword,
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    const { getByLabelText, getByText } = render(<ForgotPassword />);
 | 
			
		||||
    const emailInput = getByLabelText('label.email');
 | 
			
		||||
@ -55,7 +69,7 @@ describe('ForgotPassword', () => {
 | 
			
		||||
      fireEvent.click(submitButton);
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    expect(handleForgotPassword).toHaveBeenCalledWith('test@example.com');
 | 
			
		||||
    expect(mockHandleForgotPassword).toHaveBeenCalledWith('test@example.com');
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
  it('shows an error when email is not provided', async () => {
 | 
			
		||||
@ -89,7 +103,7 @@ describe('ForgotPassword', () => {
 | 
			
		||||
      fireEvent.click(submitButton);
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    expect(handleForgotPassword).toHaveBeenCalledWith('test@example.com');
 | 
			
		||||
    expect(mockHandleForgotPassword).toHaveBeenCalledWith('test@example.com');
 | 
			
		||||
    expect(getByTestId('success-screen-container')).toBeInTheDocument();
 | 
			
		||||
    expect(getByTestId('success-icon')).toBeInTheDocument();
 | 
			
		||||
    expect(getByTestId('success-line')).toBeInTheDocument();
 | 
			
		||||
@ -104,4 +118,26 @@ describe('ForgotPassword', () => {
 | 
			
		||||
 | 
			
		||||
    expect(mockPush).toHaveBeenCalled();
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
  it('should call show error toast', async () => {
 | 
			
		||||
    (useBasicAuth as jest.Mock).mockReturnValueOnce({
 | 
			
		||||
      handleForgotPassword: mockHandleError,
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    const { getByLabelText, getByText, queryByTestId } = render(
 | 
			
		||||
      <ForgotPassword />
 | 
			
		||||
    );
 | 
			
		||||
    const emailInput = getByLabelText('label.email');
 | 
			
		||||
    const submitButton = getByText('label.submit');
 | 
			
		||||
    await act(async () => {
 | 
			
		||||
      fireEvent.change(emailInput, { target: { value: 'test@example.com' } });
 | 
			
		||||
    });
 | 
			
		||||
    await act(async () => {
 | 
			
		||||
      fireEvent.click(submitButton);
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    expect(showErrorToast).toHaveBeenCalledWith('server.email-not-found');
 | 
			
		||||
    expect(mockHandleError).toHaveBeenCalledWith('test@example.com');
 | 
			
		||||
    expect(queryByTestId('success-screen-container')).not.toBeInTheDocument();
 | 
			
		||||
  });
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user