Merge branch 'develop-postgres' into 2790-issue

PalisadoesFoundation · Dec 26, 2024 · dc3bcf6 · dc3bcf6
2 parents b2bafe5 + 5b3e840
commit dc3bcf6
Show file tree

Hide file tree

Showing 6 changed files with 90 additions and 52 deletions.
diff --git a/...ents/LeftDrawerOrg/LeftDrawerOrg.test.tsx → ...ents/LeftDrawerOrg/LeftDrawerOrg.spec.tsx b/...ents/LeftDrawerOrg/LeftDrawerOrg.test.tsx → ...ents/LeftDrawerOrg/LeftDrawerOrg.spec.tsx
@@ -1,7 +1,7 @@
+import '@testing-library/jest-dom';
 import React, { act } from 'react';
 import { fireEvent, render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import 'jest-localstorage-mock';
 import { I18nextProvider } from 'react-i18next';
 import { BrowserRouter, MemoryRouter } from 'react-router-dom';
 
@@ -15,6 +15,7 @@ import { ORGANIZATIONS_LIST } from 'GraphQl/Queries/Queries';
 import { StaticMockLink } from 'utils/StaticMockLink';
 import { REVOKE_REFRESH_TOKEN } from 'GraphQl/Mutations/mutations';
 import useLocalStorage from 'utils/useLocalstorage';
+import { vi, describe, test, expect } from 'vitest';
 
 const { setItem } = useLocalStorage();
 
@@ -65,7 +66,7 @@ const props: InterfaceLeftDrawerProps = {
     },
   ],
   hideDrawer: false,
