From a8394d548f3ed6dc369433595f5c49b645fc43b0 Mon Sep 17 00:00:00 2001
From: Arif <arifmajeed007.as@gmail.com>
Date: Tue, 3 Sep 2024 17:21:25 +0530
Subject: [PATCH] Issue #PS-1456 feat: API integration for re-assign Learners

---
 src/components/CohortLearnerList.tsx | 34 ++++++++++++++--------------
 src/components/LearnersListItem.tsx  | 14 +++++++++++-
 src/utils/Interfaces.ts              |  3 ++-
 3 files changed, 32 insertions(+), 19 deletions(-)

diff --git a/src/components/CohortLearnerList.tsx b/src/components/CohortLearnerList.tsx
index 7d703283..88d36b29 100644
--- a/src/components/CohortLearnerList.tsx
+++ b/src/components/CohortLearnerList.tsx
@@ -54,24 +54,23 @@ const CohortLearnerList: React.FC<CohortLearnerListProp> = ({
             filters,
           });
           const resp = response?.result?.userDetails;
-
+                    
           if (resp) {
-            const userDetails = resp.map((user: any) => ({
-              name: toPascalCase(user.name),
-              userId: user.userId,
-              memberStatus: user.status,
-              statusReason: user.statusReason,
-              cohortMembershipId: user.cohortMembershipId,
-              enrollmentNumber: capitalizeEachWord(
-                getFieldValue(
-                  user?.customField,
-                  'fieldname',
-                  'Enrollment Number',
-                  'fieldvalues',
-                  '-'
-                )
-              ),
-            }));
+
+  
+            const userDetails = resp.map((user: any) => {
+              const ageField = user.customField.find((field: { label: string }) => field.label === "AGE");
+              return {
+                name: toPascalCase(user?.name),
+                userId: user?.userId,
+                memberStatus: user?.status,
+                statusReason: user?.statusReason,
+                cohortMembershipId: user?.cohortMembershipId,
+                enrollmentNumber: user?.username,
+                age: ageField ? ageField.value : null, // Extract age for the specific user
+              };
+            });
+            
             console.log(`userDetails`, userDetails);
             setUserData(userDetails);
           }
@@ -117,6 +116,7 @@ const CohortLearnerList: React.FC<CohortLearnerListProp> = ({
                     userId={data.userId}
                     learnerName={data.name}
                     enrollmentId={data.enrollmentNumber}
+                    age={data.age}
                     cohortMembershipId={data.cohortMembershipId}
                     isDropout={data.memberStatus === Status.DROPOUT}
                     statusReason={data.statusReason}
diff --git a/src/components/LearnersListItem.tsx b/src/components/LearnersListItem.tsx
index 704d2cf9..66a2c7e2 100644
--- a/src/components/LearnersListItem.tsx
+++ b/src/components/LearnersListItem.tsx
@@ -37,6 +37,7 @@ import reassignLearnerStore from '@/store/reassignLearnerStore';
 import { bulkCreateCohortMembers } from '@/services/CohortServices';
 import { capitalizeEachWord, filterMiniProfileFields } from '@/utils/Helper';
 import { useMediaQuery } from '@mui/material';
+import FiberManualRecordIcon from '@mui/icons-material/FiberManualRecord';
 
 type Anchor = 'bottom';
 
@@ -46,6 +47,7 @@ const LearnersListItem: React.FC<LearnerListProps> = ({
   learnerName,
   isDropout,
   enrollmentId,
+  age,
   cohortMembershipId,
   statusReason,
   reloadState,
@@ -561,7 +563,17 @@ const LearnersListItem: React.FC<LearnerListProps> = ({
                             color: theme.palette.warning['400'],
                           }}
                         >
-                          {enrollmentId}
+                          {age + ' y/o'}
+                        </Box>
+                        <FiberManualRecordIcon style={{ fontSize: '8px', color:'#CDC5BD' }} />
+                        <Box
+                          sx={{
+                            fontSize: '14px',
+                            fontWeight: '400',
+                            color: theme.palette.warning['400'],
+                          }}
+                        >
+                          {enrollmentId?.toUpperCase()}
                         </Box>
                       </>
                     )}
diff --git a/src/utils/Interfaces.ts b/src/utils/Interfaces.ts
index 210732b4..1a14ae58 100644
--- a/src/utils/Interfaces.ts
+++ b/src/utils/Interfaces.ts
@@ -324,7 +324,8 @@ export interface LearnerListProps {
   type?: string;
   userId: string;
   isDropout: boolean;
-  enrollmentId?: string | number;
+  enrollmentId?: any;
+  age: string | number;
   cohortMembershipId: string | number;
   learnerName: string;
   statusReason: string;