@@ -60,9 +60,28 @@ const TtlTraineeDashboard = () => {
6060 const [ hasData , setHasData ] = useState ( false ) ;
6161 const [ open , setOpen ] = React . useState ( false ) ;
6262 const [ open2 , setOpen2 ] = React . useState ( false ) ;
63+ const [ traineesWithAttendance , setTraineesWithAttendance ] = useState < any [ ] > (
64+ [ ] ,
65+ ) ;
66+
67+ const traineeAttendancOrTickets = (
68+ email : string ,
69+ type : 'attendance' | 'tickets' ,
70+ ) => {
71+ if ( traineesWithAttendance ) {
72+ for ( let i = 0 ; i < traineesWithAttendance . length ; i ++ ) {
73+ if ( traineesWithAttendance [ i ] . traineeInfo . email === email ) {
74+ return type === 'attendance'
75+ ? traineesWithAttendance [ i ] . attendance
76+ : traineesWithAttendance [ i ] . numOfTickets ;
77+ }
78+ }
79+ }
80+ return 0 ;
81+ } ;
6382
64- const [ selectedTraineeId , setSelectedTraineeId ] = useState < string [ ] > ( )
65- const [ bulkRateModal , setBulkRateModal ] = useState < boolean > ( false )
83+ const [ selectedTraineeId , setSelectedTraineeId ] = useState < string [ ] > ( ) ;
84+ const [ bulkRateModal , setBulkRateModal ] = useState < boolean > ( false ) ;
6685
6786 const handleClickOpen2 = async ( ) => {
6887 setIsLoaded ( true ) ;
@@ -115,6 +134,30 @@ const TtlTraineeDashboard = () => {
115134 { Header : t ( 'email' ) , accessor : 'email' } ,
116135
117136 { Header : t ( 'Team' ) , accessor : 'team' } ,
137+ {
138+ Header : t ( 'Attendance' ) ,
139+ accessor : '' ,
140+ Cell : ( { row } : any ) =>
141+ hasData && (
142+ < div className = "flex ml-[2.5rem] items-center" >
143+ < div >
144+ { traineeAttendancOrTickets ( row . original ?. email , 'attendance' ) }
145+ </ div >
146+ </ div >
147+ ) ,
148+ } ,
149+ {
150+ Header : t ( 'Tickets' ) ,
151+ accessor : '' ,
152+ Cell : ( { row } : any ) =>
153+ hasData && (
154+ < div className = "flex ml-[1.5rem] items-center" >
155+ < div >
156+ { traineeAttendancOrTickets ( row . original ?. email , 'tickets' ) }
157+ </ div >
158+ </ div >
159+ ) ,
160+ } ,
118161 {
119162 Header : t ( 'Status' ) ,
120163 accessor : 'status' ,
@@ -128,36 +171,38 @@ const TtlTraineeDashboard = () => {
128171 }
129172 >
130173 < button
131- className = { `${ row . original ?. Status ?. status === 'drop'
132- ? 'bg-gray-500'
133- : 'bg-black'
134- } text-white rounded-xl px-3`}
135- onClick = { ( ) => {
136- setSelectedTraineeId ( row . original ?. email ) ;
137- handleClickOpen2 ( ) ;
138- } }
139- >
140- { row . original ?. Status ?. status === 'drop' ? 'Dropped' : 'View' }
174+ className = { `${
175+ row . original ?. Status ?. status === 'drop'
176+ ? 'bg-gray-500'
177+ : 'bg-black'
178+ } text-white rounded-xl px-3`}
179+ onClick = { ( ) => {
180+ setSelectedTraineeId ( row . original ?. email ) ;
181+ handleClickOpen2 ( ) ;
182+ } }
183+ >
184+ { row . original ?. Status ?. status === 'drop' ? 'Dropped' : 'View' }
141185 </ button >
142186 </ div >
143187 ) ;
144188 } ,
145189 } ,
146-
147190 {
148191 Header : t ( 'action' ) ,
149192 accessor : '' ,
150193 Cell : ( { row } : any ) =>
151194 hasData && ( // Only render the button if there is data
152- < button
153- onClick = { ( ) => {
154- handleClickOpen ( row . original ?. email ) ;
155- } }
156- className = "text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-600"
157- aria-label = "View Details"
158- >
159- < FaEye className = "text-2xl text-[#9e85f5]" />
160- </ button >
195+ < div className = "flex ml-5 items-center" >
196+ < button
197+ onClick = { ( ) => {
198+ handleClickOpen ( row . original ?. email ) ;
199+ } }
200+ className = "text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-600"
201+ aria-label = "View Details"
202+ >
203+ < FaEye className = "text-2xl text-[#9e85f5]" />
204+ </ button >
205+ </ div >
161206 ) ,
162207 } ,
163208 ] ;
@@ -191,14 +236,19 @@ const TtlTraineeDashboard = () => {
191236 getTTLTrainees ( {
192237 fetchPolicy : 'network-only' ,
193238 onCompleted : ( data ) => {
239+ console . log ( data ) ;
240+ const traineeDatas = data . getTTLTrainees . map (
241+ ( traineeData : any ) => traineeData . traineeInfo ,
242+ ) ;
243+ setTraineesWithAttendance ( data . getTTLTrainees ) ;
194244 setTraineeLoading ( false ) ;
195- setTraineeData ( data . getTTLTrainees ) ;
196- setHasData ( data . getTTLTrainees . length > 0 ) ;
245+ setTraineeData ( traineeDatas ) ;
246+ setHasData ( traineeDatas . length > 0 ) ;
197247 setFetchError ( false ) ; // Reset the fetch error state on success
198248 } ,
199249 onError : ( error ) => {
200250 setTraineeLoading ( false ) ;
201- setFetchError ( true ) ;
251+ setFetchError ( true ) ;
202252 toast . error ( handleError ( error ) ) ;
203253 } ,
204254 } ) ;
@@ -216,20 +266,21 @@ const TtlTraineeDashboard = () => {
216266 className = "rounded-lg relative"
217267 fullWidth
218268 >
219- { traineeData . map ( data => {
269+ { traineeData . map ( ( data ) => {
220270 if ( data . email === selectedTraineeId ) {
221- return < ViewWeeklyRatings
222- traineeName = { data ?. profile ?. name || 'Unknown Name' }
223- traineeEmail = { data ?. email || 'Unknown Email' }
224- traineeId = { data ?. profile ?. user ?. id || 'Unknown ID' }
225- traineeCohort = { data ?. team ?. cohort ?. id || 'Unknown Cohort' }
226- traineeStatus = {
227- data ?. profile ?. user ?. status || 'Status Unavailable'
271+ return (
272+ < ViewWeeklyRatings
273+ traineeName = { data ?. profile ?. name || 'Unknown Name' }
274+ traineeEmail = { data ?. email || 'Unknown Email' }
275+ traineeId = { data ?. profile ?. user ?. id || 'Unknown ID' }
276+ traineeCohort = { data ?. team ?. cohort ?. id || 'Unknown Cohort' }
277+ traineeStatus = {
278+ data ?. profile ?. user ?. status || 'Status Unavailable'
279+ }
280+ />
281+ ) ;
228282 }
229- />
230- }
231- }
232- ) }
283+ } ) }
233284
234285 < FaTimes
235286 size = { 24 }
@@ -421,17 +472,17 @@ const TtlTraineeDashboard = () => {
421472 < div >
422473 < div className = "min-h-screen overflow-x-hidden overflow-y-auto bg-light-bg dark:bg-dark-frame-bg" >
423474 < div className = "" >
424- < div className = "my-5" >
425- < Button
475+ < div className = "my-5" >
476+ < Button
426477 variant = "primary"
427478 size = "lg"
428479 data-testid = "registerModel"
429480 style = "m-0"
430- onClick = { ( ) => setBulkRateModal ( true ) }
481+ onClick = { ( ) => setBulkRateModal ( true ) }
431482 >
432483 { t ( 'Bulk Rate' ) }
433- </ Button >
434- </ div >
484+ </ Button >
485+ </ div >
435486 { fetchError || traineeData ?. length === 0 ? ( // Check both fetchError and traineeData length
436487 < DataTable
437488 data = { [ ] } // Pass an empty array as data
@@ -449,12 +500,11 @@ const TtlTraineeDashboard = () => {
449500 ) }
450501 </ div >
451502 </ div >
452- {
453- bulkRateModal ?
454- < BulkRatingModal
455- setBulkRateModal = { setBulkRateModal }
456- /> : ''
457- }
503+ { bulkRateModal ? (
504+ < BulkRatingModal setBulkRateModal = { setBulkRateModal } />
505+ ) : (
506+ ''
507+ ) }
458508 </ div >
459509 </ div >
460510 </ div >
0 commit comments