-  setHideDrawer: jest.fn(),
+  setHideDrawer: vi.fn(),
 };
 
 const MOCKS = [
@@ -244,11 +245,11 @@ const defaultScreens = [
   'All Organizations',
 ];
 
-jest.mock('react-toastify', () => ({
+vi.mock('react-toastify', () => ({
   toast: {
-    success: jest.fn(),
-    warn: jest.fn(),
-    error: jest.fn(),
+    success: vi.fn(),
+    warn: vi.fn(),
+    error: vi.fn(),
   },
 }));
 
@@ -275,7 +276,7 @@ beforeEach(() => {
 });
 
 afterEach(() => {
-  jest.clearAllMocks();
+  vi.clearAllMocks();
   localStorage.clear();
 });
 

diff --git a/...entVolunteers/VolunteerContainer.test.tsx → ...entVolunteers/VolunteerContainer.spec.tsx b/...entVolunteers/VolunteerContainer.test.tsx → ...entVolunteers/VolunteerContainer.spec.tsx
@@ -12,9 +12,28 @@ import userEvent from '@testing-library/user-event';
 import { MOCKS } from './Volunteers/Volunteers.mocks';
 import { StaticMockLink } from 'utils/StaticMockLink';
 import { LocalizationProvider } from '@mui/x-date-pickers';
+import { describe, it, beforeEach, expect, vi } from 'vitest';
+
+/**
+ * Unit tests for the `VolunteerContainer` component.
+ *
+ * The tests ensure the `VolunteerContainer` component renders correctly with various routes and URL parameters.
+ * Mocked dependencies are used to isolate the component and verify its behavior.
+ * All tests are covered.
+ */
 
 const link1 = new StaticMockLink(MOCKS);
 
+const mockedUseParams = vi.fn();
+
+vi.mock('react-router-dom', async () => {
+  const actual = await vi.importActual('react-router-dom');
+  return {
+    ...actual,
+    useParams: () => mockedUseParams(),
+  };
+});
+
 const renderVolunteerContainer = (): RenderResult => {
   return render(
     <MockedProvider addTypename={false} link={link1}>
@@ -41,18 +60,21 @@ const renderVolunteerContainer = (): RenderResult => {
 };
 
 describe('Testing Volunteer Container', () => {
-  beforeAll(() => {
-    jest.mock('react-router-dom', () => ({
-      ...jest.requireActual('react-router-dom'),
-      useParams: () => ({ orgId: 'orgId', eventId: 'eventId' }),
-    }));
+  beforeEach(() => {
+    vi.clearAllMocks();
   });
 
-  afterAll(() => {
-    jest.clearAllMocks();
+  it('should redirect to fallback URL if URL params are undefined', async () => {
+    mockedUseParams.mockReturnValue({});
+
+    renderVolunteerContainer();
+
+    await waitFor(() => {
+      expect(screen.getByTestId('paramsError')).toBeInTheDocument();
+    });
   });
 
-  it('should redirect to fallback URL if URL params are undefined', async () => {
+  it('Testing Volunteer Container Screen -> Toggle screens', async () => {
     render(
       <MockedProvider addTypename={false} link={link1}>
         <MemoryRouter initialEntries={['/event/']}>
@@ -71,24 +93,26 @@ describe('Testing Volunteer Container', () => {
       </MockedProvider>,
     );
 
-    await waitFor(() => {
-      expect(screen.getByTestId('paramsError')).toBeInTheDocument();
-    });
-  });
+    mockedUseParams.mockReturnValue({ orgId: 'orgId', eventId: 'eventId' });
 
-  test('Testing Volunteer Container Screen -> Toggle screens', async () => {
     renderVolunteerContainer();
 
     const groupRadio = await screen.findByTestId('groupsRadio');
-    expect(groupRadio).toBeInTheDocument();
-    userEvent.click(groupRadio);
-
     const requestsRadio = await screen.findByTestId('requestsRadio');
-    expect(requestsRadio).toBeInTheDocument();
-    userEvent.click(requestsRadio);
-
     const individualRadio = await screen.findByTestId('individualRadio');
+
+    expect(groupRadio).toBeInTheDocument();
+    expect(requestsRadio).toBeInTheDocument();
     expect(individualRadio).toBeInTheDocument();
-    userEvent.click(individualRadio);
+
+    await waitFor(async () => {
+      await userEvent.click(groupRadio);
+      await userEvent.click(requestsRadio);
+      await userEvent.click(individualRadio);
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('paramsError')).toBeInTheDocument();
+    });
   });
 });
diff --git a/src/screens/EventVolunteers/VolunteerContainer.tsx b/src/screens/EventVolunteers/VolunteerContainer.tsx
@@ -34,7 +34,7 @@ function volunteerContainer(): JSX.Element {
   return (
     <div>
       <div className="mt-2 mb-4 d-flex justify-content-between">
-        <span className={styles.titlemodal}>
+        <span className={styles.titlemodal} data-testid="dataTypeTitle">
           {t(
             `${dataType === 'group' ? 'volunteerGroups' : dataType === 'individual' ? 'volunteers' : 'requests'}`,
           )}

diff --git a/src/screens/OrgList/OrgList.test.tsx b/src/screens/OrgList/OrgList.test.tsx
@@ -44,11 +44,11 @@ async function wait(ms = 100): Promise<void> {
 afterEach(() => {
   localStorage.clear();
   cleanup();
+  jest.clearAllMocks();
 });
 
 describe('Organisations Page testing as SuperAdmin', () => {
   setItem('id', '123');
-
   const link = new StaticMockLink(MOCKS, true);
   const link2 = new StaticMockLink(MOCKS_EMPTY, true);
   const link3 = new StaticMockLink(MOCKS_WITH_ERROR, true);
@@ -475,7 +475,6 @@ describe('Organisations Page testing as SuperAdmin', () => {
 
 describe('Organisations Page testing as Admin', () => {
   const link = new StaticMockLink(MOCKS_ADMIN, true);
-
   test('Create organization modal should not be present in the page for Admin', async () => {
     setItem('id', '123');
     setItem('SuperAdmin', false);
@@ -501,35 +500,47 @@ describe('Organisations Page testing as Admin', () => {
     setItem('SuperAdmin', false);
     setItem('AdminFor', [{ name: 'adi', _id: 'a0', image: '' }]);
 
-    await act(async () => {
-      render(
-        <MockedProvider addTypename={false} link={link}>
-          <BrowserRouter>
-            <Provider store={store}>
-              <I18nextProvider i18n={i18nForTest}>
-                <OrgList />
-              </I18nextProvider>
-            </Provider>
-          </BrowserRouter>
-        </MockedProvider>,
-      );
-
-      await wait();
-    });
-    const sortDropdown = await waitFor(() => screen.getByTestId('sort'));
+    render(
+      <MockedProvider addTypename={false} link={link}>
+        <BrowserRouter>
+          <Provider store={store}>
+            <I18nextProvider i18n={i18nForTest}>
+              <OrgList />
+            </I18nextProvider>
+          </Provider>
+        </BrowserRouter>
+      </MockedProvider>,
+    );
+
+    await wait();
+
+    const sortDropdown = screen.getByTestId('sort');
     expect(sortDropdown).toBeInTheDocument();
 
     const sortToggle = screen.getByTestId('sortOrgs');
 
-    fireEvent.click(sortToggle);
-    const latestOption = await waitFor(() => screen.getByTestId('latest'));
+    await act(async () => {
+      fireEvent.click(sortToggle);
+    });
+
+    const latestOption = screen.getByTestId('latest');
 
-    fireEvent.click(latestOption);
+    await act(async () => {
+      fireEvent.click(latestOption);
+    });
 
     expect(sortDropdown).toBeInTheDocument();
-    fireEvent.click(sortToggle);
+
+    await act(async () => {
+      fireEvent.click(sortToggle);
+    });
+
     const oldestOption = await waitFor(() => screen.getByTestId('oldest'));
-    fireEvent.click(oldestOption);
+
+    await act(async () => {
+      fireEvent.click(oldestOption);
+    });
+
     expect(sortDropdown).toBeInTheDocument();
   });
 });
diff --git a/src/screens/OrgList/OrgList.tsx b/src/screens/OrgList/OrgList.tsx
@@ -233,6 +233,8 @@ function orgList(): JSX.Element {
   };
 
   if (errorList || errorUser) {
+    errorHandler(t, errorList || errorUser);
+    localStorage.clear();
     window.location.assign('/');
   }
 

diff --git a/src/screens/OrgList/OrganizationModal.tsx b/src/screens/OrgList/OrganizationModal.tsx
@@ -301,7 +301,7 @@ const OrganizationModal: React.FC<InterfaceOrganizationModalProps> = ({
               <hr />
               <span className={styles.orText}>{tCommon('OR')}</span>
             </div>
-            {(adminFor.length > 0 || superAdmin) && (
+            {((adminFor && adminFor.length > 0) || superAdmin) && (
               <div className={styles.sampleOrgSection}>
                 <Button
                   className={styles.sampleOrgCreationBtn}