Skip to content

Commit bd78e22

Browse files
elijahladdieelijahladdie
committed
adding undrop trainee feature
1 parent 266d7ed commit bd78e22

File tree

3 files changed

+177
-57
lines changed

3 files changed

+177
-57
lines changed

‎src/Mutations/manageStudentMutations.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,12 @@ export const DROP_TRAINEE = gql`
2121
dropTrainee(traineeId: $traineeId, reason: $reason, date: $date)
2222
}
2323
`;
24-
24+
// Define the mutation
25+
export const UNDROP_TRAINEE = gql`
26+
mutation UndropTrainee($traineeId: String!) {
27+
undropTrainee(traineeId: $traineeId)
28+
}
29+
`;
2530
export const GET_TRAINEES_QUERY = gql`
2631
query GetTrainees($orgToken: String) {
2732
getTrainees(orgToken: $orgToken) {

‎src/pages/AdminTraineeDashboard.tsx‎

Lines changed: 169 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ import {
2727
GET_TEAM_QUERY,
2828
ADD_MEMBER_TO_TEAM,
2929
GET_GITHUB_STATISTICS,
30+
UNDROP_TRAINEE,
3031
} from '../Mutations/manageStudentMutations';
3132
import { useNavigate } from 'react-router-dom';
3233

@@ -70,6 +71,8 @@ function AdminTraineeDashboard() {
7071
const [editTeam, setEditTeam] = useState('');
7172
const [inviteEmail, setInviteEmail] = useState('');
7273
const [buttonLoading, setButtonLoading] = useState(false);
74+
const [restoreTraineeModel, setRestoreTraineeModel] = useState(false);
75+
7376
const [toggle, setToggle] = useState(false);
7477
const [showOptions, setShowOptions] = useState(false);
7578
const options: any = [];
@@ -81,9 +84,11 @@ function AdminTraineeDashboard() {
8184
const { traineeData, setAllTrainees } = useTraineesContext() || [];
8285
const [actionTraineeOptions, setActionTraineeOptions] = useState<any>(null);
8386
const modalRef = useRef<any>(null);
84-
85-
const [selectedTraineeId, setSelectedTraineeId]= useState<string[]>()
86-
87+
// restoreTraineeModel
88+
// restoreTraineeMod
89+
// unDropTrainee
90+
// restoreMemberFromCohort
91+
const [selectedTraineeId, setSelectedTraineeId] = useState<string[]>();
8792

8893
useEffect(() => {
8994
const handleClickOutside = (event: any) => {
@@ -168,7 +173,10 @@ function AdminTraineeDashboard() {
168173
const newState = !removeTraineeModel;
169174
setRemoveTraineeModel(newState);
170175
};
171-
176+
const restoreTraineeMod = () => {
177+
const newState = !restoreTraineeModel;
178+
setRestoreTraineeModel(newState);
179+
};
172180
const removeModel = () => {
173181
const newState = !registerTraineeModel;
174182
setRegisterTraineeModel(newState);
@@ -264,18 +272,18 @@ function AdminTraineeDashboard() {
264272
}
265273
>
266274
<button
267-
className={`${row.original?.Status?.status === 'drop'
268-
? 'bg-gray-500'
269-
: 'bg-black'
270-
} text-white rounded-xl px-3`}
271-
onClick={() => {
272-
setSelectedTraineeId(row.original?.email);
273-
handleClickOpen2();
274-
}}
275-
>
276-
{row.original?.Status?.status === 'drop' ? 'Dropped' : 'View'}
277-
</button>
278-
275+
className={`${
276+
row.original?.Status?.status === 'drop'
277+
? 'bg-gray-500'
278+
: 'bg-black'
279+
} text-white rounded-xl px-3`}
280+
onClick={() => {
281+
setSelectedTraineeId(row.original?.email);
282+
handleClickOpen2();
283+
}}
284+
>
285+
{row.original?.Status?.status === 'drop' ? 'Dropped' : 'View'}
286+
</button>
279287
</div>
280288
);
281289
},
@@ -296,8 +304,9 @@ function AdminTraineeDashboard() {
296304
/>
297305
{selectedRow === row.original.email && (
298306
<div
299-
ref={modalRef}
300-
className="absolute z-50 w-64 p-4 mt-2 overflow-hidden border border-gray-300 rounded-lg shadow-md dropdown right-4 bg-light-bg max-h-30 dark:bg-dark-bg">
307+
ref={modalRef}
308+
className="absolute z-50 w-64 p-4 mt-2 overflow-hidden border border-gray-300 rounded-lg shadow-md dropdown right-4 bg-light-bg max-h-30 dark:bg-dark-bg"
309+
>
301310
<>
302311
<div className="mb-4"></div>
303312
<div className="mb-4">
@@ -363,30 +372,58 @@ function AdminTraineeDashboard() {
363372
</div>
364373
</div>
365374
<div className="mb-4">
366-
<div
367-
className="flex items-center p-2 rounded-md cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-800"
368-
onClick={() => {
369-
dropModel(row.original.email);
370-
setdropTraineeID(row.original.userId);
371-
setReason(row.original.reason);
372-
toggleOptions(row.original.email);
373-
}}
374-
>
375-
<Icon
376-
icon="mdi:close-circle"
377-
width="40"
378-
height="40"
379-
cursor="pointer"
380-
color="#9e85f5"
381-
/>
382-
<div>
383-
<span className="font-bold">Drop</span>{' '}
384-
<>
385-
<br />
386-
Drop trainee
387-
</>
375+
{row.original?.Status?.status !== 'drop' ? (
376+
<div
377+
className="flex items-center p-2 rounded-md cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-800"
378+
onClick={() => {
379+
dropModel(row.original.email);
380+
setdropTraineeID(row.original.userId);
381+
setReason(row.original.reason);
382+
toggleOptions(row.original.email);
383+
}}
384+
>
385+
<Icon
386+
icon="mdi:close-circle"
387+
width="40"
388+
height="40"
389+
cursor="pointer"
390+
color="#9e85f5"
391+
/>
392+
<div>
393+
<span className="font-bold">Drop</span>
394+
{row.original.status}
395+
<>
396+
<br />
397+
Drop trainee
398+
</>
399+
</div>
388400
</div>
389-
</div>
401+
) : (
402+
<div
403+
className="flex items-center p-2 rounded-md cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-800"
404+
onClick={() => {
405+
restoreTraineeMod();
406+
setdropTraineeID(row.original.userId);
407+
setReason(row.original.reason);
408+
toggleOptions(row.original.email);
409+
}}
410+
>
411+
<Icon
412+
icon="mdi:close-circle"
413+
width="40"
414+
height="40"
415+
cursor="pointer"
416+
color="#9e85f5"
417+
/>
418+
<div>
419+
<span className="font-bold">Restore</span>{' '}
420+
<>
421+
<br />
422+
Restore Dropped Trainee
423+
</>
424+
</div>
425+
</div>
426+
)}
390427
</div>
391428
<div>
392429
<div
@@ -559,6 +596,31 @@ function AdminTraineeDashboard() {
559596
},
560597
});
561598

599+
const [unDropTrainee] = useMutation(UNDROP_TRAINEE, {
600+
variables: {
601+
traineeId: dropTraineeID,
602+
},
603+
onCompleted: (data) => {
604+
setTimeout(() => {
605+
setButtonLoading(false);
606+
if (data.undropTrainee) {
607+
// Check the response structure
608+
refetch();
609+
toast.success('Trainee Undropped successfully');
610+
setDropTraineeModel(false);
611+
} else {
612+
toast.error('Failed to undrop trainee');
613+
}
614+
}, 1000);
615+
},
616+
onError: (err) => {
617+
setTimeout(() => {
618+
setButtonLoading(false);
619+
console.error('Mutation error:', err); // Log the error
620+
toast.error(err.message);
621+
}, 500);
622+
},
623+
});
562624
const [removeMemberFromCohort] = useMutation(
563625
REMOVE_MEMBER_FROM_COHORT_MUTATION,
564626
{
@@ -658,7 +720,6 @@ function AdminTraineeDashboard() {
658720
teamOptions[index].label = team?.name;
659721
});
660722
}
661-
662723

663724
return (
664725
<>
@@ -672,20 +733,21 @@ function AdminTraineeDashboard() {
672733
className="rounded-lg"
673734
fullWidth
674735
>
675-
{traineeData?.map((data:any) => {
676-
if (data.email === selectedTraineeId) {
677-
return <ViewWeeklyRatings
678-
traineeName={data?.profile?.name || 'Unknown Name'}
679-
traineeEmail={data?.email || 'Unknown Email'}
680-
traineeId={data?.profile?.user?.id || 'Unknown ID'}
681-
traineeCohort={data?.team?.cohort?.id || 'Unknown Cohort'}
682-
traineeStatus={
683-
data?.profile?.user?.status || 'Status Unavailable'
684-
}
685-
/>
736+
{traineeData?.map((data: any) => {
737+
if (data.email === selectedTraineeId) {
738+
return (
739+
<ViewWeeklyRatings
740+
traineeName={data?.profile?.name || 'Unknown Name'}
741+
traineeEmail={data?.email || 'Unknown Email'}
742+
traineeId={data?.profile?.user?.id || 'Unknown ID'}
743+
traineeCohort={data?.team?.cohort?.id || 'Unknown Cohort'}
744+
traineeStatus={
745+
data?.profile?.user?.status || 'Status Unavailable'
746+
}
747+
/>
748+
);
686749
}
687-
}
688-
)}
750+
})}
689751
<FaTimes
690752
size={24}
691753
color="red"
@@ -1473,6 +1535,57 @@ function AdminTraineeDashboard() {
14731535
</div>
14741536
</div>
14751537
{/* =========================== End:: AddTraineeModel =============================== */}
1538+
{/* =========================== Start:: RestoreTraineeModel =============================== */}
1539+
1540+
<div
1541+
className={`h-screen w-screen bg-black bg-opacity-30 backdrop-blur-sm fixed top-0 left-0 z-20 flex items-center justify-center px-4 ${
1542+
restoreTraineeModel === true ? 'block' : 'hidden'
1543+
}`}
1544+
>
1545+
<div className="w-full p-4 pb-8 bg-white rounded-lg dark:bg-dark-bg sm:w-3/4 xl:w-4/12">
1546+
<div className="flex flex-wrap items-center justify-center w-full card-title ">
1547+
<h3 className="w-11/12 text-sm font-bold text-center dark:text-white ">
1548+
{t('restore Trainee')}
1549+
</h3>
1550+
<hr className="w-full my-3 border-b bg-primary" />
1551+
</div>
1552+
<div className="card-body">
1553+
<form className="px-8 py-3 ">
1554+
<div className="flex flex-wrap items-center justify-center w-full card-title ">
1555+
<h3 className="w-11/12 text-sm font-bold text-center dark:text-white ">
1556+
{t('Are you sure you want to undrop this trainee?')}
1557+
</h3>
1558+
</div>
1559+
1560+
<div className="flex justify-between w-full">
1561+
<Button
1562+
data-testid="restoreModel2"
1563+
variant="info"
1564+
size="sm"
1565+
style="w-[40%] md:w-1/4 text-sm font-sans"
1566+
onClick={() => restoreTraineeMod()}
1567+
>
1568+
{t('Cancel')}
1569+
</Button>
1570+
<Button
1571+
variant="primary"
1572+
size="sm"
1573+
data-testid="restoreMemberFromCohort"
1574+
style="w-[40%] md:w-1/4 text-sm font-sans"
1575+
onClick={() => {
1576+
setButtonLoading(true);
1577+
unDropTrainee();
1578+
}}
1579+
loading={buttonLoading}
1580+
>
1581+
{t('Proceed')}
1582+
</Button>
1583+
</div>
1584+
</form>
1585+
</div>
1586+
</div>
1587+
</div>
1588+
{/* =========================== End:: RemoveTraineeModel =============================== */}
14761589

14771590
<div className="flex flex-col">
14781591
<div className="flex flex-row">
@@ -1527,4 +1640,4 @@ function AdminTraineeDashboard() {
15271640
);
15281641
}
15291642

1530-
export default AdminTraineeDashboard;
1643+
export default AdminTraineeDashboard;

‎src/pages/Organization/AdminLogin.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,8 @@ function AdminLogin() {
106106
},
107107
onError: (err) => {
108108
/* istanbul ignore next */
109+
console.log(err.message);
110+
109111
if (err.networkError)
110112
toast.error('There was a problem contacting the server');
111113
else if (err.message.toLowerCase() !== 'invalid credential') {

0 commit comments

Comments
 (0)