Merge pull request #175 from Rushikesh-Sonawane99/shiksha-2.0

Issue #PS-289 chore: Added Present and Absent count in modal and respective translations
tekdi · May 27, 2024 · 31c13dd · 31c13dd
2 parents 512075d + d9e953a
commit 31c13dd
Show file tree

Hide file tree

Showing 5 changed files with 64 additions and 0 deletions.
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
@@ -80,6 +80,8 @@
   },
   "ATTENDANCE": {
     "TOTAL_STUDENTS": "Total Number of Learners: {{count}}",
+    "PRESENT_STUDENTS": "Present Learners: {{count}}",
+    "ABSENT_STUDENTS": "Absent Learners: {{count}}",
     "PRESENT": "Present",
     "ABSENT": "Absent",
     "HALF_DAY": "Half Day",

diff --git a/public/locales/hi/common.json b/public/locales/hi/common.json
@@ -78,6 +78,8 @@
   },
   "ATTENDANCE": {
     "TOTAL_STUDENTS": "कुल छात्रों की संख्या: {{count}}",
+    "PRESENT_STUDENTS": "उपस्थित छात्र: {{count}}",
+    "ABSENT_STUDENTS": "अनुपस्थित छात्र: {{count}}",
     "PRESENT": "उपस्थित",
     "ABSENT": "अनुपस्थित",
     "HALF_DAY": "आधा दिन",

diff --git a/public/locales/mr/common.json b/public/locales/mr/common.json
@@ -78,6 +78,8 @@
   },
   "ATTENDANCE": {
     "TOTAL_STUDENTS": "एकूण विद्यार्थी: {{count}}",
+    "PRESENT_STUDENTS": "उपस्थित विद्यार्थी: {{count}}",
+    "ABSENT_STUDENTS": "अनुपस्थित विद्यार्थी: {{count}}",
     "MARK_ALL": "सर्व चिन्हित करा",
     "CLEAR": "स्पष्ट",
     "ATTENDANCE_MARKED_SUCCESSFULLY": "उपस्थिती यशस्वीरित्या चिन्हांकित केली गेली आहे",

diff --git a/src/components/MarkBulkAttendance.tsx b/src/components/MarkBulkAttendance.tsx
@@ -40,6 +40,8 @@ const MarkBulkAttendace: React.FC<MarkBulkAttendanceProps> = ({
   //   const [open, setOpen] = React.useState(false);
   const [showUpdateButton, setShowUpdateButton] = React.useState(false);
   const [cohortMemberList, setCohortMemberList] = React.useState<Array<{}>>([]);
+  const [presentCount, setPresentCount] = React.useState(0);
+  const [absentCount, setAbsentCount] = React.useState(0);
   const [bulkAttendanceStatus, setBulkAttendanceStatus] = React.useState('');
   const [isAllAttendanceMarked, setIsAllAttendanceMarked] =
     React.useState(false);
@@ -191,6 +193,8 @@ const MarkBulkAttendace: React.FC<MarkBulkAttendanceProps> = ({
                       });
                       if (newArray.length != 0) {
                         setCohortMemberList(newArray);
+                        setPresentCount(newArray.filter(user => user.attendance === "present").length);
+                        setAbsentCount(newArray.filter(user => user.attendance === "absent").length);
                         setNumberOfCohortMembers(newArray?.length);
                       } else {
                         setCohortMemberList(nameUserIdArray);
@@ -345,6 +349,32 @@ const MarkBulkAttendace: React.FC<MarkBulkAttendanceProps> = ({
                   count: numberOfCohortMembers,
                 })}
               </Typography>
+              <Box display={'flex'} justifyContent={'space-between'}>
+                        <Typography
+                          sx={{
+                            marginTop: '0px',
+                            marginLeft: '0.5rem',
+                            fontSize: '12px',
+                            color: theme.palette.warning['A200'],
+                          }}
+                        >
+                          {t('ATTENDANCE.PRESENT_STUDENTS', {
+                            count: presentCount,
+                          })}
+                        </Typography>
+                        <Typography
+                          sx={{
+                            marginTop: '0px',
+                            marginLeft: '0.5rem',
+                            fontSize: '12px',
+                            color: theme.palette.warning['A200'],
+                          }}
+                        >
+                          {t('ATTENDANCE.ABSENT_STUDENTS', {
+                            count: absentCount,
+                          })}
+                        </Typography>
+                        </Box>
               {cohortMemberList && cohortMemberList?.length != 0 ? (
                 <Box
                   height={'56vh'}

diff --git a/src/pages/dashboard.tsx b/src/pages/dashboard.tsx
@@ -70,6 +70,8 @@ const Dashboard: React.FC<DashboardProps> = () => {
   const [cohortsData, setCohortsData] = React.useState<Array<cohort>>([]);
   const [classId, setClassId] = React.useState('');
   const [cohortMemberList, setCohortMemberList] = React.useState<Array<{}>>([]);
+  const [presentCount, setPresentCount] = React.useState(0);
+  const [absentCount, setAbsentCount] = React.useState(0);
   const [showDetails, setShowDetails] = React.useState(false);
   const [handleSaveHasRun, setHandleSaveHasRun] = React.useState(false);
   const [selectedDate, setSelectedDate] = React.useState('');
@@ -258,6 +260,8 @@ const Dashboard: React.FC<DashboardProps> = () => {
                       if (newArray.length != 0) {
                         // newArray = newArray.filter(item => item.name);
                         setCohortMemberList(newArray);
+                        setPresentCount(newArray.filter(user => user.attendance === "present").length);
+                        setAbsentCount(newArray.filter(user => user.attendance === "absent").length);
                         setNumberOfCohortMembers(newArray?.length);
                       } else {
                         setCohortMemberList(nameUserIdArray);
@@ -739,6 +743,30 @@ const Dashboard: React.FC<DashboardProps> = () => {
                             count: numberOfCohortMembers,
                           })}
                         </Typography>
+                        <Box display={'flex'} justifyContent={'space-between'}>
+                        <Typography
+                          sx={{
+                            marginTop: '0px',
+                            fontSize: '12px',
+                            color: theme.palette.warning['A200'],
+                          }}
+                        >
+                          {t('ATTENDANCE.PRESENT_STUDENTS', {
+                            count: presentCount,
+                          })}
+                        </Typography>
+                        <Typography
+                          sx={{
+                            marginTop: '0px',
+                            fontSize: '12px',
+                            color: theme.palette.warning['A200'],
+                          }}
+                        >
+                          {t('ATTENDANCE.ABSENT_STUDENTS', {
+                            count: absentCount,
+                          })}
+                        </Typography>
+                        </Box>
                         {cohortMemberList && cohortMemberList?.length != 0 ? (
                           <Box
                             height={'56vh'}