From 9c58d1bff4a3bc58445bbfd060a7f93e882f6a71 Mon Sep 17 00:00:00 2001 From: Rishabh <100997409+rishabhbizzle@users.noreply.github.com> Date: Sun, 21 Jan 2024 00:10:18 +0530 Subject: [PATCH] feat: Deprecates the Project & Task Feature for Events (#1362) * feat: deprecate project and task feature in events * feat: deprecate mutations of project & task feature in events * fix: reverted package-lock.json changes * feat: deprecate event project & tasks feature from user portal --- public/locales/en.json | 17 -- public/locales/fr.json | 17 -- public/locales/hi.json | 17 -- public/locales/sp.json | 17 -- public/locales/zh.json | 17 -- schema.graphql | 64 ----- src/App.tsx | 2 - src/GraphQl/Mutations/mutations.ts | 49 ---- src/GraphQl/Queries/Queries.ts | 17 -- src/assets/svgs/addEventProject.svg | 1 - .../AddEventProjectModal.test.tsx | 132 --------- .../AddEventProjectModal.tsx | 99 ------- .../DeleteEventProjectModal.test.tsx | 108 -------- .../DeleteEventProjectModal.tsx | 70 ----- .../UpdateEventProjectModal.test.tsx | 155 ----------- .../UpdateEventProjectModal.tsx | 103 ------- .../IconComponent/IconComponent.test.tsx | 4 - .../IconComponent/IconComponent.tsx | 8 - .../LeftDrawerEvent/LeftDrawerEvent.test.tsx | 7 +- .../LeftDrawerEvent/LeftDrawerEvent.tsx | 18 -- .../LeftDrawerEventWrapper.test.tsx | 1 - .../LeftDrawerEventWrapper.tsx | 1 - .../TaskListItem/TaskListItem.test.tsx | 130 --------- src/components/TaskListItem/TaskListItem.tsx | 106 ------- .../TaskModals/AddTaskModal.test.tsx | 150 ---------- src/components/TaskModals/AddTaskModal.tsx | 114 -------- .../TaskModals/DeleteTaskModal.test.tsx | 100 ------- src/components/TaskModals/DeleteTaskModal.tsx | 64 ----- .../TaskModals/ManageVolunteerModal.test.tsx | 135 --------- .../TaskModals/ManageVolunteerModal.tsx | 101 ------- .../TaskModals/UpdateTaskModal.test.tsx | 262 ------------------ src/components/TaskModals/UpdateTaskModal.tsx | 222 --------------- .../OrganizationNavbar/OrganizationNavbar.tsx | 5 - .../UserPortal/TaskCard/TaskCard.module.css | 41 --- .../UserPortal/TaskCard/TaskCard.test.tsx | 95 ------- .../UserPortal/TaskCard/TaskCard.tsx | 131 --------- .../UserPortal/UserNavbar/UserNavbar.test.tsx | 21 -- .../UserPortal/UserNavbar/UserNavbar.tsx | 9 - .../EventDashboard/EventDashboard.mocks.ts | 94 ------- .../EventDashboard/EventDashboard.test.tsx | 91 +----- src/screens/EventDashboard/EventDashboard.tsx | 192 +------------ src/screens/UserPortal/Tasks/Tasks.module.css | 48 ---- src/screens/UserPortal/Tasks/Tasks.test.tsx | 130 --------- src/screens/UserPortal/Tasks/Tasks.tsx | 173 ------------ 44 files changed, 9 insertions(+), 3329 deletions(-) delete mode 100644 src/assets/svgs/addEventProject.svg delete mode 100644 src/components/EventProjectModals/AddEventProjectModal.test.tsx delete mode 100644 src/components/EventProjectModals/AddEventProjectModal.tsx delete mode 100644 src/components/EventProjectModals/DeleteEventProjectModal.test.tsx delete mode 100644 src/components/EventProjectModals/DeleteEventProjectModal.tsx delete mode 100644 src/components/EventProjectModals/UpdateEventProjectModal.test.tsx delete mode 100644 src/components/EventProjectModals/UpdateEventProjectModal.tsx delete mode 100644 src/components/TaskListItem/TaskListItem.test.tsx delete mode 100644 src/components/TaskListItem/TaskListItem.tsx delete mode 100644 src/components/TaskModals/AddTaskModal.test.tsx delete mode 100644 src/components/TaskModals/AddTaskModal.tsx delete mode 100644 src/components/TaskModals/DeleteTaskModal.test.tsx delete mode 100644 src/components/TaskModals/DeleteTaskModal.tsx delete mode 100644 src/components/TaskModals/ManageVolunteerModal.test.tsx delete mode 100644 src/components/TaskModals/ManageVolunteerModal.tsx delete mode 100644 src/components/TaskModals/UpdateTaskModal.test.tsx delete mode 100644 src/components/TaskModals/UpdateTaskModal.tsx delete mode 100644 src/components/UserPortal/TaskCard/TaskCard.module.css delete mode 100644 src/components/UserPortal/TaskCard/TaskCard.test.tsx delete mode 100644 src/components/UserPortal/TaskCard/TaskCard.tsx delete mode 100644 src/screens/UserPortal/Tasks/Tasks.module.css delete mode 100644 src/screens/UserPortal/Tasks/Tasks.test.tsx delete mode 100644 src/screens/UserPortal/Tasks/Tasks.tsx diff --git a/public/locales/en.json b/public/locales/en.json index 04a8641870..d1fe7f8fba 100644 --- a/public/locales/en.json +++ b/public/locales/en.json @@ -587,7 +587,6 @@ "events": "Events", "chat": "Chat", "donate": "Donate", - "myTasks": "My Tasks", "settings": "Settings", "language": "Language", "logout": "Logout", @@ -674,22 +673,6 @@ "alreadyRegistered": "Already registered", "register": "Register" }, - "userTasks": { - "yourAssignedTasks": "Your assigned tasks", - "nothingToShow": "Nothing to show here." - }, - "userTaskCard": { - "description": "Description", - "deadline": "Deadline", - "created": "Created", - "assignees": "Assignees", - "completed": "Completed", - "incomplete": "Incomplete", - "taskCompleted": "The task has been completed", - "taskNotCompleted": "The task has not been completed yet", - "event": "Event", - "organization": "Organization" - }, "advertisement": { "title": "Advertisements", "pHeading": "Manage Ads", diff --git a/public/locales/fr.json b/public/locales/fr.json index 84b28281e3..80ae5c3587 100644 --- a/public/locales/fr.json +++ b/public/locales/fr.json @@ -583,7 +583,6 @@ "events": "Événements", "chat": "Discuter", "donate": "Donner", - "myTasks": "Mes tâches", "settings": "Paramètres", "language": "Langue", "logout": "Se déconnecter", @@ -670,22 +669,6 @@ "alreadyRegistered": "Déjà enregistré", "register": "Registre" }, - "userTasks": { - "yourAssignedTasks": "Vos tâches assignées", - "nothingToShow": "Rien à montrer ici." - }, - "userTaskCard": { - "description": "Description", - "deadline": "Date limite", - "created": "Créé", - "assignees": "Destinataires", - "completed": "Complété", - "incomplete": "Incomplète", - "taskCompleted": "La tâche est terminée", - "taskNotCompleted": "La tâche n'est pas encore terminée", - "event": "Événement", - "organization": "Organisation" - }, "advertisement": { "title": "Publicités", "pHeading": "Gérer les publicités", diff --git a/public/locales/hi.json b/public/locales/hi.json index 206639b366..9cec18077c 100644 --- a/public/locales/hi.json +++ b/public/locales/hi.json @@ -583,7 +583,6 @@ "events": "आयोजन", "chat": "बातचीत", "donate": "दान देना", - "myTasks": "मेरा काम", "settings": "समायोजन", "language": "भाषा", "logout": "लॉग आउट", @@ -670,22 +669,6 @@ "alreadyRegistered": "पहले से ही पंजीकृत", "register": "पंजीकरण करवाना" }, - "userTasks": { - "yourAssignedTasks": "आपके असाइन किए गए कार्य", - "nothingToShow": "यहां दिखाने के लिए कुछ भी नहीं है." - }, - "userTaskCard": { - "description": "विवरण", - "deadline": "अंतिम तारीख", - "created": "बनाया", - "assignees": "असाइनी", - "completed": "पुरा", - "incomplete": "अधूरा", - "taskCompleted": "काम पूरा हो गया", - "taskNotCompleted": "कार्य अभी तक पूरा नहीं हुआ है", - "event": "आयोजन", - "organization": "संगठन" - }, "advertisement": { "title": "विज्ञापन", "pHeading": "विज्ञापन प्रबंधन", diff --git a/public/locales/sp.json b/public/locales/sp.json index 6fe140d300..4b090a0eb5 100644 --- a/public/locales/sp.json +++ b/public/locales/sp.json @@ -583,7 +583,6 @@ "events": "Eventos", "chat": "Charlar", "donate": "Donar", - "myTasks": "Mis tareas", "settings": "Ajustes", "language": "Idioma", "logout": "Cerrar sesión", @@ -670,22 +669,6 @@ "alreadyRegistered": "Ya registrado", "register": "Registro" }, - "userTasks": { - "yourAssignedTasks": "Tus tareas asignadas", - "nothingToShow": "No hay nada que mostrar aquí." - }, - "userTaskCard": { - "description": "Descripción", - "deadline": "Fecha límite", - "created": "Creado", - "assignees": "Cesionarias", - "completed": "Terminada", - "incomplete": "Incompleta", - "taskCompleted": "La tarea ha sido completada", - "taskNotCompleted": "La tarea aún no se ha completado", - "event": "Evento", - "organization": "Organización" - }, "advertisement": { "title": "Anuncios", "pHeading": "Gestionar anuncios", diff --git a/public/locales/zh.json b/public/locales/zh.json index dd2f9a6421..daacd5ec93 100644 --- a/public/locales/zh.json +++ b/public/locales/zh.json @@ -583,7 +583,6 @@ "events": "活動", "chat": "聊天", "donate": "捐", - "myTasks": "我的任務", "settings": "設置", "language": "語言", "logout": "登出", @@ -670,22 +669,6 @@ "alreadyRegistered": "已經註冊", "register": "登記" }, - "userTasks": { - "yourAssignedTasks": "您指派的任務", - "nothingToShow": "這裡沒有什麼可顯示的。" - }, - "userTaskCard": { - "description": "描述", - "deadline": "最後期限", - "created": "已創建", - "assignees": "受讓人", - "completed": "完全的", - "incomplete": "不完整", - "taskCompleted": "任務已完成", - "taskNotCompleted": "任務還沒完成", - "event": "事件", - "organization": "組織" - }, "advertisement": { "title": "广告", "pHeading": "管理广告", diff --git a/schema.graphql b/schema.graphql index b77aab9894..9e349f8908 100644 --- a/schema.graphql +++ b/schema.graphql @@ -168,7 +168,6 @@ type Event { location: String longitude: Longitude organization: Organization - projects: [EventProject] recurrance: Recurrance recurring: Boolean! startDate: Date! @@ -223,19 +222,7 @@ enum EventOrderByInput { title_DESC } -type EventProject { - _id: ID! - description: String! - event: Event! - tasks: [Task] - title: String! -} -input EventProjectInput { - description: String! - eventId: ID! - title: String! -} input EventWhereInput { description: String @@ -451,7 +438,6 @@ type Mutation { userId: ID! ): Donation! createEvent(data: EventInput): Event! - createEventProject(data: EventProjectInput!): EventProject! createGroupChat(data: createGroupChatInput!): GroupChat! createMember(input: UserAndOrganizationInput!): Organization! createMessageChat(data: MessageChatInput!): MessageChat! @@ -463,7 +449,6 @@ type Mutation { uninstalledOrgs: [ID!] ): Plugin! createPost(data: PostInput!, file: String): Post - createTask(data: TaskInput!, eventProjectId: ID!): Task! createUserTag(input: CreateUserTagInput!): UserTag deleteAdvertisementById(id: ID!): DeletePayload! deleteDonationById(id: ID!): DeletePayload! @@ -486,13 +471,11 @@ type Mutation { removeDirectChat(chatId: ID!, organizationId: ID!): DirectChat! removeEvent(id: ID!): Event! removeEventAttendee(data: EventAttendeeInput!): User! - removeEventProject(id: ID!): EventProject! removeGroupChat(chatId: ID!): GroupChat! removeMember(data: UserAndOrganizationInput!): Organization! removeOrganization(id: ID!): User! removeOrganizationImage(organizationId: String!): Organization! removePost(id: ID!): Post - removeTask(id: ID!): Task removeUserFromGroupChat(chatId: ID!, userId: ID!): GroupChat! removeUserImage: User! removeUserTag(id: ID!): UserTag @@ -507,7 +490,6 @@ type Mutation { chatId: ID! messageContent: String! ): GroupChatMessage! - setTaskVolunteers(id: ID!, volunteers: [ID]!): Task signUp(data: UserInput!, file: String): AuthData! togglePostPin(id: ID!): Post! unassignUserTag(input: ToggleUserTagAssignInput!): User @@ -516,7 +498,6 @@ type Mutation { unlikePost(id: ID!): Post unregisterForEventByUser(id: ID!): Event! updateEvent(data: UpdateEventInput, id: ID!): Event! - updateEventProject(data: UpdateEventProjectInput!, id: ID!): EventProject! updateLanguage(languageCode: String!): User! updateOrganization( data: UpdateOrganizationInput @@ -525,7 +506,6 @@ type Mutation { ): Organization! updatePluginStatus(id: ID!, orgId: ID!): Plugin! updatePost(data: PostUpdateInput, id: ID!): Post! - updateTask(data: UpdateTaskInput!, id: ID!): Task updateUserPassword(data: UpdateUserPasswordInput!): User! updateUserProfile(data: UpdateUserInput, file: String): User! updateUserTag(input: UpdateUserTagInput!): UserTag @@ -865,37 +845,6 @@ type Subscription { onPluginUpdate: Plugin } -type Task { - _id: ID! - completed: Boolean - createdAt: DateTime! - creator: User! - deadline: DateTime - description: String - event: Event! - title: String! - volunteers: [User] -} - -input TaskInput { - deadline: DateTime! - description: String! - title: String! -} - -enum TaskOrderByInput { - createdAt_ASC - createdAt_DESC - deadline_ASC - deadline_DESC - description_ASC - description_DESC - id_ASC - id_DESC - title_ASC - title_DESC -} - scalar Time input ToggleUserTagAssignInput { @@ -942,11 +891,6 @@ input UpdateEventInput { title: String } -input UpdateEventProjectInput { - description: String - title: String -} - input UpdateOrganizationInput { description: String userRegistrationRequired: Boolean @@ -955,13 +899,6 @@ input UpdateOrganizationInput { visibleInSearch: Boolean } -input UpdateTaskInput { - completed: Boolean - deadline: DateTime - description: String - title: String -} - input UpdateUserInput { email: EmailAddress firstName: String @@ -991,7 +928,6 @@ type User { adminApproved: Boolean adminFor: [Organization] appLanguageCode: String! - assignedTasks: [Task] createdAt: DateTime createdEvents: [Event] createdOrganizations: [Organization] diff --git a/src/App.tsx b/src/App.tsx index 9ab6b07791..d44aa52b0f 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -30,7 +30,6 @@ import People from 'screens/UserPortal/People/People'; import Settings from 'screens/UserPortal/Settings/Settings'; import Donate from 'screens/UserPortal/Donate/Donate'; import Events from 'screens/UserPortal/Events/Events'; -import Tasks from 'screens/UserPortal/Tasks/Tasks'; // import Chat from 'screens/UserPortal/Chat/Chat'; import Advertisements from 'components/Advertisements/Advertisements'; @@ -126,7 +125,6 @@ function app(): JSX.Element { - {/* */} diff --git a/src/GraphQl/Mutations/mutations.ts b/src/GraphQl/Mutations/mutations.ts index 827b14c051..e27f6733b8 100644 --- a/src/GraphQl/Mutations/mutations.ts +++ b/src/GraphQl/Mutations/mutations.ts @@ -550,55 +550,6 @@ export const REGISTER_EVENT = gql` } } `; - -export const ADD_EVENT_PROJECT_MUTATION = gql` - mutation AddEventProject( - $title: String! - $description: String! - $eventId: ID! - ) { - createEventProject( - data: { title: $title, description: $description, eventId: $eventId } - ) { - _id - } - } -`; - -export const UPDATE_EVENT_PROJECT_MUTATION = gql` - mutation UpdateEventProject($title: String, $description: String, $id: ID!) { - updateEventProject( - id: $id - data: { title: $title, description: $description } - ) { - _id - } - } -`; - -export const DELETE_EVENT_PROJECT_MUTATION = gql` - mutation DeleteEventProject($id: ID!) { - removeEventProject(id: $id) { - _id - } - } -`; - -export const ADD_EVENT_PROJECT_TASK_MUTATION = gql` - mutation AddEventTask( - $title: String! - $description: String! - $projectId: ID! - $deadline: DateTime! - ) { - createTask( - eventProjectId: $projectId - data: { title: $title, description: $description, deadline: $deadline } - ) { - _id - } - } -`; // Changes the role of a event in an organization and add and remove the event from the organization export { UPDATE_EVENT_PROJECT_TASK_MUTATION } from './EventTaskMutations'; export { DELETE_EVENT_TASK_MUTATION } from './EventTaskMutations'; diff --git a/src/GraphQl/Queries/Queries.ts b/src/GraphQl/Queries/Queries.ts index 38b9880b39..1941add36a 100644 --- a/src/GraphQl/Queries/Queries.ts +++ b/src/GraphQl/Queries/Queries.ts @@ -187,23 +187,6 @@ export const EVENT_DETAILS = gql` attendees { _id } - projects { - _id - title - description - tasks { - _id - title - description - deadline - completed - volunteers { - _id - firstName - lastName - } - } - } } } `; diff --git a/src/assets/svgs/addEventProject.svg b/src/assets/svgs/addEventProject.svg deleted file mode 100644 index 3c561d5ee8..0000000000 --- a/src/assets/svgs/addEventProject.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/EventProjectModals/AddEventProjectModal.test.tsx b/src/components/EventProjectModals/AddEventProjectModal.test.tsx deleted file mode 100644 index 1dd57e0d1e..0000000000 --- a/src/components/EventProjectModals/AddEventProjectModal.test.tsx +++ /dev/null @@ -1,132 +0,0 @@ -import React from 'react'; -import { fireEvent, render, waitFor } from '@testing-library/react'; -import { MockedProvider } from '@apollo/react-testing'; -import { AddEventProjectModal } from './AddEventProjectModal'; -import { ADD_EVENT_PROJECT_MUTATION } from 'GraphQl/Mutations/mutations'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { store } from 'state/store'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; -import { ToastContainer } from 'react-toastify'; - -const successfulMutationMock = [ - { - request: { - query: ADD_EVENT_PROJECT_MUTATION, - variables: { - title: 'Title', - description: 'Description', - eventId: '123', - }, - }, - result: { - data: { - createEventProject: { - _id: '456', - }, - }, - }, - }, -]; - -const unsuccessfulMutationMock = [ - { - request: { - query: ADD_EVENT_PROJECT_MUTATION, - variables: { - title: 'Title', - description: 'Description', - eventId: '123', - }, - }, - error: new Error('Oops'), - }, -]; - -describe('Testing Add Event Project Modal', () => { - const props = { - show: true, - eventId: '123', - handleClose: jest.fn(), - refetchData: jest.fn(), - }; - - test('The modal should be rendered and add button should not work with blank values', async () => { - const { queryByText, queryByLabelText } = render( - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByText('Add an Event Project')).toBeInTheDocument() - ); - - fireEvent.click(queryByText('Create Project') as Element); - - // Check for blank entry warning modals - await waitFor(() => - expect(queryByText('Title cannot be empty!')).toBeInTheDocument() - ); - await waitFor(() => - expect(queryByText('Description cannot be empty!')).toBeInTheDocument() - ); - - // Type in the title and the description of the event project - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: 'Title' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: 'Description' }, - }); - - fireEvent.click(queryByText('Create Project') as Element); - - await waitFor(() => - expect(queryByText('Adding the project...')).toBeInTheDocument() - ); - - await waitFor(() => - expect(queryByText('Added the project successfully!')).toBeInTheDocument() - ); - }); - - test('The modal should be rendered and error message should be shown if mutation fails', async () => { - const { queryByText, queryByLabelText } = render( - - - - - - - - - - - ); - - // Type in the title and the description of the event project - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: 'Title' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: 'Description' }, - }); - - fireEvent.click(queryByText('Create Project') as Element); - - await waitFor(() => - expect( - queryByText('There was an error in adding the project!') - ).toBeInTheDocument() - ); - }); -}); diff --git a/src/components/EventProjectModals/AddEventProjectModal.tsx b/src/components/EventProjectModals/AddEventProjectModal.tsx deleted file mode 100644 index 10273b5e4f..0000000000 --- a/src/components/EventProjectModals/AddEventProjectModal.tsx +++ /dev/null @@ -1,99 +0,0 @@ -import React, { useState } from 'react'; -import { Modal, Button, Form } from 'react-bootstrap'; -import { toast } from 'react-toastify'; -import { useMutation } from '@apollo/client'; -import { ADD_EVENT_PROJECT_MUTATION } from 'GraphQl/Mutations/mutations'; - -type ModalPropType = { - show: boolean; - eventId: string; - handleClose: () => void; - refetchData: () => void; -}; - -export const AddEventProjectModal = ({ - show, - handleClose, - refetchData, - eventId, -}: ModalPropType): JSX.Element => { - const [title, setTitle] = useState(''); - const [description, setDescription] = useState(''); - - const [addMutation] = useMutation(ADD_EVENT_PROJECT_MUTATION); - - const notify = (e: React.FormEvent): Promise => { - e.preventDefault(); - 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; - } - if (description.trim().length == 0) { - toast.error('Description cannot be empty!'); - toSubmit = false; - } - if (!toSubmit) return Promise.reject(); - await addMutation({ - variables: { - title, - description, - eventId, - }, - }); - refetchData(); - setTitle(''); - setDescription(''); - handleClose(); - }; - - return ( - <> - - - Add an Event Project - -
- - - Title - setTitle(e.target.value)} - /> - - - - Description - setDescription(e.target.value)} - /> - - - - - -
- - - ); -}; diff --git a/src/components/EventProjectModals/DeleteEventProjectModal.test.tsx b/src/components/EventProjectModals/DeleteEventProjectModal.test.tsx deleted file mode 100644 index 6a29735f2e..0000000000 --- a/src/components/EventProjectModals/DeleteEventProjectModal.test.tsx +++ /dev/null @@ -1,108 +0,0 @@ -import React from 'react'; -import { fireEvent, render, waitFor } from '@testing-library/react'; -import { MockedProvider } from '@apollo/react-testing'; -import { DeleteEventProjectModal } from './DeleteEventProjectModal'; -import { DELETE_EVENT_PROJECT_MUTATION } from 'GraphQl/Mutations/mutations'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { store } from 'state/store'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; -import { ToastContainer } from 'react-toastify'; - -const successfulMutationMock = [ - { - request: { - query: DELETE_EVENT_PROJECT_MUTATION, - variables: { id: '123' }, - }, - result: { - data: { - removeEventProject: { - _id: '123', - }, - }, - }, - }, -]; - -const unsuccessfulMutationMock = [ - { - request: { - query: DELETE_EVENT_PROJECT_MUTATION, - variables: { id: '123' }, - }, - error: new Error('Oops'), - }, -]; - -describe('Testing Delete Event Project Modal', () => { - const props = { - show: true, - project: { - _id: '123', - title: 'Test Event Project', - description: 'Test Event Project Description', - }, - handleClose: jest.fn(), - refetchData: jest.fn(), - }; - - test('The modal should be rendered and delete button should work', async () => { - const { queryByText } = render( - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByText('Delete Event Project')).toBeInTheDocument() - ); - - fireEvent.click(queryByText('Delete') as Element); - await waitFor(() => - expect(queryByText('Deleting the project...')).toBeInTheDocument() - ); - await waitFor(() => - expect( - queryByText('Deleted the project successfully!') - ).toBeInTheDocument() - ); - }); - - test('The modal should be rendered and error message should be shown if mutation fails', async () => { - const { queryByText } = render( - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByText('Delete Event Project')).toBeInTheDocument() - ); - - fireEvent.click(queryByText('Delete') as Element); - await waitFor(() => - expect(queryByText('Deleting the project...')).toBeInTheDocument() - ); - await waitFor(() => - expect( - queryByText('There was an error in deleting the project details!') - ).toBeInTheDocument() - ); - }); -}); diff --git a/src/components/EventProjectModals/DeleteEventProjectModal.tsx b/src/components/EventProjectModals/DeleteEventProjectModal.tsx deleted file mode 100644 index 042e2fcd15..0000000000 --- a/src/components/EventProjectModals/DeleteEventProjectModal.tsx +++ /dev/null @@ -1,70 +0,0 @@ -import React from 'react'; -import { Modal, Button } from 'react-bootstrap'; -import { toast } from 'react-toastify'; -import { useMutation } from '@apollo/client'; -import { DELETE_EVENT_PROJECT_MUTATION } from 'GraphQl/Mutations/mutations'; - -type ModalPropType = { - show: boolean; - project: { - _id: string; - title: string; - description: string; - }; - handleClose: () => void; - refetchData: () => void; -}; - -export const DeleteEventProjectModal = (props: ModalPropType): JSX.Element => { - const [deleteMutation] = useMutation(DELETE_EVENT_PROJECT_MUTATION); - - 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, - }, - }); - - props.refetchData(); - props.handleClose(); - }; - - return ( - <> - - - Delete Event Project - - -
- Are you sure you want to delete this? -
- - - - - - - - ); -}; diff --git a/src/components/EventProjectModals/UpdateEventProjectModal.test.tsx b/src/components/EventProjectModals/UpdateEventProjectModal.test.tsx deleted file mode 100644 index b184b24f75..0000000000 --- a/src/components/EventProjectModals/UpdateEventProjectModal.test.tsx +++ /dev/null @@ -1,155 +0,0 @@ -import React from 'react'; -import { fireEvent, render, waitFor } from '@testing-library/react'; -import { MockedProvider } from '@apollo/react-testing'; -import { UpdateEventProjectModal } from './UpdateEventProjectModal'; -import { UPDATE_EVENT_PROJECT_MUTATION } from 'GraphQl/Mutations/mutations'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { store } from 'state/store'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; -import { ToastContainer } from 'react-toastify'; - -const successfulMutationMock = [ - { - request: { - query: UPDATE_EVENT_PROJECT_MUTATION, - variables: { - title: 'NewTitle', - description: 'NewDescription', - id: '123', - }, - }, - result: { - data: { - updateEventProject: { - _id: '123', - }, - }, - }, - }, -]; - -const unsuccessfulMutationMock = [ - { - request: { - query: UPDATE_EVENT_PROJECT_MUTATION, - variables: { - title: 'NewTitle', - description: 'NewDescription', - id: '123', - }, - }, - error: new Error('Oops'), - }, -]; - -describe('Testing Update Event Project Modal', () => { - const props = { - show: true, - project: { - title: 'OldTitle', - description: 'OldDescription', - _id: '123', - }, - handleClose: jest.fn(), - refetchData: jest.fn(), - }; - - test('The modal should be rendered, the default text should be added from the props and update button should not work with blank values', async () => { - const { queryByText, queryByLabelText } = render( - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByText('Update Event Project')).toBeInTheDocument() - ); - - // Check for already populated values - await waitFor(() => - expect(queryByLabelText('Title')).toHaveValue('OldTitle') - ); - await waitFor(() => - expect(queryByLabelText('Description')).toHaveValue('OldDescription') - ); - - // Update the values to blank ones - // Type in the title and the description of the event project - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: '' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: '' }, - }); - - fireEvent.click(queryByText('Update Details') as Element); - - // Check for blank entry warning modals - await waitFor(() => - expect(queryByText('Title cannot be empty!')).toBeInTheDocument() - ); - await waitFor(() => - expect(queryByText('Description cannot be empty!')).toBeInTheDocument() - ); - - // Set the title and the description of the event project to new values - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: 'NewTitle' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: 'NewDescription' }, - }); - - fireEvent.click(queryByText('Update Details') as Element); - - await waitFor(() => - expect(queryByText('Updating the project...')).toBeInTheDocument() - ); - - await waitFor(() => - expect( - queryByText('Updated the project successfully!') - ).toBeInTheDocument() - ); - }); - - test('The modal should be rendered and error message should be shown if mutation fails', async () => { - const { queryByText, queryByLabelText } = render( - - - - - - - - - - - ); - - // Type in the title and the description of the event project - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: 'NewTitle' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: 'NewDescription' }, - }); - - fireEvent.click(queryByText('Update Details') as Element); - - await waitFor(() => - expect( - queryByText('There was an error in updating the project details!') - ).toBeInTheDocument() - ); - }); -}); diff --git a/src/components/EventProjectModals/UpdateEventProjectModal.tsx b/src/components/EventProjectModals/UpdateEventProjectModal.tsx deleted file mode 100644 index 08ac230c69..0000000000 --- a/src/components/EventProjectModals/UpdateEventProjectModal.tsx +++ /dev/null @@ -1,103 +0,0 @@ -import React, { useEffect, useState } from 'react'; -import { Modal, Button, Form } from 'react-bootstrap'; -import { toast } from 'react-toastify'; -import { useMutation } from '@apollo/client'; -import { UPDATE_EVENT_PROJECT_MUTATION } from 'GraphQl/Mutations/mutations'; - -type ModalPropType = { - show: boolean; - project: { - _id: string; - title: string; - description: string; - }; - handleClose: () => void; - refetchData: () => void; -}; - -export const UpdateEventProjectModal = (props: ModalPropType): JSX.Element => { - const [title, setTitle] = useState(''); - const [description, setDescription] = useState(''); - - useEffect(() => { - setTitle(props.project.title); - setDescription(props.project.description); - }, [props.project]); - - const [updateMutation] = useMutation(UPDATE_EVENT_PROJECT_MUTATION); - 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) { - toast.error('Title cannot be empty!'); - toSubmit = false; - } - if (description.trim().length == 0) { - toast.error('Description cannot be empty!'); - toSubmit = false; - } - if (!toSubmit) return Promise.reject(); - await updateMutation({ - variables: { - id: props.project._id, - title, - description, - }, - }); - props.refetchData(); - props.handleClose(); - }; - - return ( - <> - - - Update Event Project - -
- - - Title - setTitle(e.target.value)} - /> - - - - Description - setDescription(e.target.value)} - /> - - - - - -
- - - ); -}; diff --git a/src/components/IconComponent/IconComponent.test.tsx b/src/components/IconComponent/IconComponent.test.tsx index a66866b2ad..9fd960a540 100644 --- a/src/components/IconComponent/IconComponent.test.tsx +++ b/src/components/IconComponent/IconComponent.test.tsx @@ -35,10 +35,6 @@ const screenTestIdMap: Record> = { name: 'My Organizations', testId: 'Icon-Component-MyOrganizationsIcon', }, - EventProject: { - name: 'Add Event Project', - testId: 'Icon-Component-Add-Event-Project', - }, ListEventRegistrant: { name: 'List Event Registrants', testId: 'Icon-Component-List-Event-Registrants', diff --git a/src/components/IconComponent/IconComponent.tsx b/src/components/IconComponent/IconComponent.tsx index 891b08d9ee..3444fa5832 100644 --- a/src/components/IconComponent/IconComponent.tsx +++ b/src/components/IconComponent/IconComponent.tsx @@ -8,7 +8,6 @@ import { ReactComponent as PeopleIcon } from 'assets/svgs/people.svg'; import { ReactComponent as PluginsIcon } from 'assets/svgs/plugins.svg'; import { ReactComponent as PostsIcon } from 'assets/svgs/posts.svg'; import { ReactComponent as SettingsIcon } from 'assets/svgs/settings.svg'; -import { ReactComponent as AddEventProjectIcon } from 'assets/svgs/addEventProject.svg'; import { ReactComponent as ListEventRegistrantsIcon } from 'assets/svgs/listEventRegistrants.svg'; import { ReactComponent as CheckInRegistrantsIcon } from 'assets/svgs/checkInRegistrants.svg'; import { ReactComponent as EventStatsIcon } from 'assets/svgs/eventStats.svg'; @@ -60,13 +59,6 @@ const iconComponent = (props: InterfaceIconComponent): JSX.Element => { data-testid="Icon-Component-SettingsIcon" /> ); - case 'Add Event Project': - return ( - - ); case 'List Event Registrants': return ( { ); }); - test('Add Event Project button and profile page button should work properly', async () => { + test('Add Event profile page button should work properly', async () => { localStorage.setItem('UserType', 'SUPERADMIN'); const { queryByText, queryByTestId } = render( @@ -140,9 +138,6 @@ describe('Testing Left Drawer component for the Event Dashboard', () => { expect(queryByText('Talawa Admin Portal')).toBeInTheDocument() ); - fireEvent.click(queryByText('Add an Event Project') as HTMLElement); - expect(props.setShowAddEventProjectModal).toHaveBeenCalled(); - fireEvent.click(queryByTestId(/profileBtn/i) as HTMLElement); }); diff --git a/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx b/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx index ca941ce860..26b36b4882 100644 --- a/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx +++ b/src/components/LeftDrawerEvent/LeftDrawerEvent.tsx @@ -23,13 +23,11 @@ export interface InterfaceLeftDrawerProps { }; hideDrawer: boolean | null; setHideDrawer: React.Dispatch>; - setShowAddEventProjectModal: React.Dispatch>; } const leftDrawerEvent = ({ event, hideDrawer, - setShowAddEventProjectModal, }: InterfaceLeftDrawerProps): JSX.Element => { const [revokeRefreshToken] = useMutation(REVOKE_REFRESH_TOKEN); const userType = localStorage.getItem('UserType'); @@ -92,22 +90,6 @@ const leftDrawerEvent = ({ {/* Options List */}
Event Options
- >; children: React.ReactNode; } diff --git a/src/components/TaskListItem/TaskListItem.test.tsx b/src/components/TaskListItem/TaskListItem.test.tsx deleted file mode 100644 index 9047f72541..0000000000 --- a/src/components/TaskListItem/TaskListItem.test.tsx +++ /dev/null @@ -1,130 +0,0 @@ -import React from 'react'; -import { fireEvent, render, waitFor } from '@testing-library/react'; -import { TaskListItem } from './TaskListItem'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { store } from 'state/store'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; -import { ToastContainer } from 'react-toastify'; -import { MockedProvider } from '@apollo/react-testing'; -import { LocalizationProvider } from '@mui/x-date-pickers'; -import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; - -describe('Testing Delete Event Project Modal', () => { - const props = { - organization: { - _id: '123', - members: [ - { - _id: 'abc1', - firstName: 'John', - lastName: 'Doe', - }, - { - _id: 'abc2', - firstName: 'John2', - lastName: 'Doe2', - }, - ], - }, - task: { - _id: 'xyz1', - title: 'Task 1', - deadline: '22/04/2025', - description: 'Task description', - completed: false, - volunteers: [], - }, - refetchData: jest.fn(), - }; - - test('The modal should be rendered and data should be displayed correctly', async () => { - const { queryByText, queryByRole } = render( - - - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByText(props.task.title)).toBeInTheDocument() - ); - - await waitFor(() => - expect(queryByText(props.task.description)).toBeInTheDocument() - ); - - // Open the Update Task Modal - fireEvent.click(queryByText('View') as Element); - - await waitFor(() => - expect(queryByText('Update the Event Task')).toBeInTheDocument() - ); - - // Close the Update Task Modal - fireEvent.click(queryByRole('button', { name: /close/i }) as HTMLElement); - - await waitFor(() => - expect(queryByText('Update the Event Task')).not.toBeInTheDocument() - ); - }); - - test('The task should have the right when it is not completed', async () => { - const { queryByTestId } = render( - - - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByTestId('AssignmentIcon')).toBeInTheDocument() - ); - await waitFor(() => - expect(queryByTestId('AssignmentTurnedInIcon')).not.toBeInTheDocument() - ); - }); - - test('The task should have the right when it is completed', async () => { - props.task.completed = true; - - const { queryByTestId } = render( - - - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByTestId('AssignmentIcon')).not.toBeInTheDocument() - ); - await waitFor(() => - expect(queryByTestId('AssignmentTurnedInIcon')).toBeInTheDocument() - ); - }); -}); diff --git a/src/components/TaskListItem/TaskListItem.tsx b/src/components/TaskListItem/TaskListItem.tsx deleted file mode 100644 index 5840ca136f..0000000000 --- a/src/components/TaskListItem/TaskListItem.tsx +++ /dev/null @@ -1,106 +0,0 @@ -import React, { useState } from 'react'; -import ListItem from '@mui/material/ListItem'; -import Divider from '@mui/material/Divider'; -import ListItemText from '@mui/material/ListItemText'; -import Chip from '@mui/material/Chip'; -import Typography from '@mui/material/Typography'; -import ListItemAvatar from '@mui/material/ListItemAvatar'; -import Avatar from '@mui/material/Avatar'; -import EditOutlinedIcon from '@mui/icons-material/EditOutlined'; -import { common } from '@mui/material/colors'; -import AssignmentIcon from '@mui/icons-material/Assignment'; -import AssignmentTurnedInIcon from '@mui/icons-material/AssignmentTurnedIn'; -import { UpdateTaskModal } from 'components/TaskModals/UpdateTaskModal'; - -interface InterfaceUser { - _id: string; - firstName: string; - lastName: string; -} -interface InterfaceTask { - _id: string; - title: string; - deadline: string; - description: string; - completed: boolean; - volunteers: InterfaceUser[]; -} - -type PropType = { - task: InterfaceTask; - refetchData: () => void; - organization: { - _id: string; - members: InterfaceUser[]; - }; -}; - -export const TaskListItem = ({ - task, - refetchData, - organization: organizationData, -}: PropType): JSX.Element => { - const [showUpdateTaskModal, setShowUpdateTaskModal] = useState(false); - - return ( - <> -
- - - - {' '} - {task.completed ? ( - - ) : ( - - )} - - - - - {task.description} - - - } - /> - } - label="View" - variant="outlined" - onClick={(): void => { - setShowUpdateTaskModal(true); - }} - /> - - -
- {/* Wrapper Div for all the relevant modals */} - { - setShowUpdateTaskModal(false); - }} - task={task} - refetchData={refetchData} - organization={organizationData} - /> -
-
- - ); -}; diff --git a/src/components/TaskModals/AddTaskModal.test.tsx b/src/components/TaskModals/AddTaskModal.test.tsx deleted file mode 100644 index ca7aa895ac..0000000000 --- a/src/components/TaskModals/AddTaskModal.test.tsx +++ /dev/null @@ -1,150 +0,0 @@ -import React from 'react'; -import { fireEvent, render, waitFor } from '@testing-library/react'; -import { MockedProvider } from '@apollo/react-testing'; -import { AddTaskModal } from './AddTaskModal'; -import { ADD_EVENT_PROJECT_TASK_MUTATION } from 'GraphQl/Mutations/mutations'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { store } from 'state/store'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; -import { ToastContainer } from 'react-toastify'; -import dayjs from 'dayjs'; -import { LocalizationProvider } from '@mui/x-date-pickers'; -import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; - -const today = dayjs(new Date()); -const taskDatetime = today.add(7, 'days'); - -const successfulMutationMock = [ - { - request: { - query: ADD_EVENT_PROJECT_TASK_MUTATION, - variables: { - title: 'Title', - description: 'Description', - projectId: '123', - deadline: null, - }, - }, - result: { - data: { - createTask: { - _id: '456', - }, - }, - }, - }, -]; - -const unsuccessfulMutationMock = [ - { - request: { - query: ADD_EVENT_PROJECT_TASK_MUTATION, - variables: { - title: 'Title', - description: 'Description', - projectId: '123', - deadline: taskDatetime, - }, - }, - error: new Error('Oops'), - }, -]; - -describe('Testing Add Event Task Modal', () => { - const props = { - show: true, - projectId: '123', - handleClose: jest.fn(), - refetchData: jest.fn(), - }; - - test('The modal should be rendered and add button should not work with blank values', async () => { - const { queryByText, queryByLabelText } = render( - - - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByText('Add an Event Task')).toBeInTheDocument() - ); - - fireEvent.click(queryByText('Create Task') as Element); - - // Check for blank entry warning modals - await waitFor(() => - expect(queryByText('Title cannot be empty!')).toBeInTheDocument() - ); - await waitFor(() => - expect(queryByText('Description cannot be empty!')).toBeInTheDocument() - ); - - // Type in the title and the description of the event project - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: 'Title' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: 'Description' }, - }); - fireEvent.change(queryByLabelText('Deadline') as Element, { - target: { value: taskDatetime }, - }); - - fireEvent.click(queryByText('Create Task') as Element); - - await waitFor(() => - expect(queryByText('Adding the task...')).toBeInTheDocument() - ); - - await waitFor(() => - expect(queryByText('Added the task successfully!')).toBeInTheDocument() - ); - }); - - test('The modal should be rendered and error message should be shown if mutation fails', async () => { - const { queryByText, queryByLabelText } = render( - - - - - - - - - - - - - ); - - // Type in the title and the description of the event project - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: 'Title' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: 'Description' }, - }); - fireEvent.change(queryByLabelText('Deadline') as Element, { - target: { value: taskDatetime }, - }); - - fireEvent.click(queryByText('Create Task') as Element); - - await waitFor(() => - expect( - queryByText('There was an error in adding the task!') - ).toBeInTheDocument() - ); - }); -}); diff --git a/src/components/TaskModals/AddTaskModal.tsx b/src/components/TaskModals/AddTaskModal.tsx deleted file mode 100644 index 0134077afe..0000000000 --- a/src/components/TaskModals/AddTaskModal.tsx +++ /dev/null @@ -1,114 +0,0 @@ -import React, { useState } from 'react'; -import { Modal, Button, Form } from 'react-bootstrap'; -import { toast } from 'react-toastify'; -import { useMutation } from '@apollo/client'; -import type { Dayjs } from 'dayjs'; -import dayjs from 'dayjs'; -import { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker'; -import { ADD_EVENT_PROJECT_TASK_MUTATION } from 'GraphQl/Mutations/mutations'; - -type ModalPropType = { - show: boolean; - projectId: string; - handleClose: () => void; - refetchData: () => void; -}; - -export const AddTaskModal = ({ - show, - handleClose, - refetchData, - projectId, -}: ModalPropType): JSX.Element => { - const today = dayjs(new Date()); - - const [title, setTitle] = useState(''); - const [description, setDescription] = useState(''); - const [deadline, setDeadline] = useState(today); - - const [addMutation] = useMutation(ADD_EVENT_PROJECT_TASK_MUTATION); - 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) { - toast.error('Title cannot be empty!'); - toSubmit = false; - } - if (description.trim().length == 0) { - toast.error('Description cannot be empty!'); - toSubmit = false; - } - if (!toSubmit) return Promise.reject(); - await addMutation({ - variables: { - title, - description, - projectId, - deadline, - }, - }); - refetchData(); - setTitle(''); - setDescription(''); - handleClose(); - }; - - return ( - <> - - - Add an Event Task - -
- - - Title - setTitle(e.target.value)} - /> - - - - Description - setDescription(e.target.value)} - /> - - - - { - setDeadline(date); - }} - disablePast - /> - - - - - -
- - - ); -}; diff --git a/src/components/TaskModals/DeleteTaskModal.test.tsx b/src/components/TaskModals/DeleteTaskModal.test.tsx deleted file mode 100644 index 4eb40e53a8..0000000000 --- a/src/components/TaskModals/DeleteTaskModal.test.tsx +++ /dev/null @@ -1,100 +0,0 @@ -import React from 'react'; -import { fireEvent, render, waitFor } from '@testing-library/react'; -import { MockedProvider } from '@apollo/react-testing'; -import { DeleteTaskModal } from './DeleteTaskModal'; -import { DELETE_EVENT_TASK_MUTATION } from 'GraphQl/Mutations/mutations'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { store } from 'state/store'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; -import { ToastContainer } from 'react-toastify'; - -const successfulMutationMock = [ - { - request: { - query: DELETE_EVENT_TASK_MUTATION, - variables: { id: '123' }, - }, - result: { - data: { - removeTask: { - _id: '123', - }, - }, - }, - }, -]; - -const unsuccessfulMutationMock = [ - { - request: { - query: DELETE_EVENT_TASK_MUTATION, - variables: { - id: '123', - }, - }, - error: new Error('Oops'), - }, -]; - -describe('Testing Delete Event Project Modal', () => { - const props = { - show: true, - taskId: '123', - handleClose: jest.fn(), - refetchData: jest.fn(), - }; - - test('The modal should be rendered and delete button should work', async () => { - const { queryByText } = render( - - - - - - - - - - - ); - - await waitFor(() => expect(queryByText('Delete Task')).toBeInTheDocument()); - - fireEvent.click(queryByText('Delete') as Element); - await waitFor(() => - expect(queryByText('Deleting the task...')).toBeInTheDocument() - ); - await waitFor(() => - expect(queryByText('Deleted the task successfully!')).toBeInTheDocument() - ); - }); - - test('The modal should be rendered and error message should be shown if mutation fails', async () => { - const { queryByText } = render( - - - - - - - - - - - ); - - await waitFor(() => expect(queryByText('Delete Task')).toBeInTheDocument()); - - fireEvent.click(queryByText('Delete') as Element); - await waitFor(() => - expect(queryByText('Deleting the task...')).toBeInTheDocument() - ); - await waitFor(() => - expect( - queryByText('There was an error in deleting the task!') - ).toBeInTheDocument() - ); - }); -}); diff --git a/src/components/TaskModals/DeleteTaskModal.tsx b/src/components/TaskModals/DeleteTaskModal.tsx deleted file mode 100644 index 73baff5775..0000000000 --- a/src/components/TaskModals/DeleteTaskModal.tsx +++ /dev/null @@ -1,64 +0,0 @@ -import React from 'react'; -import { Modal, Button } from 'react-bootstrap'; -import { toast } from 'react-toastify'; -import { useMutation } from '@apollo/client'; -import { DELETE_EVENT_TASK_MUTATION } from 'GraphQl/Mutations/mutations'; - -type ModalPropType = { - show: boolean; - taskId: string; - handleClose: () => void; - refetchData: () => void; -}; - -export const DeleteTaskModal = (props: ModalPropType): JSX.Element => { - const [deleteMutation] = useMutation(DELETE_EVENT_TASK_MUTATION); - 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, - }, - }); - props.refetchData(); - props.handleClose(); - }; - - return ( - <> - - - Delete Task - - -
- Are you sure you want to delete this? -
- - - - - - - - ); -}; diff --git a/src/components/TaskModals/ManageVolunteerModal.test.tsx b/src/components/TaskModals/ManageVolunteerModal.test.tsx deleted file mode 100644 index e284984969..0000000000 --- a/src/components/TaskModals/ManageVolunteerModal.test.tsx +++ /dev/null @@ -1,135 +0,0 @@ -import React from 'react'; -import { fireEvent, render, waitFor } from '@testing-library/react'; -import { MockedProvider } from '@apollo/react-testing'; -import { ManageVolunteerModal } from './ManageVolunteerModal'; -import { SET_TASK_VOLUNTEERS_MUTATION } from 'GraphQl/Mutations/mutations'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { store } from 'state/store'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; -import { ToastContainer } from 'react-toastify'; -import { LocalizationProvider } from '@mui/x-date-pickers'; -import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; - -const successfulMutationMock = [ - { - request: { - query: SET_TASK_VOLUNTEERS_MUTATION, - variables: { - id: '123', - volunteers: ['user1'], - }, - }, - result: { - data: { - setTaskVolunteers: { - _id: '456', - }, - }, - }, - }, -]; - -const unsuccessfulMutationMock = [ - { - request: { - query: SET_TASK_VOLUNTEERS_MUTATION, - variables: { - id: '123', - volunteers: [], - }, - }, - error: new Error('Oops'), - }, -]; - -describe('Testing Manage Volunteers Modal', () => { - const props = { - show: true, - taskId: '123', - organization: { - _id: 'testorg', - members: [ - { _id: 'user1', firstName: 'John1', lastName: 'Doe1' }, - { _id: 'user2', firstName: 'John2', lastName: 'Doe2' }, - { _id: 'user3', firstName: 'John3', lastName: 'Doe3' }, - ], - }, - volunteers: [], - handleClose: jest.fn(), - refetchData: jest.fn(), - }; - - test('The modal should be rendered and update button should work properly', async () => { - const { queryByText, queryByLabelText } = render( - - - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByText('Manage Volunteers')).toBeInTheDocument() - ); - - // Fill out the autocomplete with volunteer information - const volunteerInput = queryByLabelText('Assign Volunteers'); - expect(volunteerInput).toBeInTheDocument(); - - fireEvent.change(volunteerInput as Element, { - target: { value: 'John1 Doe1' }, - }); - fireEvent.keyDown(volunteerInput as HTMLElement, { key: 'Enter' }); - - // Click the update button - fireEvent.click(queryByText('Update Volunteers') as Element); - - await waitFor(() => - expect(queryByText('Updating the volunteers...')).toBeInTheDocument() - ); - - await waitFor(() => - expect( - queryByText('Successfully updated the volunteers!') - ).toBeInTheDocument() - ); - }); - - test('The modal should be rendered and error message should be shown if mutation fails', async () => { - const { queryByText } = render( - - - - - - - - - - - - - ); - - fireEvent.click(queryByText('Update Volunteers') as Element); - - await waitFor(() => - expect(queryByText('Updating the volunteers...')).toBeInTheDocument() - ); - - await waitFor(() => - expect( - queryByText('There was an error in updating the volunteers!') - ).toBeInTheDocument() - ); - }); -}); diff --git a/src/components/TaskModals/ManageVolunteerModal.tsx b/src/components/TaskModals/ManageVolunteerModal.tsx deleted file mode 100644 index dd474d4757..0000000000 --- a/src/components/TaskModals/ManageVolunteerModal.tsx +++ /dev/null @@ -1,101 +0,0 @@ -import React, { useEffect, useState } from 'react'; -import { Modal, Button } from 'react-bootstrap'; -import Autocomplete from '@mui/material/Autocomplete'; -import TextField from '@mui/material/TextField'; -import Stack from '@mui/material/Stack'; -import { useMutation } from '@apollo/client'; -import { SET_TASK_VOLUNTEERS_MUTATION } from 'GraphQl/Mutations/mutations'; -import { toast } from 'react-toastify'; - -interface InterfaceUser { - _id: string; - firstName: string; - lastName: string; -} - -type ModalPropType = { - show: boolean; - taskId: string; - organization: { - _id: string; - members: InterfaceUser[]; - }; - volunteers: InterfaceUser[]; - handleClose: () => void; - refetchData: () => void; -}; - -export const ManageVolunteerModal = (props: ModalPropType): JSX.Element => { - const [volunteers, setVolunteers] = useState([]); - - useEffect(() => setVolunteers(props.volunteers), [props.volunteers]); - - const [setMutation] = useMutation(SET_TASK_VOLUNTEERS_MUTATION); - 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), - }, - }); - props.refetchData(); - props.handleClose(); - }; - - return ( - <> - - - Manage Volunteers - - -

- All the members of the organization of the event can be added as - volunteers for a task. -

- - - `${memberOption.firstName} ${memberOption.lastName}` - } - filterSelectedOptions={true} - onChange={(_, value): void => { - setVolunteers(value); - }} - autoHighlight={true} - renderInput={(params): React.ReactNode => ( - - )} - /> - -
- - - - - - - ); -}; diff --git a/src/components/TaskModals/UpdateTaskModal.test.tsx b/src/components/TaskModals/UpdateTaskModal.test.tsx deleted file mode 100644 index 9541d6d26b..0000000000 --- a/src/components/TaskModals/UpdateTaskModal.test.tsx +++ /dev/null @@ -1,262 +0,0 @@ -import React from 'react'; -import { fireEvent, render, waitFor } from '@testing-library/react'; -import { MockedProvider } from '@apollo/react-testing'; -import { UpdateTaskModal } from './UpdateTaskModal'; -import { UPDATE_EVENT_PROJECT_TASK_MUTATION } from 'GraphQl/Mutations/mutations'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { store } from 'state/store'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; -import { ToastContainer } from 'react-toastify'; -import dayjs from 'dayjs'; -import { LocalizationProvider } from '@mui/x-date-pickers'; -import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; -import type { ModalPropType } from './UpdateTaskModal'; - -const today = dayjs(new Date()); -const oldDeadline = today.add(7, 'days'); -const newDeadline = today.add(10, 'days'); - -const successfulMutationMock = [ - { - request: { - query: UPDATE_EVENT_PROJECT_TASK_MUTATION, - variables: { - title: 'Title', - description: 'Description', - taskId: 'task1', - completed: true, - deadline: null, - }, - }, - result: { - data: { - updateTask: { - _id: '456', - }, - }, - }, - }, -]; - -const unsuccessfulMutationMock = [ - { - request: { - query: UPDATE_EVENT_PROJECT_TASK_MUTATION, - variables: { - title: 'Title', - description: 'Description', - taskId: 'task1', - completed: true, - deadline: null, - }, - }, - error: new Error('Oops'), - }, -]; - -describe('Testing Update Event Task Modal', () => { - const props = { - show: true, - task: { - _id: 'task1', - title: 'Task 1', - description: 'Description 1', - deadline: oldDeadline.toString(), - completed: false, - volunteers: [], - }, - organization: { - _id: 'org1', - members: [], - }, - handleClose: jest.fn(), - refetchData: jest.fn(), - }; - - test('The modal should be rendered and update button should not work with blank values', async () => { - const { queryByText, queryByLabelText } = render( - - - - - - - - - - - - - ); - - await waitFor(() => - expect(queryByText('Update the Event Task')).toBeInTheDocument() - ); - - // Set the title and the description of the event task to blank - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: '' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: '' }, - }); - - fireEvent.click(queryByText('Update Task') as Element); - - // Check for blank entry warning modals - await waitFor(() => - expect(queryByText('Title cannot be empty!')).toBeInTheDocument() - ); - await waitFor(() => - expect(queryByText('Description cannot be empty!')).toBeInTheDocument() - ); - - // Type in the title and the description of the event task - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: 'Title' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: 'Description' }, - }); - fireEvent.change(queryByLabelText('Deadline') as Element, { - target: { value: newDeadline }, - }); - fireEvent.click(queryByLabelText('Completed') as Element); - - // Click the update button - fireEvent.click(queryByText('Update Task') as Element); - - await waitFor(() => - expect(queryByText('Updating the task...')).toBeInTheDocument() - ); - - await waitFor(() => - expect(queryByText('Updated the task successfully!')).toBeInTheDocument() - ); - }); - - test('The modal should show message when there are no volunteers', async () => { - const { queryByText } = render( - - - - - - - - - - - - - ); - - await waitFor(() => - expect( - queryByText('There are no volunteers assigned for this task.') - ).toBeInTheDocument() - ); - }); - - test('The modal should not show message when there are no volunteers', async () => { - const customProps: ModalPropType = { ...props }; - customProps.task.volunteers = [ - { - _id: 'user1', - firstName: 'John', - lastName: 'Doe', - }, - ]; - - const { queryByText } = render( - - - - - - - - - - - - - ); - - await waitFor(() => - expect( - queryByText('There are no volunteers assigned for this task.') - ).not.toBeInTheDocument() - ); - - await waitFor(() => expect(queryByText('John Doe')).toBeInTheDocument()); - }); - - test('The modal should be rendered and error message should be shown if mutation fails', async () => { - const { queryByText, queryByLabelText } = render( - - - - - - - - - - - - - ); - - // Type in the title and the description of the event project - fireEvent.change(queryByLabelText('Title') as Element, { - target: { value: 'Title' }, - }); - fireEvent.change(queryByLabelText('Description') as Element, { - target: { value: 'Description' }, - }); - fireEvent.change(queryByLabelText('Deadline') as Element, { - target: { value: newDeadline }, - }); - fireEvent.click(queryByLabelText('Completed') as Element); - - fireEvent.click(queryByText('Update Task') as Element); - - await waitFor(() => - expect( - queryByText('There was an error in updating the task!') - ).toBeInTheDocument() - ); - }); - - test('Manage volunteer modal and delete task modal should open and close properly', async () => { - const { queryByText, queryAllByRole } = render( - - - - - - - - - - - - - ); - - // Manage Volunteer Modal - fireEvent.click(queryByText('Manage Volunteers') as Element); - queryAllByRole('button', { name: /close/i }).forEach((ele) => - fireEvent.click(ele as HTMLElement) - ); - - // Delete Task Modal - fireEvent.click(queryByText('Delete Task') as Element); - queryAllByRole('button', { name: /close/i }).forEach((ele) => - fireEvent.click(ele as HTMLElement) - ); - }); -}); diff --git a/src/components/TaskModals/UpdateTaskModal.tsx b/src/components/TaskModals/UpdateTaskModal.tsx deleted file mode 100644 index d79dd19a36..0000000000 --- a/src/components/TaskModals/UpdateTaskModal.tsx +++ /dev/null @@ -1,222 +0,0 @@ -import React, { useEffect, useState } from 'react'; -import { Modal, Button as BootstrapButton, Form } from 'react-bootstrap'; -import { toast } from 'react-toastify'; -import { useMutation } from '@apollo/client'; -import type { Dayjs } from 'dayjs'; -import dayjs from 'dayjs'; -import { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker'; -import { UPDATE_EVENT_PROJECT_TASK_MUTATION } from 'GraphQl/Mutations/mutations'; -import { DeleteTaskModal } from './DeleteTaskModal'; -import { ManageVolunteerModal } from './ManageVolunteerModal'; -import Chip from '@mui/material/Chip'; -import Stack from '@mui/material/Stack'; -import Avatar from '@mui/material/Avatar'; -import ModeEditIcon from '@mui/icons-material/ModeEdit'; -import Button from '@mui/material/Button'; - -interface InterfaceUser { - _id: string; - firstName: string; - lastName: string; -} -interface InterfaceTask { - _id: string; - title: string; - deadline: string; - description: string; - completed: boolean; - volunteers: InterfaceUser[]; -} - -export type ModalPropType = { - show: boolean; - task: InterfaceTask; - organization: { - _id: string; - members: InterfaceUser[]; - }; - handleClose: () => void; - refetchData: () => void; -}; - -export const UpdateTaskModal = (props: ModalPropType): JSX.Element => { - const [title, setTitle] = useState(''); - const [description, setDescription] = useState(''); - const [deadline, setDeadline] = useState(null); - const [completed, setCompleted] = useState(false); - - const [showDeleteTaskModal, setShowDeleteTaskModal] = useState(false); - const [showManageVolunteerModal, setShowManageVolunteerModal] = - useState(false); - - useEffect(() => { - setTitle(props.task.title); - setDescription(props.task.description); - setDeadline(dayjs(props.task.deadline)); - setCompleted(props.task.completed); - }, [props.task]); - - const [updateMutation] = useMutation(UPDATE_EVENT_PROJECT_TASK_MUTATION); - 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) { - toast.error('Title cannot be empty!'); - toSubmit = false; - } - if (description.trim().length == 0) { - toast.error('Description cannot be empty!'); - toSubmit = false; - } - if (!toSubmit) return Promise.reject(); - - await updateMutation({ - variables: { - taskId: props.task._id, - title, - description, - deadline, - completed, - }, - }); - props.refetchData(); - props.handleClose(); - }; - - return ( - <> - - - - Update the Event Task - - -
- - - Title - setTitle(e.target.value)} - /> - - - - Description - setDescription(e.target.value)} - /> - - - { - setDeadline(date); - }} - disablePast - className="mb-1" - /> - - - Completed - setCompleted(!completed)} - /> - - - - Volunteers -
- {!props.task.volunteers.length - ? `There are no volunteers assigned for this task.` - : null} - - {props.task.volunteers.map( - (user): React.ReactNode => ( - {`${user.firstName[0].toUpperCase()}${user.lastName[0].toUpperCase()}`} - } - label={`${user.firstName} ${user.lastName}`} - variant="outlined" - /> - ) - )} - - -
- - - - - Update Task - - { - setShowDeleteTaskModal(true); - props.handleClose(); - }} - > - Delete Task - - -
- - { - setShowDeleteTaskModal(false); - }} - /> - { - setShowManageVolunteerModal(false); - }} - volunteers={props.task.volunteers} - organization={props.organization} - taskId={props.task._id} - /> - - ); -}; diff --git a/src/components/UserPortal/OrganizationNavbar/OrganizationNavbar.tsx b/src/components/UserPortal/OrganizationNavbar/OrganizationNavbar.tsx index 47afc04c06..032d74df07 100644 --- a/src/components/UserPortal/OrganizationNavbar/OrganizationNavbar.tsx +++ b/src/components/UserPortal/OrganizationNavbar/OrganizationNavbar.tsx @@ -223,11 +223,6 @@ function organizationNavbar(props: InterfaceNavbarProps): JSX.Element { {t('settings')} - - - {t('myTasks')} - - { - await act(() => { - return new Promise((resolve) => { - setTimeout(resolve, ms); - }); - }); -} - -let props = { - id: '1', - title: 'Test Task Card', - deadline: '2023-09-28T16:25:47.000Z', - description: 'Test Description', - volunteers: [ - { - id: '1', - firstName: 'Test', - lastName: 'User', - email: 'test@user.com', - }, - ], - creator: { - id: '2', - firstName: 'Test', - lastName: 'User', - }, - event: { - id: '3', - title: 'Test Event', - organization: { - id: '1', - name: 'Test Organization', - image: '', - }, - }, - createdAt: '2023-09-21T13:24:31.217Z', - completed: false, -}; - -describe('Testing TaskCard Component [User Portal]', () => { - test('Component should be rendered properly if task.completed === false', async () => { - render( - - - - - - - - - - ); - - await wait(); - - expect(screen.queryAllByText('Test Task Card')).not.toBe([]); - }); - - test('Component should be rendered properly if task.completed === true', async () => { - props = { - ...props, - completed: true, - }; - - render( - - - - - - - - - - ); - - await wait(); - - expect(screen.queryAllByText('Test Task Card')).not.toBe([]); - }); -}); diff --git a/src/components/UserPortal/TaskCard/TaskCard.tsx b/src/components/UserPortal/TaskCard/TaskCard.tsx deleted file mode 100644 index 72b8cfd66a..0000000000 --- a/src/components/UserPortal/TaskCard/TaskCard.tsx +++ /dev/null @@ -1,131 +0,0 @@ -import React from 'react'; -import styles from './TaskCard.module.css'; -import TimerIcon from '@mui/icons-material/Timer'; -import DescriptionIcon from '@mui/icons-material/Description'; -import AssignmentIndIcon from '@mui/icons-material/AssignmentInd'; -import CreateIcon from '@mui/icons-material/Create'; -import EventIcon from '@mui/icons-material/Event'; -import CorporateFareIcon from '@mui/icons-material/CorporateFare'; -import { Badge } from 'react-bootstrap'; -import { Tooltip } from '@mui/material'; -import dayjs from 'dayjs'; -import { useTranslation } from 'react-i18next'; - -interface InterfaceTaskCardProps { - id: string; - title: string; - deadline: string; - description: string; - volunteers: { - id: string; - firstName: string; - lastName: string; - email: string; - }[]; - creator: { - id: string; - firstName: string; - lastName: string; - }; - event: { - id: string; - title: string; - organization: { - id: string; - name: string; - image: string | null; - }; - }; - createdAt: string; - completed: boolean; -} - -function taskCard(props: InterfaceTaskCardProps): JSX.Element { - const { t } = useTranslation('translation', { - keyPrefix: 'userTaskCard', - }); - - const creatorName = `${props.creator.firstName} ${props.creator.lastName}`; - - return ( -
-
-
- {props.title} -
- -
- - - {' '} - {props.event.title} -
- -
- - - {' '} - {props.event.organization.name} -
- -
- - - {' '} - {props.description} -
- -
- - - {' '} - {dayjs(props.deadline).format('llll')} -
- -
- - - {' '} - {`${dayjs(props.createdAt).format('llll')} by ${creatorName}`} -
- -
- - - - {props.volunteers.map((volunteer: any, index) => { - const name = `${volunteer.firstName} ${volunteer.lastName}`; - - return ( - - {name} - - ); - })} -
- - {props.completed ? ( - - - {t('completed')} - - - ) : ( - - - {t('incomplete')} - - - )} -
-
- ); -} - -export default taskCard; diff --git a/src/components/UserPortal/UserNavbar/UserNavbar.test.tsx b/src/components/UserPortal/UserNavbar/UserNavbar.test.tsx index 841a858839..cd85417d56 100644 --- a/src/components/UserPortal/UserNavbar/UserNavbar.test.tsx +++ b/src/components/UserPortal/UserNavbar/UserNavbar.test.tsx @@ -192,7 +192,6 @@ describe('Testing UserNavbar Component [User Portal]', () => { userEvent.click(screen.getByTestId('logoutDropdown')); expect(screen.getByText('Settings')).toBeInTheDocument(); - expect(screen.getByText('My Tasks')).toBeInTheDocument(); expect(screen.getByTestId('logoutBtn')).toBeInTheDocument(); }); @@ -215,24 +214,4 @@ describe('Testing UserNavbar Component [User Portal]', () => { userEvent.click(screen.getByText('Settings')); expect(window.location.pathname).toBe('/user/settings'); }); - - test('User can navigate to the "My Tasks" page', async () => { - render( - - - - - - - - - - ); - - await wait(); - - userEvent.click(screen.getByTestId('logoutDropdown')); - userEvent.click(screen.getByText('My Tasks')); - expect(window.location.pathname).toBe('/user/tasks'); - }); }); diff --git a/src/components/UserPortal/UserNavbar/UserNavbar.tsx b/src/components/UserPortal/UserNavbar/UserNavbar.tsx index 04f4bd50fb..f0e0951a24 100644 --- a/src/components/UserPortal/UserNavbar/UserNavbar.tsx +++ b/src/components/UserPortal/UserNavbar/UserNavbar.tsx @@ -97,21 +97,12 @@ function userNavbar(): JSX.Element { {userName} - history.push('/user/settings')} className={styles.link} > {t('settings')} - - history.push('/user/tasks')} - className={styles.link} - > - {t('myTasks')} - - {t('logout')} diff --git a/src/screens/EventDashboard/EventDashboard.mocks.ts b/src/screens/EventDashboard/EventDashboard.mocks.ts index 3a3d8d0197..59a3440d8b 100644 --- a/src/screens/EventDashboard/EventDashboard.mocks.ts +++ b/src/screens/EventDashboard/EventDashboard.mocks.ts @@ -59,7 +59,6 @@ const constantMocks = [ members: [], }, attendees: [], - projects: [], }, }, }, @@ -92,7 +91,6 @@ export const queryMockWithTime = [ members: [{ _id: 'user1', firstName: 'John', lastName: 'Doe' }], }, attendees: [{ _id: 'user1' }], - projects: [], }, }, }, @@ -126,98 +124,6 @@ export const queryMockWithoutTime = [ members: [{ _id: 'user1', firstName: 'John', lastName: 'Doe' }], }, attendees: [{ _id: 'user1' }], - projects: [], - }, - }, - }, - }, - ...constantMocks, -]; - -// Mock 3 -export const queryMockWithProject = [ - { - request: { - query: EVENT_DETAILS, - variables: { - id: 'event123', - }, - }, - result: { - data: { - event: { - _id: 'event123', - title: 'Event Title', - description: 'Event Description', - startDate: '1/1/23', - endDate: '2/2/23', - startTime: '08:00:00', - endTime: '09:00:00', - allDay: false, - location: 'India', - organization: { - _id: 'org1', - members: [{ _id: 'user1', firstName: 'John', lastName: 'Doe' }], - }, - attendees: [{ _id: 'user1' }], - projects: [ - { - _id: 'project1', - title: 'Project 1', - description: 'Project Description 1', - tasks: [], - }, - ], - }, - }, - }, - }, - ...constantMocks, -]; - -// Mock 4 -export const queryMockWithProjectAndTask = [ - { - request: { - query: EVENT_DETAILS, - variables: { - id: 'event123', - }, - }, - result: { - data: { - event: { - _id: 'event123', - title: 'Event Title', - description: 'Event Description', - startDate: '1/1/23', - endDate: '2/2/23', - startTime: '08:00:00', - endTime: '09:00:00', - allDay: false, - location: 'India', - organization: { - _id: 'org1', - members: [{ _id: 'user1', firstName: 'John', lastName: 'Doe' }], - }, - attendees: [{ _id: 'user1' }], - projects: [ - { - _id: 'project1', - title: 'Project 1', - description: 'Project Description 1', - tasks: [ - { - _id: 'task1', - title: 'Task 1', - description: 'Description 1', - deadline: '22/12/23', - completed: false, - volunteers: [], - }, - ], - }, - ], }, }, }, diff --git a/src/screens/EventDashboard/EventDashboard.test.tsx b/src/screens/EventDashboard/EventDashboard.test.tsx index b595f893eb..9c21d735e8 100644 --- a/src/screens/EventDashboard/EventDashboard.test.tsx +++ b/src/screens/EventDashboard/EventDashboard.test.tsx @@ -1,19 +1,15 @@ import React from 'react'; -import { fireEvent, render, waitFor, act } from '@testing-library/react'; +import { render, waitFor, act } from '@testing-library/react'; import EventDashboard from './EventDashboard'; import { BrowserRouter } from 'react-router-dom'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; import { ToastContainer } from 'react-toastify'; import { MockedProvider } from '@apollo/react-testing'; import { LocalizationProvider } from '@mui/x-date-pickers'; import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import { type DefaultOptions } from '@apollo/client'; import { - queryMockWithProject, queryMockWithTime, queryMockWithoutTime, - queryMockWithProjectAndTask, } from './EventDashboard.mocks'; // We want to disable all forms of caching so that we do not need to define a custom merge function in testing for the network requests @@ -81,13 +77,6 @@ describe('Testing Event Dashboard Screen', () => { await waitFor(() => expect(queryByText('India')).toBeInTheDocument()); - // Relevant message should be shown if the projects are 0 in length - await waitFor(() => - expect( - queryByText('There are no active projects for this event!') - ).toBeInTheDocument() - ); - await wait(); }); @@ -111,82 +100,4 @@ describe('Testing Event Dashboard Screen', () => { await wait(); }); - - test('The page should display event project details correctly when provided', async () => { - const { queryByText } = render( - - - - - - - - - - - ); - - await waitFor(() => expect(queryByText('Project 1')).toBeInTheDocument()); - - await waitFor(() => - expect(queryByText('Project Description 1')).toBeInTheDocument() - ); - - await wait(); - }); - - test('The modals from the page should work properly', async () => { - const { queryByRole, getByRole, queryAllByText } = render( - - - - - - - - - ); - - await waitFor(() => expect(queryAllByText('Event Title').length).toBe(2)); - - // Add Event Project Modal - await waitFor(() => - fireEvent.click( - getByRole('button', { name: 'addEventProject' }) as HTMLElement - ) - ); - - fireEvent.click(queryByRole('button', { name: /close/i }) as HTMLElement); - // Edit Event Project Modal - await waitFor(() => - fireEvent.click( - getByRole('button', { name: 'editEventProject' }) as HTMLElement - ) - ); - fireEvent.click(queryByRole('button', { name: /close/i }) as HTMLElement); - - // Delete Event Project Modal - await waitFor(() => - fireEvent.click( - getByRole('button', { name: 'deleteEventProject' }) as HTMLElement - ) - ); - fireEvent.click(queryByRole('button', { name: /close/i }) as HTMLElement); - - // Add Task Modal - await waitFor(() => - fireEvent.click(getByRole('button', { name: 'addTask' }) as HTMLElement) - ); - fireEvent.click(queryByRole('button', { name: /close/i }) as HTMLElement); - - await wait(); - }); }); diff --git a/src/screens/EventDashboard/EventDashboard.tsx b/src/screens/EventDashboard/EventDashboard.tsx index f47988a2fc..49219ddedd 100644 --- a/src/screens/EventDashboard/EventDashboard.tsx +++ b/src/screens/EventDashboard/EventDashboard.tsx @@ -2,38 +2,11 @@ import React, { useEffect, useState } from 'react'; import Row from 'react-bootstrap/Row'; import Col from 'react-bootstrap/Col'; import { useQuery } from '@apollo/client'; -import { Container } from 'react-bootstrap'; import styles from './EventDashboard.module.css'; -import { AddEventProjectModal } from 'components/EventProjectModals/AddEventProjectModal'; -import { UpdateEventProjectModal } from 'components/EventProjectModals/UpdateEventProjectModal'; -import { DeleteEventProjectModal } from 'components/EventProjectModals/DeleteEventProjectModal'; -import { AddTaskModal } from 'components/TaskModals/AddTaskModal'; import { EVENT_DETAILS } from 'GraphQl/Queries/Queries'; -import Button from 'react-bootstrap/Button'; -import List from '@mui/material/List'; -import { TaskListItem } from 'components/TaskListItem/TaskListItem'; import Loader from 'components/Loader/Loader'; import { LeftDrawerEventWrapper } from 'components/LeftDrawerEvent/LeftDrawerEventWrapper'; -interface InterfaceEventTask { - _id: string; - title: string; - description: string; - deadline: string; - completed: boolean; - volunteers: { - _id: string; - firstName: string; - lastName: string; - }[]; -} -interface InterfaceEventProject { - _id: string; - title: string; - description: string; - tasks: InterfaceEventTask[]; -} - const EventDashboard = (): JSX.Element => { // Get the Event ID from the URL document.title = 'Event Dashboard'; @@ -45,28 +18,12 @@ const EventDashboard = (): JSX.Element => { }, [window.location.href]); // Data fetching - const { - data: eventData, - loading: eventInfoLoading, - refetch: refetchEventData, - } = useQuery(EVENT_DETAILS, { - variables: { id: eventId }, - }); - - const [currentProject, setCurrentProject] = useState({ - _id: '', - title: '', - description: '', - }); - - // State management for modals - const [showAddEventProjectModal, setShowAddEventProjectModal] = - useState(false); - const [showAddTaskModal, setShowAddTaskModal] = useState(false); - const [showUpdateEventProjectModal, setShowUpdateEventProjectModal] = - useState(false); - const [showDeleteEventProjectModal, setShowDeleteEventProjectModal] = - useState(false); + const { data: eventData, loading: eventInfoLoading } = useQuery( + EVENT_DETAILS, + { + variables: { id: eventId }, + } + ); // Render the loading screen if (eventInfoLoading) { @@ -77,10 +34,9 @@ const EventDashboard = (): JSX.Element => { - +
{/* Side Bar - Static Information about the Event */} @@ -110,141 +66,7 @@ const EventDashboard = (): JSX.Element => {
- - {/* Main Screen Container */} - -
- -

Event Projects

- - - {eventData.event.projects.length == 0 - ? `There are no active projects for this event!` - : null} - {eventData.event.projects.map( - (project: InterfaceEventProject) => ( - -
-
-
-

- {project.title} -

-

- {project.description} -

-
-
-
-
Tasks
-
- -
- {!project.tasks.length - ? `There are no tasks for this project.` - : null} -
- {project.tasks.map((task) => ( - - ))} - -
- - - -
-
- - ) - )} - -
- - - - {/* Wrapper for Different Modals */} - { - setShowAddEventProjectModal(false); - }} - eventId={eventId} - refetchData={refetchEventData} - /> - - { - setShowUpdateEventProjectModal(false); - }} - refetchData={refetchEventData} - project={currentProject} - /> - - { - setShowDeleteEventProjectModal(false); - }} - refetchData={refetchEventData} - project={currentProject} - /> - - { - setShowAddTaskModal(false); - }} - refetchData={refetchEventData} - projectId={currentProject._id} - /> ); }; diff --git a/src/screens/UserPortal/Tasks/Tasks.module.css b/src/screens/UserPortal/Tasks/Tasks.module.css deleted file mode 100644 index 1f49c0d158..0000000000 --- a/src/screens/UserPortal/Tasks/Tasks.module.css +++ /dev/null @@ -1,48 +0,0 @@ -.borderNone { - border: none; -} - -.colorWhite { - color: white; -} - -.maxWidth { - max-width: 300px; -} - -.colorLight { - background-color: #f5f5f5; -} - -.mainContainer { - width: 50%; - flex-grow: 3; - padding: 40px; - max-height: 100%; - overflow: auto; -} - -.content { - height: fit-content; - min-height: calc(100% - 40px); -} - -.gap { - gap: 20px; -} - -.paddingY { - padding: 30px 0px; -} - -.containerHeight { - height: calc(100vh - 66px); -} - -.colorPrimary { - background: #31bb6b; -} - -.backgroundWhite { - background-color: white; -} diff --git a/src/screens/UserPortal/Tasks/Tasks.test.tsx b/src/screens/UserPortal/Tasks/Tasks.test.tsx deleted file mode 100644 index 208a1ca4e8..0000000000 --- a/src/screens/UserPortal/Tasks/Tasks.test.tsx +++ /dev/null @@ -1,130 +0,0 @@ -import React from 'react'; -import { act, render, screen } from '@testing-library/react'; -import { MockedProvider } from '@apollo/react-testing'; -import { I18nextProvider } from 'react-i18next'; - -import { UPDATE_USER_MUTATION } from 'GraphQl/Mutations/mutations'; -import { USER_TASKS_LIST } from 'GraphQl/Queries/Queries'; -import { BrowserRouter } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { store } from 'state/store'; -import i18nForTest from 'utils/i18nForTest'; -import { StaticMockLink } from 'utils/StaticMockLink'; -import Tasks from './Tasks'; - -const MOCKS = [ - { - request: { - query: UPDATE_USER_MUTATION, - variables: { - firstName: 'Noble', - lastName: 'Mittal', - }, - result: { - data: { - updateUserProfile: { - _id: '453', - }, - }, - }, - }, - }, - { - request: { - query: USER_TASKS_LIST, - variables: { - id: localStorage.getItem('userId'), - }, - }, - result: { - data: { - user: { - _id: '63d6064458fce20ee25c3bf7', - assignedTasks: [ - { - _id: '650c440f2b5f121b9ceeaa88', - title: 'Volunteer catering system', - description: 'Lorem ipsum dolor sit amet', - deadline: '2023-09-28T16:25:47.000Z', - volunteers: [ - { - _id: '63d6064458fce20ee25c3bf7', - firstName: 'Noble', - lastName: 'Mittal', - email: 'test@gmail.com', - __typename: 'User', - }, - ], - createdAt: '2023-09-21T13:24:31.217Z', - completed: false, - event: { - _id: '650982592328d374ba2881bc', - title: 'sadas', - organization: { - _id: '6493e4570ee6c913d7199291', - name: 'Test Organization', - image: null, - __typename: 'Organization', - }, - __typename: 'Event', - }, - creator: { - _id: '63d6064458fce20ee25c3bf7', - firstName: 'Noble', - lastName: 'Mittal', - __typename: 'User', - }, - __typename: 'Task', - }, - ], - __typename: 'User', - }, - }, - }, - }, -]; - -const link = new StaticMockLink(MOCKS, true); - -async function wait(ms = 100): Promise { - await act(() => { - return new Promise((resolve) => { - setTimeout(resolve, ms); - }); - }); -} - -describe('Testing Tasks Screen [User Portal]', () => { - // Mocks required for media queries for UserNavbar - Object.defineProperty(window, 'matchMedia', { - writable: true, - value: jest.fn().mockImplementation((query) => ({ - matches: false, - media: query, - onchange: null, - addListener: jest.fn(), // Deprecated - removeListener: jest.fn(), // Deprecated - addEventListener: jest.fn(), - removeEventListener: jest.fn(), - dispatchEvent: jest.fn(), - })), - }); - - test('Screen should be rendered properly', async () => { - render( - - - - - - - - - - ); - - await wait(); - - expect(screen.queryAllByText('Your assigned tasks')).not.toBe([]); - }); -}); diff --git a/src/screens/UserPortal/Tasks/Tasks.tsx b/src/screens/UserPortal/Tasks/Tasks.tsx deleted file mode 100644 index af02593b38..0000000000 --- a/src/screens/UserPortal/Tasks/Tasks.tsx +++ /dev/null @@ -1,173 +0,0 @@ -import React from 'react'; -import UserNavbar from 'components/UserPortal/UserNavbar/UserNavbar'; -import TaskCard from 'components/UserPortal/TaskCard/TaskCard'; -import UserSidebar from 'components/UserPortal/UserSidebar/UserSidebar'; -import PaginationList from 'components/PaginationList/PaginationList'; -import { USER_TASKS_LIST } from 'GraphQl/Queries/Queries'; -import { useQuery } from '@apollo/client'; -import styles from './Tasks.module.css'; -import { useTranslation } from 'react-i18next'; -import HourglassBottomIcon from '@mui/icons-material/HourglassBottom'; - -interface InterfaceTaskCardProps { - id: string; - title: string; - deadline: string; - description: string; - volunteers: { - id: string; - firstName: string; - lastName: string; - email: string; - }[]; - creator: { - id: string; - firstName: string; - lastName: string; - }; - event: { - id: string; - title: string; - organization: { - id: string; - name: string; - image: string | null; - }; - }; - createdAt: string; - completed: boolean; -} - -export default function tasks(): JSX.Element { - const { t } = useTranslation('translation', { - keyPrefix: 'userTasks', - }); - - const [page, setPage] = React.useState(0); - const [rowsPerPage, setRowsPerPage] = React.useState(5); - const [tasks, setTasks] = React.useState([]); - - const userId: string | null = localStorage.getItem('userId'); - - const { data: tasksData, loading: loadingTasks } = useQuery(USER_TASKS_LIST, { - variables: { id: userId }, - }); - - /* istanbul ignore next */ - const handleChangePage = ( - _event: React.MouseEvent | null, - newPage: number - ): void => { - setPage(newPage); - }; - - /* istanbul ignore next */ - const handleChangeRowsPerPage = ( - event: React.ChangeEvent - ): void => { - const newRowsPerPage = event.target.value; - - setRowsPerPage(parseInt(newRowsPerPage, 10)); - setPage(0); - }; - - /* istanbul ignore next */ - React.useEffect(() => { - if (tasksData) { - setTasks(tasksData.user.assignedTasks); - } - }, [tasksData]); - - return ( - <> - -
- -
-

{t('yourAssignedTasks')}

-
-
- {loadingTasks ? ( -
- Loading... -
- ) : ( - <> - {tasks && tasks.length > 0 ? ( - (rowsPerPage > 0 - ? tasks.slice( - page * rowsPerPage, - page * rowsPerPage + rowsPerPage - ) - : /* istanbul ignore next */ - tasks - ).map((task: any, index) => { - const volunteers: any = task.volunteers.map( - (volunteer: any) => { - return { - id: volunteer._id, - firstName: volunteer.firstName, - lastName: volunteer.lastName, - email: volunteer.email, - }; - } - ); - - const cardProps: InterfaceTaskCardProps = { - title: task.title, - id: task._id, - description: task.description, - deadline: task.deadline, - volunteers, - createdAt: task.createdAt, - completed: task.completed, - creator: { - id: task.creator._id, - firstName: task.creator.firstName, - lastName: task.creator.lastName, - }, - event: { - id: task.event._id, - title: task.event.title, - organization: { - id: task.event.organization._id, - name: task.event.organization.name, - image: task.event.organization.image, - }, - }, - }; - - return ; - }) - ) : ( - {t('nothingToShow')} - )} - - )} -
- - - - - - -
-
-
-
- - ); -}