diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index ef7968ea..8196c457 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -23,7 +23,7 @@
     "CLASS_MISSED": "Classes Missed",
     "ATTENDANCE": "Attendance",
     "ATTENDANCE_REPORT": "Attendance Report",
-    "TEST_REPORT": "Test Report",
+    "ASSESSMENT_REPORT": "Assessment Report",
     "BASIC_DETAILS": "Basic Details",
     "DOB": "Date of Birth",
     "LOGOUT": "Log out",
diff --git a/src/components/AddFacilitator.tsx b/src/components/AddFacilitator.tsx
index 54df2fa4..981bd058 100644
--- a/src/components/AddFacilitator.tsx
+++ b/src/components/AddFacilitator.tsx
@@ -196,7 +196,7 @@ const AddFacilitatorModal: React.FC<AddFacilitatorModalprops> = ({
           ) {
             apiBody.customFields.push({
               fieldId: fieldId,
-              value: [String(fieldValue)],
+              value: Array.isArray(fieldValue) ? fieldValue : [fieldValue], 
             });
           } else {
             if (fieldSchema.checkbox && fieldSchema.type === 'array') {
diff --git a/src/components/AddLeanerModal.tsx b/src/components/AddLeanerModal.tsx
index e5e4a908..76d8a23d 100644
--- a/src/components/AddLeanerModal.tsx
+++ b/src/components/AddLeanerModal.tsx
@@ -156,7 +156,7 @@ const AddLearnerModal: React.FC<AddLearnerModalProps> = ({
           ) {
             apiBody.customFields.push({
               fieldId: fieldId,
-              value: [String(fieldValue)],
+              value: Array.isArray(fieldValue) ? fieldValue : [fieldValue],
             });
           } else {
             apiBody.customFields.push({
diff --git a/src/components/AssessmentReport.tsx b/src/components/AssessmentReport.tsx
new file mode 100644
index 00000000..813b4ab7
--- /dev/null
+++ b/src/components/AssessmentReport.tsx
@@ -0,0 +1,148 @@
+import { Box, Grid, Typography } from '@mui/material';
+import React, { useEffect } from 'react';
+import { useTheme } from '@mui/material/styles';
+import { useTranslation } from 'next-i18next';
+import CheckCircleIcon from '@mui/icons-material/CheckCircle';
+import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
+import { useRouter } from 'next/router';
+import RemoveIcon from '@mui/icons-material/Remove';
+import RadioButtonUncheckedIcon from '@mui/icons-material/RadioButtonUnchecked';
+import { updateAssessment } from '@/services/UpdateAssesmentService';
+
+interface AssessmentReportProp{
+    isTitleRequired?: boolean
+}
+
+const AssessmentReport: React.FC<AssessmentReportProp> = ({ isTitleRequired }) => {
+  const theme = useTheme<any>();
+  const router = useRouter();
+  const { t } = useTranslation();
+
+  const [assessmentList, setAssessmentList] = React.useState([]);
+
+  useEffect(() => {
+    const res: any = updateAssessment();
+    setAssessmentList(res);
+  }, []);
+
+  const handleAssessmentDetails = (userId: string) => {
+    router.push(`${router.pathname}/user/${userId}`);
+  };
+
+  return (
+    <Box sx={{ background: isTitleRequired?'#ffffff': '#FBF4E4', padding: isTitleRequired? '0px': '20px' }}>
+        {isTitleRequired ? (
+          <Typography
+            sx={{
+              color: theme.palette.warning['A200'],
+              fontWeight: 600,
+              fontSize: '16px',
+              pb: '0.75rem'
+            }}
+            variant="h5"
+            gutterBottom
+          >
+            {t('COMMON.ASSESSMENT_REPORT')}
+          </Typography>
+        ) : null}
+        <Grid container spacing={2}>
+          {assessmentList.map((assessment: any) => (
+            <Grid item xs={12} sm={6} md={4} key={assessment.userId}>
+              <Box
+                sx={{
+                  border: `1px solid ${theme?.palette?.warning['A100']}`,
+                  display: 'flex',
+                  justifyContent: 'space-between',
+                  borderRadius: '8px',
+                  gap: '5px',
+                }}
+                onClick={() => handleAssessmentDetails(assessment.userId)}
+              >
+                <Box
+                  sx={{
+                    flexBasis: '20%',
+                    background: theme?.palette?.primary?.light,
+                    display: 'flex',
+                    justifyContent: 'center',
+                    alignItems: 'center',
+                    padding: '7px',
+                  }}
+                >
+                  {/* Todo : replaced with proper flag coming from backend  */}
+                  {assessment.progress === 'Overall score :' ? (
+                    <CheckCircleIcon
+                      sx={{ color: theme.palette.warning[300] }}
+                    />
+                  ) : assessment.progress === 'Not Started' ? (
+                    <RemoveIcon sx={{ color: theme.palette.warning[300] }} />
+                  ) : assessment.progress === 'In Progress' ? (
+                    <RadioButtonUncheckedIcon
+                      sx={{ color: theme.palette.warning[300] }}
+                    />
+                  ) : null}
+                </Box>
+                <Box sx={{ flexBasis: '80%' }}>
+                  <Box
+                    sx={{
+                      px: '10px',
+                      display: 'flex',
+                      justifyContent: 'space-between',
+                      alignItems: 'center',
+                      padding: '7px',
+                    }}
+                  >
+                    <Box>
+                      <Box
+                        sx={{
+                          color: theme.palette.warning[300],
+                          fontSize: '16px',
+                          fontWeight: '400',
+                        }}
+                      >
+                        {assessment.studentName}
+                      </Box>
+                      <Box
+                        sx={{
+                          gap: '4px',
+                          display: 'flex',
+                          alignItems: 'center',
+                        }}
+                      >
+                        <Box
+                          sx={{
+                            color: theme.palette.warning[300],
+                            fontSize: '14px',
+                            fontWeight: '500',
+                            py: '2px',
+                          }}
+                        >
+                          {assessment.progress}
+                        </Box>
+                        {assessment.progress === 'Overall score :' && (
+                          <Box
+                            sx={{
+                              color: theme.palette.success.main,
+                              fontSize: '14px',
+                              fontWeight: '500',
+                            }}
+                          >
+                            {assessment.score}%
+                          </Box>
+                        )}
+                      </Box>
+                    </Box>
+
+                    <KeyboardArrowRightIcon
+                      sx={{ color: theme.palette.warning[300] }}
+                    />
+                  </Box>
+                </Box>
+              </Box>
+            </Grid>
+          ))}
+        </Grid>
+      </Box>
+  );
+};
+
+export default AssessmentReport;
diff --git a/src/pages/learner/[userId].tsx b/src/pages/learner/[userId].tsx
index 2a7fe432..faf2ec44 100644
--- a/src/pages/learner/[userId].tsx
+++ b/src/pages/learner/[userId].tsx
@@ -68,6 +68,7 @@ import {
 import { accessControl } from '../../../app.config';
 import LearnersListItem from '@/components/LearnersListItem';
 import { getMyCohortMemberList } from '@/services/MyClassDetailsService';
+import AssessmentReport from '@/components/AssessmentReport';
 
 interface LearnerProfileProp {
   reloadState?: boolean;
@@ -980,96 +981,8 @@ const LearnerProfile: React.FC<LearnerProfileProp> = ({
           }}
         >
           <CardContent>
-            <Typography
-              sx={{
-                color: theme.palette.warning['A200'],
-                fontWeight: 600,
-                fontSize: '13px',
-              }}
-              variant="h5"
-              gutterBottom
-            >
-              {t('COMMON.TEST_REPORT')}
-            </Typography>
-            <Box padding={0}>
-              <FormControl fullWidth sx={{ margin: 1, marginLeft: 0 }}>
-                <InputLabel id="demo-simple-select-helper-label">
-                  {t('PROFILE.TEST')}
-                </InputLabel>
-                <Select
-                  labelId="demo-simple-select-helper-label"
-                  id="demo-simple-select-helper"
-                  value={test}
-                  label="test"
-                  onChange={handleChangeTest}
-                >
-                  <MenuItem value={'Post Test'}>
-                    {t('PROFILE.POST_TEST')}
-                  </MenuItem>
-                  <MenuItem value={'Pre Test'}>
-                    {t('PROFILE.PRE_TEST')}
-                  </MenuItem>
-                </Select>
-              </FormControl>
-              <FormControl fullWidth sx={{ margin: 1, marginLeft: 0 }}>
-                <InputLabel id="demo-simple-select-helper-label">
-                  {t('PROFILE.SUBJECT')}
-                </InputLabel>
-                <Select
-                  labelId="demo-simple-select-helper-label"
-                  id="demo-simple-select-helper"
-                  value={subject}
-                  label="Subject"
-                  onChange={handleChangeSubject}
-                >
-                  <MenuItem value={'English'}>{t('PROFILE.ENGLISH')}</MenuItem>
-                  <MenuItem value={'Hindi'}>{t('PROFILE.HINDI')}</MenuItem>
-                </Select>
-              </FormControl>
-            </Box>
-            {loading ? (
-              <Typography textAlign="center">{t('COMMON.LOADING')}</Typography>
-            ) : !uniqueDoId || uniqueDoId === '' ? (
-              <Box mt={2}>
-                <Typography textAlign={'center'}>
-                  {t('COMMON.NO_DATA_FOUND')}
-                </Typography>
-              </Box>
-            ) : (
-              <Box
-                sx={{
-                  background: '#F8EFE7',
-                  p: 2,
-                }}
-              >
-                <Box>
-                  <Typography variant="h5">
-                    {t('PROFILE.SUBMITTED_ON')} :{' '}
-                    {submittedOn
-                      ? format(new Date(submittedOn), 'dd MMMM, yyyy')
-                      : ''}
-                  </Typography>
-                </Box>
-                <Box display={'flex'} justifyContent={'space-between'} mt={1}>
-                  <Typography variant="h3" fontWeight={'bold'}>
-                    {t('PROFILE.MARK_OBTAINED')}
-                  </Typography>
-                  <Typography variant="h4" fontWeight={'bold'}>
-                    {totalScore ? totalScore : '0'}/
-                    {totalMaxScore ? totalMaxScore : '0'}
-                  </Typography>
-                </Box>
-                <Divider />
-                <Box mt={1}>
-                  <Typography variant="h5">
-                    {t('PROFILE.TOTAL_QUESTIONS')} :{assesmentData?.length}
-                  </Typography>
-                </Box>
-                <Box mt={2}>
-                  <MarksObtainedCard data={assesmentData} />
-                </Box>
-              </Box>
-            )}
+            
+              <AssessmentReport isTitleRequired={true}/>
           </CardContent>
         </Card>
       </Box>
diff --git a/src/styles/customTheme.tsx b/src/styles/customTheme.tsx
index 5e79c576..9db2c6b7 100644
--- a/src/styles/customTheme.tsx
+++ b/src/styles/customTheme.tsx
@@ -30,7 +30,7 @@ const commonPalette = {
     '800': '#F8EFE7',
     '900': '#DADADA',
     A100: '#D0C5B4',
-    A200: '#4d4639',
+    A200: '#4D4639',
     A400: '#FFFFFF',
     A700: '#EDEDED',
   },