diff --git a/src/Me/MentorshipRequests/MentorshipRequests.js b/src/Me/MentorshipRequests/MentorshipRequests.js index 2850e3b3..617230f7 100644 --- a/src/Me/MentorshipRequests/MentorshipRequests.js +++ b/src/Me/MentorshipRequests/MentorshipRequests.js @@ -49,7 +49,8 @@ const MentorshipReq = () => { await updateReqStatus( { id: selectedReq.id, userId }, STATUS.cancelled, - message + message, + 'mentee' ); closeCancelModal(); }; @@ -78,8 +79,18 @@ const MentorshipReq = () => { setLoadingState(false); } }, [userId]); - - const updateReqStatus = async ({ id, userId }, nextStatus, reason) => { + /** + * @param {import('../../types/models').User} user + * @param {import('../../helpers/mentorship').Status} nextStatus + * @param {string} reason + * @param {'mentee' | 'mentor'} listType + */ + const updateReqStatus = async ( + { id, userId }, + nextStatus, + reason, + listType = 'mentor' + ) => { const { success, mentorship } = await updateMentorshipReqStatus( id, userId, @@ -91,15 +102,20 @@ const MentorshipReq = () => { if (!success) return; - const itemIndex = mentorState.findIndex(s => s.id === id); - const item = mentorState[itemIndex]; - let newState = [...mentorState]; + const [list, setList] = + listType === 'mentor' + ? [mentorState, setMentorState] + : [menteeState, setMenteeState]; + + const itemIndex = list.findIndex(s => s.id === id); + const item = list[itemIndex]; + let newState = [...list]; newState.splice(itemIndex, 1, { ...item, status: mentorship.status, }); - setMentorState(newState); + setList(newState); }; const [openAcceptModal] = useModal( diff --git a/src/Me/MentorshipRequests/UsersList.tsx b/src/Me/MentorshipRequests/UsersList.tsx index a7e5d6aa..c1311476 100644 --- a/src/Me/MentorshipRequests/UsersList.tsx +++ b/src/Me/MentorshipRequests/UsersList.tsx @@ -2,7 +2,6 @@ import { getAvatarUrl } from '../../helpers/avatar'; import ReqContent from './ReqContent'; import { formatRequestTime, Status } from '../../helpers/mentorship'; import { RichList, RichItem } from '../components/RichList'; -import { Loader } from '../../components/Loader'; import styled from 'styled-components'; import { STATUS } from '../../helpers/mentorship'; import { ReactComponent as UserWasRemovedIcon } from '../../assets/me/icon-user-remove.svg'; @@ -10,11 +9,6 @@ import { MentorshipRequest } from '../../types/models'; import { useExpendableRichItems } from '../components/RichList/RichList'; import { RichItemTagTheme } from '../components/RichList/ReachItemTypes'; -const Spinner = styled(Loader)` - position: absolute; - left: calc(50% - 10px); -`; - const UserWasRemoved = styled.div` display: grid; grid-template-columns: 21px auto; @@ -144,7 +138,6 @@ export const UsersList = ({ return ( <> - {isLoading && } {renderList({ requests, diff --git a/src/Me/Modals/MentorshipRequestModals/CancelModal.tsx b/src/Me/Modals/MentorshipRequestModals/CancelModal.tsx index e1b27f15..4050e81d 100644 --- a/src/Me/Modals/MentorshipRequestModals/CancelModal.tsx +++ b/src/Me/Modals/MentorshipRequestModals/CancelModal.tsx @@ -38,6 +38,7 @@ const CancelModal = ({ username, onSave, onClose }: CanceledModalProps) => { title="Cancel mentorship request" onClose={onClose} isLoading={isLoading} + submitLabel="Cancel" onSave={() => { setIsLoading(true); onSave(reasonOption === '3' ? reason.current : REASONS[reasonOption]); diff --git a/src/Me/Modals/MentorshipRequestModals/DeclineModal.tsx b/src/Me/Modals/MentorshipRequestModals/DeclineModal.tsx index fb9972f5..8d4dd0e2 100644 --- a/src/Me/Modals/MentorshipRequestModals/DeclineModal.tsx +++ b/src/Me/Modals/MentorshipRequestModals/DeclineModal.tsx @@ -2,15 +2,9 @@ import BodyStyle from './style'; import { useRef, useState } from 'react'; import { Modal } from '../Modal'; import TextArea from '../../components/Textarea'; -import { Loader } from '../../../components/Loader'; import styled from 'styled-components'; import FormField from '../../components/FormField'; -const Spinner = styled(Loader)` - position: absolute; - top: 25%; -`; - const Body = styled(BodyStyle)` justify-content: flex-start; p { @@ -33,13 +27,14 @@ const DeclineModal = ({ username, onSave, onClose }: DeclineModalProps) => { center title="Decline Mentorship" onClose={onClose} + isLoading={loadingState} + submitLabel="Decline" onSave={() => { setLoadingState(true); onSave(message.current); }} > - {loadingState && } You have declined {username} and that’s ok, now is not a good
You have declined {username} and that’s ok, now is not a good