From 7b5775bfcf17dd46f13e03cf9fa6106aefb44323 Mon Sep 17 00:00:00 2001 From: Sandeep Kumar Bhagat Date: Sat, 11 Nov 2023 21:24:23 +0530 Subject: [PATCH 1/6] Fix event creation issue with white spaces. (#1025) * fix event creation with white spaces * Add test for empty input values --- .../OrganizationEvents.test.tsx | 94 +++++++++++++++++++ .../OrganizationEvents/OrganizationEvents.tsx | 81 +++++++++------- 2 files changed, 142 insertions(+), 33 deletions(-) diff --git a/src/screens/OrganizationEvents/OrganizationEvents.test.tsx b/src/screens/OrganizationEvents/OrganizationEvents.test.tsx index 4c08db90d5..9f79991274 100644 --- a/src/screens/OrganizationEvents/OrganizationEvents.test.tsx +++ b/src/screens/OrganizationEvents/OrganizationEvents.test.tsx @@ -13,6 +13,7 @@ import { CREATE_EVENT_MUTATION } from 'GraphQl/Mutations/mutations'; import i18nForTest from 'utils/i18nForTest'; import userEvent from '@testing-library/user-event'; import { StaticMockLink } from 'utils/StaticMockLink'; +import { toast } from 'react-toastify'; const MOCKS = [ { @@ -112,6 +113,14 @@ async function wait(ms = 100): Promise { }); } +jest.mock('react-toastify', () => ({ + toast: { + success: jest.fn(), + warning: jest.fn(), + error: jest.fn(), + }, +})); + describe('Organisation Events Page', () => { const formData = { title: 'Dummy Org', @@ -297,6 +306,91 @@ describe('Organisation Events Page', () => { userEvent.click(screen.getByTestId('createEventBtn')); }, 15000); + test('Testing Create event with invalid inputs', async () => { + const formData = { + title: ' ', + description: ' ', + location: ' ', + startDate: '03/28/2022', + endDate: '04/15/2023', + startTime: '02:00', + endTime: '06:00', + allDay: false, + recurring: false, + isPublic: true, + isRegisterable: true, + }; + render( + + + + + + + + + + ); + + await wait(); + + userEvent.click(screen.getByTestId('createEventModalBtn')); + + userEvent.type(screen.getByPlaceholderText(/Enter Title/i), formData.title); + userEvent.type( + screen.getByPlaceholderText(/Enter Description/i), + formData.description + ); + userEvent.type( + screen.getByPlaceholderText(/Enter Location/i), + formData.location + ); + userEvent.type( + screen.getByPlaceholderText(/Enter Location/i), + formData.location + ); + + const endDateDatePicker = screen.getByPlaceholderText(/End Date/i); + const startDateDatePicker = screen.getByPlaceholderText(/Start Date/i); + + fireEvent.click(endDateDatePicker); + fireEvent.click(startDateDatePicker); + + await act(async () => { + fireEvent.change(endDateDatePicker, { + target: { + value: formData.endDate, + }, + }); + fireEvent.change(startDateDatePicker, { + target: { + value: formData.startDate, + }, + }); + }); + userEvent.click(screen.getByTestId('alldayCheck')); + userEvent.click(screen.getByTestId('recurringCheck')); + userEvent.click(screen.getByTestId('ispublicCheck')); + userEvent.click(screen.getByTestId('registrableCheck')); + + await wait(); + + expect(screen.getByPlaceholderText(/Enter Title/i)).toHaveValue(' '); + expect(screen.getByPlaceholderText(/Enter Description/i)).toHaveValue(' '); + + expect(endDateDatePicker).toHaveValue(formData.endDate); + expect(startDateDatePicker).toHaveValue(formData.startDate); + expect(screen.getByTestId('alldayCheck')).not.toBeChecked(); + expect(screen.getByTestId('recurringCheck')).toBeChecked(); + expect(screen.getByTestId('ispublicCheck')).not.toBeChecked(); + expect(screen.getByTestId('registrableCheck')).toBeChecked(); + + userEvent.click(screen.getByTestId('createEventBtn')); + expect(toast.warning).toBeCalledWith('Title can not be blank!'); + expect(toast.warning).toBeCalledWith('Description can not be blank!'); + expect(toast.warning).toBeCalledWith('Location can not be blank!'); + }, 15000); + test('Testing if the event is not for all day', async () => { render( diff --git a/src/screens/OrganizationEvents/OrganizationEvents.tsx b/src/screens/OrganizationEvents/OrganizationEvents.tsx index fe25bcdb6d..36852389eb 100644 --- a/src/screens/OrganizationEvents/OrganizationEvents.tsx +++ b/src/screens/OrganizationEvents/OrganizationEvents.tsx @@ -83,41 +83,56 @@ function organizationEvents(): JSX.Element { e: ChangeEvent ): Promise => { e.preventDefault(); - try { - const { data: createEventData } = await create({ - variables: { - title: formState.title, - description: formState.eventdescrip, - isPublic: publicchecked, - recurring: recurringchecked, - isRegisterable: registrablechecked, - organizationId: currentUrl, - startDate: dayjs(startDate).format('YYYY-MM-DD'), - endDate: dayjs(endDate).format('YYYY-MM-DD'), - allDay: alldaychecked, - location: formState.location, - startTime: !alldaychecked ? formState.startTime + 'Z' : null, - endTime: !alldaychecked ? formState.endTime + 'Z' : null, - }, - }); - - /* istanbul ignore next */ - if (createEventData) { - toast.success(t('eventCreated')); - refetch(); - hideInviteModal(); - setFormState({ - title: '', - eventdescrip: '', - date: '', - location: '', - startTime: '08:00:00', - endTime: '18:00:00', + if ( + formState.title.trim().length > 0 && + formState.eventdescrip.trim().length > 0 && + formState.location.trim().length > 0 + ) { + try { + const { data: createEventData } = await create({ + variables: { + title: formState.title, + description: formState.eventdescrip, + isPublic: publicchecked, + recurring: recurringchecked, + isRegisterable: registrablechecked, + organizationId: currentUrl, + startDate: dayjs(startDate).format('YYYY-MM-DD'), + endDate: dayjs(endDate).format('YYYY-MM-DD'), + allDay: alldaychecked, + location: formState.location, + startTime: !alldaychecked ? formState.startTime + 'Z' : null, + endTime: !alldaychecked ? formState.endTime + 'Z' : null, + }, }); + + /* istanbul ignore next */ + if (createEventData) { + toast.success(t('eventCreated')); + refetch(); + hideInviteModal(); + setFormState({ + title: '', + eventdescrip: '', + date: '', + location: '', + startTime: '08:00:00', + endTime: '18:00:00', + }); + } + } catch (error: any) { + /* istanbul ignore next */ + errorHandler(t, error); } - } catch (error: any) { - /* istanbul ignore next */ - errorHandler(t, error); + } + if (formState.title.trim().length === 0) { + toast.warning('Title can not be blank!'); + } + if (formState.eventdescrip.trim().length === 0) { + toast.warning('Description can not be blank!'); + } + if (formState.location.trim().length === 0) { + toast.warning('Location can not be blank!'); } }; From ddbaa0c70680a51979c39928ab164ced7fb8ee46 Mon Sep 17 00:00:00 2001 From: Aldrin <53973174+Dhoni77@users.noreply.github.com> Date: Sat, 11 Nov 2023 21:25:13 +0530 Subject: [PATCH 2/6] chore: fix unit test (#1052) --- src/components/UsersTableItem/UserTableItemMocks.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/UsersTableItem/UserTableItemMocks.ts b/src/components/UsersTableItem/UserTableItemMocks.ts index 6fd90d2be4..5f81c8cfe9 100644 --- a/src/components/UsersTableItem/UserTableItemMocks.ts +++ b/src/components/UsersTableItem/UserTableItemMocks.ts @@ -33,7 +33,7 @@ export const MOCKS = [ }, result: { data: { - removeUserFromOrganization: { + removeMember: { _id: '123', }, }, From ada33be7673f48e8d4b2dea0180513cf91b749e0 Mon Sep 17 00:00:00 2001 From: Sandeep Kumar Bhagat Date: Sat, 11 Nov 2023 21:40:44 +0530 Subject: [PATCH 3/6] Fix layout distortion due to untruncated title description of events. (#1049) * Fix layout distortion due to untruncated title description of events * Add test * add test for LeftDrawerEvent.tsx * fixed some tests * add test complete --- .../EventListCard/EventListCard.module.css | 17 +++++++- .../EventListCard/EventListCard.test.tsx | 40 +++++++++++++++++++ .../EventListCard/EventListCard.tsx | 30 ++++++++++++-- .../LeftDrawerEvent/LeftDrawerEvent.test.tsx | 34 ++++++++++++++++ .../LeftDrawerEvent/LeftDrawerEvent.tsx | 12 +++++- .../EventDashboard/EventDashboard.module.css | 2 +- src/screens/EventDashboard/EventDashboard.tsx | 4 +- 7 files changed, 130 insertions(+), 9 deletions(-) diff --git a/src/components/EventListCard/EventListCard.module.css b/src/components/EventListCard/EventListCard.module.css index c2a8e9eb0e..1648c9d16a 100644 --- a/src/components/EventListCard/EventListCard.module.css +++ b/src/components/EventListCard/EventListCard.module.css @@ -17,9 +17,24 @@ .cards a:hover { color: black; } +.cards { + position: relative; + overflow: hidden; + transition: all 0.3s; +} .dispflex { display: flex; - justify-content: space-between; + height: 50px; + transition: transform 0.3s ease; + cursor: pointer; +} +.cards:hover { + transform: scale(2.5); + z-index: 5; +} +.cards:hover h2 { + font-size: 0.4vmax; + margin-bottom: 0; } .iconContainer { display: flex; diff --git a/src/components/EventListCard/EventListCard.test.tsx b/src/components/EventListCard/EventListCard.test.tsx index 17edaf5050..820e563957 100644 --- a/src/components/EventListCard/EventListCard.test.tsx +++ b/src/components/EventListCard/EventListCard.test.tsx @@ -301,4 +301,44 @@ describe('Testing Event List Card', () => { fireEvent.click(deleteBtn); }); }); + + test('Should render truncated event details', async () => { + const longEventName = + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. A very long event name that exceeds 150 characters and needs to be truncated'; + const longDescription = + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. A very long description that exceeds 150 characters and needs to be truncated'; + const longEventNameLength = longEventName.length; + const longDescriptionLength = longDescription.length; + const truncatedEventName = longEventName.substring(0, 150) + '...'; + const truncatedDescriptionName = longDescription.substring(0, 150) + '...'; + render( + + + + + + ); + + await wait(); + + expect(longEventNameLength).toBeGreaterThan(100); + expect(longDescriptionLength).toBeGreaterThan(256); + expect(truncatedEventName).toContain('...'); + expect(truncatedDescriptionName).toContain('...'); + await wait(); + }); }); diff --git a/src/components/EventListCard/EventListCard.tsx b/src/components/EventListCard/EventListCard.tsx index f41c0e9c91..0ec3a62d6f 100644 --- a/src/components/EventListCard/EventListCard.tsx +++ b/src/components/EventListCard/EventListCard.tsx @@ -150,7 +150,17 @@ function eventListCard(props: InterfaceEventListCardProps): JSX.Element { >

- {props.eventName ? <>{props.eventName} : <>Dogs Care}{' '} + {props.eventName ? ( + <> + {props.eventName.length > 150 ? ( + <>{props.eventName.substring(0, 150)}... + ) : ( + <>{props.eventName} + )} + + ) : ( + <>Dogs Care + )}

@@ -172,7 +182,17 @@ function eventListCard(props: InterfaceEventListCardProps): JSX.Element {

{t('eventTitle')}:{' '} - {props.eventName ? <>{props.eventName} : <>Dogs Care}{' '} + {props.eventName ? ( + <> + {props.eventName.length > 100 ? ( + <>{props.eventName.substring(0, 100)}... + ) : ( + <>{props.eventName} + )} + + ) : ( + <>Dogs Care + )}

@@ -187,7 +207,11 @@ function eventListCard(props: InterfaceEventListCardProps): JSX.Element {

{t('description')}:{' '} - {props.eventDescription} + + {props.eventDescription && props.eventDescription.length > 256 + ? props.eventDescription.substring(0, 256) + '...' + : props.eventDescription} +

{t('on')}: {props.regDate} diff --git a/src/components/LeftDrawerEvent/LeftDrawerEvent.test.tsx b/src/components/LeftDrawerEvent/LeftDrawerEvent.test.tsx index f6187ce9c6..0fabcd2c55 100644 --- a/src/components/LeftDrawerEvent/LeftDrawerEvent.test.tsx +++ b/src/components/LeftDrawerEvent/LeftDrawerEvent.test.tsx @@ -25,6 +25,20 @@ const props: InterfaceLeftDrawerProps = { setHideDrawer: jest.fn(), setShowAddEventProjectModal: jest.fn(), }; +const props2: InterfaceLeftDrawerProps = { + event: { + _id: 'testEvent', + title: 'This is a very long event title that exceeds 20 characters', + description: + 'This is a very long event description that exceeds 30 characters. It contains more details about the event.', + organization: { + _id: 'Test Organization', + }, + }, + hideDrawer: false, + setHideDrawer: jest.fn(), + setShowAddEventProjectModal: jest.fn(), +}; const mocks = [ { @@ -184,4 +198,24 @@ describe('Testing Left Drawer component for the Event Dashboard', () => { expect(localStorage.clear).toHaveBeenCalled(); expect(global.window.location.pathname).toBe('/'); }); + test('Testing substring functionality in event title and description', async () => { + localStorage.setItem('UserType', 'SUPERADMIN'); + render( + + + + + + + + ); + const eventTitle = props2.event.title; + expect(eventTitle.length).toBeGreaterThan(20); + const eventDescription = props2.event.description; + expect(eventDescription.length).toBeGreaterThan(30); + const truncatedEventTitle = eventTitle.substring(0, 20) + '...'; + const truncatedEventDescription = eventDescription.substring(0, 30) + '...'; + expect(truncatedEventTitle).toContain('...'); + expect(truncatedEventDescription).toContain('...'); + }); }); diff --git a/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx b/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx index 1981eb12f0..2e3ac65cde 100644 --- a/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx +++ b/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx @@ -84,8 +84,16 @@ const leftDrawerEvent = ({ />

- {event.title} - {event.description} + + {event.title && event.title.length > 20 + ? event.title.substring(0, 20) + '...' + : event.title} + + + {event.description && event.description.length > 30 + ? event.description.substring(0, 30) + '...' + : event.description} +
diff --git a/src/screens/EventDashboard/EventDashboard.module.css b/src/screens/EventDashboard/EventDashboard.module.css index 5a484443d8..10ac2ee4ed 100644 --- a/src/screens/EventDashboard/EventDashboard.module.css +++ b/src/screens/EventDashboard/EventDashboard.module.css @@ -41,7 +41,7 @@ font-size: 20px; margin-bottom: 30px; padding-bottom: 5px; - width: 26%; + width: 100%; } .tagdetailsGreen > button { background-color: #31bb6b; diff --git a/src/screens/EventDashboard/EventDashboard.tsx b/src/screens/EventDashboard/EventDashboard.tsx index 810e8335c6..80f1374b71 100644 --- a/src/screens/EventDashboard/EventDashboard.tsx +++ b/src/screens/EventDashboard/EventDashboard.tsx @@ -80,7 +80,7 @@ const EventDashboard = (): JSX.Element => { setShowAddEventProjectModal={setShowAddEventProjectModal} > - +
{/* Side Bar - Static Information about the Event */} @@ -110,7 +110,7 @@ const EventDashboard = (): JSX.Element => {
- + {/* Main Screen Container */}
From b6c2d151e750d145d04eb7e1846bbb0580baad92 Mon Sep 17 00:00:00 2001 From: Shekhar Patel <90516956+duplixx@users.noreply.github.com> Date: Sat, 11 Nov 2023 22:07:18 +0530 Subject: [PATCH 4/6] test: SecuredRouteForUser component 100% Test Coverage and fixed uncovered lines (#1048) * SecuredRouteForUser test case added * Fixed Linting Errors * Update SecuredRouteForUser.test.tsx * Update SecuredRouteForUser.test.tsx * linting fix * Update SecuredRouteForUser.test.tsx * Update SecuredRouteForUser.test.tsx --- .../SecuredRouteForUser.test.tsx | 54 +++++++++++++++++++ 1 file changed, 54 insertions(+) create mode 100644 src/components/UserPortal/SecuredRouteForUser/SecuredRouteForUser.test.tsx diff --git a/src/components/UserPortal/SecuredRouteForUser/SecuredRouteForUser.test.tsx b/src/components/UserPortal/SecuredRouteForUser/SecuredRouteForUser.test.tsx new file mode 100644 index 0000000000..72ee402369 --- /dev/null +++ b/src/components/UserPortal/SecuredRouteForUser/SecuredRouteForUser.test.tsx @@ -0,0 +1,54 @@ +import React from 'react'; +import { MemoryRouter, Route } from 'react-router-dom'; +import { render, screen, waitFor } from '@testing-library/react'; +import SecuredRouteForUser from './SecuredRouteForUser'; + +describe('SecuredRouteForUser', () => { + test('renders the route when the user is logged in', () => { + // Set the 'IsLoggedIn' value to 'TRUE' in localStorage to simulate a logged-in user + localStorage.setItem('IsLoggedIn', 'TRUE'); + + render( + + ( + ( +
+ Organizations Component +
+ )} + /> + )} + /> + + ); + + expect(screen.getByTestId('organizations-content')).toBeInTheDocument(); + }); + + test('redirects to /user when the user is not logged in', async () => { + // Set the user as not logged in in local storage + localStorage.setItem('IsLoggedIn', 'FALSE'); + + render( + + ( + +
Secured Content
+ + )} + /> + + ); + + await waitFor(() => { + expect(window.location.pathname).toBe('/'); + }); + }); +}); From 464e546587886b36049554a46062107f61598d41 Mon Sep 17 00:00:00 2001 From: Sandeep Kumar Bhagat Date: Sun, 12 Nov 2023 09:20:19 +0530 Subject: [PATCH 5/6] Fix incorrect toast Notification. (#1053) * correct toast notification for TableRow.tsx with full test coverage * Add correct toast with full code coverage * Add correct toast for deleteEventProjectModal.tsx with full test coverage * Add correct toast for UpdateEventProjectModal.tsx with full test coverage * Add correct toast for EventRegistrantsModal.tsx and full test coverage. * Add correct toast for AddTaskModal.tsx with full test coverage * Add correct toast for UpdateTaskModal.tsx with full test coverage * minor fix * Add correct toast to EventRegistrantsModal.tsx * fix EventRegitrantsModal.tsx --- src/components/CheckIn/TableRow.test.tsx | 6 +-- src/components/CheckIn/TableRow.tsx | 20 ++++---- .../AddEventProjectModal.tsx | 47 +++++++++--------- .../DeleteEventProjectModal.test.tsx | 1 - .../DeleteEventProjectModal.tsx | 28 +++++------ .../UpdateEventProjectModal.tsx | 42 ++++++++-------- src/components/TaskModals/AddTaskModal.tsx | 48 +++++++++---------- .../TaskModals/DeleteTaskModal.test.tsx | 1 - src/components/TaskModals/DeleteTaskModal.tsx | 28 +++++------ .../TaskModals/ManageVolunteerModal.test.tsx | 2 - .../TaskModals/ManageVolunteerModal.tsx | 28 +++++------ .../TaskModals/UpdateTaskModal.test.tsx | 2 - src/components/TaskModals/UpdateTaskModal.tsx | 45 ++++++++--------- 13 files changed, 138 insertions(+), 160 deletions(-) diff --git a/src/components/CheckIn/TableRow.test.tsx b/src/components/CheckIn/TableRow.test.tsx index 789eb4d5f6..b8ab48f397 100644 --- a/src/components/CheckIn/TableRow.test.tsx +++ b/src/components/CheckIn/TableRow.test.tsx @@ -95,9 +95,9 @@ describe('Testing Table Row for CheckIn Table', () => { await waitFor(() => expect(queryByText('Generating pdf...')).toBeInTheDocument() ); - await waitFor(() => - expect(queryByText('PDF generated successfully!')).toBeInTheDocument() - ); + await waitFor(() => { + expect(queryByText('PDF generated successfully!')).toBeInTheDocument(); + }); }); test('Upon failing of check in mutation, the appropiate error message should be shown', async () => { diff --git a/src/components/CheckIn/TableRow.tsx b/src/components/CheckIn/TableRow.tsx index 0c69a26303..90e22deff0 100644 --- a/src/components/CheckIn/TableRow.tsx +++ b/src/components/CheckIn/TableRow.tsx @@ -37,15 +37,17 @@ export const TableRow = ({ }); }; - const generateTag = (): void => { - toast.warning('Generating pdf...'); - const inputs = [{ name: data.name }]; - - generate({ template: tagTemplate, inputs }).then((pdf) => { - const blob = new Blob([pdf.buffer], { type: 'application/pdf' }); - window.open(URL.createObjectURL(blob)); - toast.success('PDF generated successfully!'); + const notify = (): Promise => + toast.promise(generateTag, { + pending: 'Generating pdf...', + success: 'PDF generated successfully!', + error: 'Error generating pdf!', }); + const generateTag = async (): Promise => { + const inputs = [{ name: data.name }]; + const pdf = await generate({ template: tagTemplate, inputs }); + const blob = new Blob([pdf.buffer], { type: 'application/pdf' }); + window.open(URL.createObjectURL(blob)); }; return ( @@ -55,7 +57,7 @@ export const TableRow = ({ -
diff --git a/src/components/EventProjectModals/AddEventProjectModal.tsx b/src/components/EventProjectModals/AddEventProjectModal.tsx index 3da5043c51..10273b5e4f 100644 --- a/src/components/EventProjectModals/AddEventProjectModal.tsx +++ b/src/components/EventProjectModals/AddEventProjectModal.tsx @@ -22,10 +22,17 @@ export const AddEventProjectModal = ({ const [addMutation] = useMutation(ADD_EVENT_PROJECT_MUTATION); - const handleSubmit = (e: React.FormEvent): void => { + const notify = (e: React.FormEvent): Promise => { e.preventDefault(); - let toSubmit = true; + return toast.promise(handleSubmit, { + pending: 'Adding the project...', + success: 'Added the project successfully!', + error: 'There was an error in adding the project!', + }); + }; + const handleSubmit = async (): Promise => { + let toSubmit = true; if (title.trim().length == 0) { toast.error('Title cannot be empty!'); toSubmit = false; @@ -34,28 +41,18 @@ export const AddEventProjectModal = ({ toast.error('Description cannot be empty!'); toSubmit = false; } - - if (toSubmit) { - toast.warn('Adding the project...'); - addMutation({ - variables: { - title, - description, - eventId, - }, - }) - .then(() => { - toast.success('Added the project successfully!'); - refetchData(); - setTitle(''); - setDescription(''); - handleClose(); - }) - .catch((err) => { - toast.error('There was an error in adding the project!'); - toast.error(err.message); - }); - } + if (!toSubmit) return Promise.reject(); + await addMutation({ + variables: { + title, + description, + eventId, + }, + }); + refetchData(); + setTitle(''); + setDescription(''); + handleClose(); }; return ( @@ -64,7 +61,7 @@ export const AddEventProjectModal = ({ Add an Event Project -
+ Title diff --git a/src/components/EventProjectModals/DeleteEventProjectModal.test.tsx b/src/components/EventProjectModals/DeleteEventProjectModal.test.tsx index 9b75852e19..6a29735f2e 100644 --- a/src/components/EventProjectModals/DeleteEventProjectModal.test.tsx +++ b/src/components/EventProjectModals/DeleteEventProjectModal.test.tsx @@ -104,6 +104,5 @@ describe('Testing Delete Event Project Modal', () => { queryByText('There was an error in deleting the project details!') ).toBeInTheDocument() ); - await waitFor(() => expect(queryByText('Oops')).toBeInTheDocument()); }); }); diff --git a/src/components/EventProjectModals/DeleteEventProjectModal.tsx b/src/components/EventProjectModals/DeleteEventProjectModal.tsx index 9362651215..042e2fcd15 100644 --- a/src/components/EventProjectModals/DeleteEventProjectModal.tsx +++ b/src/components/EventProjectModals/DeleteEventProjectModal.tsx @@ -18,22 +18,22 @@ type ModalPropType = { export const DeleteEventProjectModal = (props: ModalPropType): JSX.Element => { const [deleteMutation] = useMutation(DELETE_EVENT_PROJECT_MUTATION); - const deleteProject = (): void => { - toast.warn('Deleting the project...'); - deleteMutation({ + const notify = (): Promise => { + return toast.promise(deleteProject, { + pending: 'Deleting the project...', + success: 'Deleted the project successfully!', + error: 'There was an error in deleting the project details!', + }); + }; + const deleteProject = async (): Promise => { + await deleteMutation({ variables: { id: props.project._id, }, - }) - .then(() => { - toast.success('Deleted the project successfully!'); - props.refetchData(); - props.handleClose(); - }) - .catch((err) => { - toast.error('There was an error in deleting the project details!'); - toast.error(err.message); - }); + }); + + props.refetchData(); + props.handleClose(); }; return ( @@ -60,7 +60,7 @@ export const DeleteEventProjectModal = (props: ModalPropType): JSX.Element => { > Cancel - diff --git a/src/components/EventProjectModals/UpdateEventProjectModal.tsx b/src/components/EventProjectModals/UpdateEventProjectModal.tsx index 362d78645a..08ac230c69 100644 --- a/src/components/EventProjectModals/UpdateEventProjectModal.tsx +++ b/src/components/EventProjectModals/UpdateEventProjectModal.tsx @@ -25,9 +25,15 @@ export const UpdateEventProjectModal = (props: ModalPropType): JSX.Element => { }, [props.project]); const [updateMutation] = useMutation(UPDATE_EVENT_PROJECT_MUTATION); - - const handleSubmit = (e: React.FormEvent): void => { + const notify = (e: React.FormEvent): Promise => { e.preventDefault(); + return toast.promise(handleSubmit, { + pending: 'Updating the project...', + success: 'Updated the project successfully!', + error: 'There was an error in updating the project details!', + }); + }; + const handleSubmit = async (): Promise => { let toSubmit = true; if (title.trim().length == 0) { @@ -38,26 +44,16 @@ export const UpdateEventProjectModal = (props: ModalPropType): JSX.Element => { toast.error('Description cannot be empty!'); toSubmit = false; } - - if (toSubmit) { - toast.warn('Updating the project...'); - updateMutation({ - variables: { - id: props.project._id, - title, - description, - }, - }) - .then(() => { - toast.success('Updated the project successfully!'); - props.refetchData(); - props.handleClose(); - }) - .catch((err) => { - toast.error('There was an error in updating the project details!'); - toast.error(err.message); - }); - } + if (!toSubmit) return Promise.reject(); + await updateMutation({ + variables: { + id: props.project._id, + title, + description, + }, + }); + props.refetchData(); + props.handleClose(); }; return ( @@ -71,7 +67,7 @@ export const UpdateEventProjectModal = (props: ModalPropType): JSX.Element => { Update Event Project - + Title diff --git a/src/components/TaskModals/AddTaskModal.tsx b/src/components/TaskModals/AddTaskModal.tsx index 22bd0f4941..0134077afe 100644 --- a/src/components/TaskModals/AddTaskModal.tsx +++ b/src/components/TaskModals/AddTaskModal.tsx @@ -27,9 +27,15 @@ export const AddTaskModal = ({ const [deadline, setDeadline] = useState(today); const [addMutation] = useMutation(ADD_EVENT_PROJECT_TASK_MUTATION); - - const handleSubmit = (e: React.FormEvent): void => { + const notify = async (e: React.FormEvent): Promise => { e.preventDefault(); + toast.promise(handleSubmit, { + pending: 'Adding the task...', + success: 'Added the task successfully!', + error: 'There was an error in adding the task!', + }); + }; + const handleSubmit = async (): Promise => { let toSubmit = true; if (title.trim().length == 0) { @@ -40,29 +46,19 @@ export const AddTaskModal = ({ toast.error('Description cannot be empty!'); toSubmit = false; } - - if (toSubmit) { - toast.warn('Adding the task...'); - addMutation({ - variables: { - title, - description, - projectId, - deadline, - }, - }) - .then(() => { - toast.success('Added the task successfully!'); - refetchData(); - setTitle(''); - setDescription(''); - handleClose(); - }) - .catch((err) => { - toast.error('There was an error in adding the task!'); - toast.error(err.message); - }); - } + if (!toSubmit) return Promise.reject(); + await addMutation({ + variables: { + title, + description, + projectId, + deadline, + }, + }); + refetchData(); + setTitle(''); + setDescription(''); + handleClose(); }; return ( @@ -71,7 +67,7 @@ export const AddTaskModal = ({ Add an Event Task - + Title diff --git a/src/components/TaskModals/DeleteTaskModal.test.tsx b/src/components/TaskModals/DeleteTaskModal.test.tsx index e9ffea1be0..4eb40e53a8 100644 --- a/src/components/TaskModals/DeleteTaskModal.test.tsx +++ b/src/components/TaskModals/DeleteTaskModal.test.tsx @@ -96,6 +96,5 @@ describe('Testing Delete Event Project Modal', () => { queryByText('There was an error in deleting the task!') ).toBeInTheDocument() ); - await waitFor(() => expect(queryByText('Oops')).toBeInTheDocument()); }); }); diff --git a/src/components/TaskModals/DeleteTaskModal.tsx b/src/components/TaskModals/DeleteTaskModal.tsx index f4b6378c1b..73baff5775 100644 --- a/src/components/TaskModals/DeleteTaskModal.tsx +++ b/src/components/TaskModals/DeleteTaskModal.tsx @@ -13,23 +13,21 @@ type ModalPropType = { export const DeleteTaskModal = (props: ModalPropType): JSX.Element => { const [deleteMutation] = useMutation(DELETE_EVENT_TASK_MUTATION); - - const deleteProject = (): void => { - toast.warn('Deleting the task...'); - deleteMutation({ + const notify = (): Promise => { + return toast.promise(deleteProject, { + pending: 'Deleting the task...', + success: 'Deleted the task successfully!', + error: 'There was an error in deleting the task!', + }); + }; + const deleteProject = async (): Promise => { + await deleteMutation({ variables: { id: props.taskId, }, - }) - .then(() => { - toast.success('Deleted the task successfully!'); - props.refetchData(); - props.handleClose(); - }) - .catch((err) => { - toast.error('There was an error in deleting the task!'); - toast.error(err.message); - }); + }); + props.refetchData(); + props.handleClose(); }; return ( @@ -56,7 +54,7 @@ export const DeleteTaskModal = (props: ModalPropType): JSX.Element => { > Cancel - diff --git a/src/components/TaskModals/ManageVolunteerModal.test.tsx b/src/components/TaskModals/ManageVolunteerModal.test.tsx index 68ac0888d7..e284984969 100644 --- a/src/components/TaskModals/ManageVolunteerModal.test.tsx +++ b/src/components/TaskModals/ManageVolunteerModal.test.tsx @@ -131,7 +131,5 @@ describe('Testing Manage Volunteers Modal', () => { queryByText('There was an error in updating the volunteers!') ).toBeInTheDocument() ); - - await waitFor(() => expect(queryByText('Oops')).toBeInTheDocument()); }); }); diff --git a/src/components/TaskModals/ManageVolunteerModal.tsx b/src/components/TaskModals/ManageVolunteerModal.tsx index 31f9593663..162fda4a02 100644 --- a/src/components/TaskModals/ManageVolunteerModal.tsx +++ b/src/components/TaskModals/ManageVolunteerModal.tsx @@ -32,24 +32,22 @@ export const ManageVolunteerModal = (props: ModalPropType): JSX.Element => { useEffect(() => setVolunteers(props.volunteers), [props.volunteers]); const [setMutation] = useMutation(SET_TASK_VOLUNTEERS_MUTATION); - - const handleSubmit = (): void => { - toast.warn('Updating the volunteers...'); - setMutation({ + const notify = (): Promise => { + return toast.promise(handleSubmit, { + pending: 'Updating the volunteers...', + success: 'Successfully updated the volunteers!', + error: 'There was an error in updating the volunteers!', + }); + }; + const handleSubmit = async (): Promise => { + await setMutation({ variables: { id: props.taskId, volunteers: volunteers.map((volunteer) => volunteer._id), }, - }) - .then(() => { - toast.success('Successfully updated the volunteers!'); - props.refetchData(); - props.handleClose(); - }) - .catch((err) => { - toast.error('There was an error in updating the volunteers!'); - toast.error(err.message); - }); + }); + props.refetchData(); + props.handleClose(); }; return ( @@ -94,7 +92,7 @@ export const ManageVolunteerModal = (props: ModalPropType): JSX.Element => {
- diff --git a/src/components/TaskModals/UpdateTaskModal.test.tsx b/src/components/TaskModals/UpdateTaskModal.test.tsx index 2184c421a7..9541d6d26b 100644 --- a/src/components/TaskModals/UpdateTaskModal.test.tsx +++ b/src/components/TaskModals/UpdateTaskModal.test.tsx @@ -229,8 +229,6 @@ describe('Testing Update Event Task Modal', () => { queryByText('There was an error in updating the task!') ).toBeInTheDocument() ); - - await waitFor(() => expect(queryByText('Oops')).toBeInTheDocument()); }); test('Manage volunteer modal and delete task modal should open and close properly', async () => { diff --git a/src/components/TaskModals/UpdateTaskModal.tsx b/src/components/TaskModals/UpdateTaskModal.tsx index 76d57da797..d79dd19a36 100644 --- a/src/components/TaskModals/UpdateTaskModal.tsx +++ b/src/components/TaskModals/UpdateTaskModal.tsx @@ -57,9 +57,15 @@ export const UpdateTaskModal = (props: ModalPropType): JSX.Element => { }, [props.task]); const [updateMutation] = useMutation(UPDATE_EVENT_PROJECT_TASK_MUTATION); - - const handleSubmit = (e: React.FormEvent): void => { + const notify = (e: React.FormEvent): Promise => { e.preventDefault(); + return toast.promise(handleSubmit, { + pending: 'Updating the task...', + success: 'Updated the task successfully!', + error: 'There was an error in updating the task!', + }); + }; + const handleSubmit = async (): Promise => { let toSubmit = true; if (title.trim().length == 0) { @@ -70,28 +76,19 @@ export const UpdateTaskModal = (props: ModalPropType): JSX.Element => { toast.error('Description cannot be empty!'); toSubmit = false; } + if (!toSubmit) return Promise.reject(); - if (toSubmit) { - toast.warn('Updating the task...'); - updateMutation({ - variables: { - taskId: props.task._id, - title, - description, - deadline, - completed, - }, - }) - .then(() => { - toast.success('Updated the task successfully!'); - props.refetchData(); - props.handleClose(); - }) - .catch((err) => { - toast.error('There was an error in updating the task!'); - toast.error(err.message); - }); - } + await updateMutation({ + variables: { + taskId: props.task._id, + title, + description, + deadline, + completed, + }, + }); + props.refetchData(); + props.handleClose(); }; return ( @@ -107,7 +104,7 @@ export const UpdateTaskModal = (props: ModalPropType): JSX.Element => { Update the Event Task - + Title From 23f034d1026159758764def02ef1c6e3e47db2ec Mon Sep 17 00:00:00 2001 From: Kanhaiya yadav <93936630+kanhaiya04@users.noreply.github.com> Date: Mon, 13 Nov 2023 22:08:33 +0530 Subject: [PATCH 6/6] created a return button on event dashboard (#1057) --- .../LeftDrawerEvent/LeftDrawerEvent.test.tsx | 19 ++++++++++++++++++- .../LeftDrawerEvent/LeftDrawerEvent.tsx | 14 ++++++++++++++ 2 files changed, 32 insertions(+), 1 deletion(-) diff --git a/src/components/LeftDrawerEvent/LeftDrawerEvent.test.tsx b/src/components/LeftDrawerEvent/LeftDrawerEvent.test.tsx index 0fabcd2c55..92d0ac32ad 100644 --- a/src/components/LeftDrawerEvent/LeftDrawerEvent.test.tsx +++ b/src/components/LeftDrawerEvent/LeftDrawerEvent.test.tsx @@ -18,7 +18,7 @@ const props: InterfaceLeftDrawerProps = { title: 'Test Event', description: 'Test Description', organization: { - _id: 'Test Organization', + _id: 'TestOrganization', }, }, hideDrawer: false, @@ -218,4 +218,21 @@ describe('Testing Left Drawer component for the Event Dashboard', () => { expect(truncatedEventTitle).toContain('...'); expect(truncatedEventDescription).toContain('...'); }); + test('Testing all events button', async () => { + localStorage.setItem('UserType', 'SUPERADMIN'); + render( + + + + + + + + ); + + userEvent.click(screen.getByTestId('allEventsBtn')); + expect(global.window.location.pathname).toBe( + `/orgevents/id=${props.event.organization._id}` + ); + }); }); diff --git a/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx b/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx index 2e3ac65cde..2d41b4503f 100644 --- a/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx +++ b/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx @@ -130,6 +130,20 @@ const leftDrawerEvent = ({ eventId={event._id} key={`${event?._id || 'loading'}Stats`} /> + {/* Profile Section & Logout Btn */}