Merge pull request #109 from Aar-if/improvements

Issue #PS-1676 feat: Dashboard Page Inconsistencies
tekdi · Aug 8, 2024 · f5c5dba · f5c5dba
2 parents 704a709 + 5dda9b1
commit f5c5dba
Show file tree

Hide file tree

Showing 6 changed files with 60 additions and 42 deletions.
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
@@ -72,7 +72,7 @@
     "SURE_UPDATE": "Are you sure you want to update this attendance?",
     "SURE_REMOVE": "Are you sure you want to remove this learner?",
     "SURE_REASSIGN_CENTER": "Are you sure you want to re-assign Center to this user?",
-    "SURE_CLOSE": "Are you sure you want to close?",
+    "SURE_CLOSE": "Are you sure you want to close without saving?",
     "LEARNER_LIST": "Learners List",
     "FACILITATOR_LIST": "Facilitators List",
     "FILTERS": "Filters",
@@ -168,11 +168,11 @@
     "ATTENDANCE": "Attendance (%)"
   },
   "ATTENDANCE": {
-    "TOTAL_STUDENTS": "Total Number of Learners: {{count}}",
+    "TOTAL_STUDENTS": "Total Learners: {{count}}",
     "ACTIVE_STUDENTS": "Active Learners: {{count}}",
     "DROPOUT_STUDENTS": "Dropout Learners: {{count}}",
-    "PRESENT_STUDENTS": "Present Learners: {{count}}",
-    "ABSENT_STUDENTS": "Absent Learners: {{count}}",
+    "PRESENT_STUDENTS": "Present: {{count}}",
+    "ABSENT_STUDENTS": "Absent: {{count}}",
     "PRESENT": "Present",
     "ABSENT": "Absent",
     "HALF_DAY": "Half Day",

diff --git a/public/locales/hi/common.json b/public/locales/hi/common.json
@@ -70,7 +70,7 @@
     "SURE_LOGOUT": "क्या आप वाकई लोगआउट करना चाहते हैं?",
     "SURE_UPDATE": "क्या आप इस उपस्थिति को अपडेट करना चाहते हैं?",
     "SURE_REMOVE": "क्या आप वाकई इस शिक्षार्थी को हटाना चाहते हैं?",
-    "SURE_CLOSE": "क्या आप वाकई बंद करना चाहते हैं?",
+    "SURE_CLOSE": "क्या आप वाकई बिना सहेजे बंद करना चाहते हैं?",
     "LEARNER_LIST": "अभियांत्रिकी सूची",
     "FACILITATOR_LIST": "प्रशिक्षकों की सूची",
     "FILTERS": "फिल्टर्स",
@@ -134,7 +134,7 @@
     "BLOCK_AVERAGE_ATTENDANCE": "ब्लॉक औसत उपस्थिति"
   },
   "ATTENDANCE": {
-    "TOTAL_STUDENTS": "कुल छात्रों की संख्या: {{count}}",
+    "TOTAL_STUDENTS": "कुल संख्या: {{count}}",
     "ACTIVE_STUDENTS": "सक्रिय शिक्षार्थी: {{count}}",
     "DROPOUT_STUDENTS": "छोड़े हुए छात्र: {{count}}",
     "PRESENT_STUDENTS": "उपस्थित छात्र: {{count}}",

diff --git a/public/locales/mr/common.json b/public/locales/mr/common.json
@@ -70,7 +70,7 @@
     "SURE_LOGOUT": "तुम्हाला खाते बंद करायचं आहे का?",
     "SURE_UPDATE": "तुम्हाला ही उपस्थिती अपडेट करायची आहे का?",
     "SURE_REMOVE": "आपण खरोखरच या विद्यार्थ्याला काढून टाकू इच्छिता का?",
-    "SURE_CLOSE": "तुम्हाला हे बंद करायचं आहे का?",
+    "SURE_CLOSE": "तुमची खात्री आहे की तुम्ही सेव्ह न करता बंद करू इच्छिता?",
     "LEARNER_LIST": "शिक्षार्थ्यांची यादी",
     "FACILITATOR_LIST": "सुविधादारांची यादी",
     "FILTERS": "फिल्टर्स",

diff --git a/public/locales/or/common.json b/public/locales/or/common.json
@@ -60,6 +60,7 @@
     "UNMARK_DROP_OUT": " ଡ୍ରପ୍ ଆଉଟ୍ ଭାବରେ ଅପସାରଣ କରନ୍ତୁ",
     "SOMETHING_WENT_WRONG": "କିଛି ଭୁଲ ହେଇଗଲା।",
     "SURE_REMOVE": "ଆପଣ ନିଶ୍ଚିତ ଏହି ଶିକ୍ଷାର୍ଥୀକୁ ହଟାଇବାକୁ ଚାହୁଁଛନ୍ତି କି?",
+    "SURE_CLOSE": "ଆପଣ ସ saving ୍ଚୟ ନକରି ବନ୍ଦ କରିବାକୁ ଚାହୁଁଛନ୍ତି କି?",
     "LEARNER_MARKED_DROPOUT": "ଶିକ୍ଷାର୍ଥୀକୁ ଡ୍ରପ୍ ଆଉଟ୍ ଭାବେ ଚିହ୍ନିତ କରାଯାଇଛି",
     "LEARNER_UNMARKED_DROPOUT": "ଶିକ୍ଷାର୍ଥୀକୁ ଡ୍ରପ୍ ଆଉଟ୍ ଭାବେ ଅଚିହ୍ନିତ କରାଯାଇଛି",
     "LEARNER_REMOVED": "ଶିକ୍ଷାର୍ଥୀ କୁ ହଟାଇ ଦିଆଯାଇଛି",

diff --git a/src/components/CohortSelectionSection.tsx b/src/components/CohortSelectionSection.tsx
@@ -20,6 +20,7 @@ import ReactGA from 'react-ga4';
 import Loader from './Loader';
 import { showToastMessage } from './Toastify';
 import manageUserStore from '@/store/manageUserStore';
+import { ArrowDropDownIcon } from '@mui/x-date-pickers/icons';
 
 interface CohortSelectionSectionProps {
   classId: string;
@@ -324,6 +325,16 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
                               width: '100%',
                               marginBottom: '0rem',
                             }}
+                            MenuProps={{
+                              PaperProps: {
+                                style: {
+                                  maxHeight: 250,
+                                },
+                              },
+                            }}
+                            IconComponent={(props) => (
+                              <ArrowDropDownIcon {...props} style={{ color: 'black' }} />
+                            )}
                           >
                             {cohortsData?.length !== 0 ? (
                               manipulatedCohortData?.map((cohort) => (
@@ -335,6 +346,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
                                     fontSize: '14px',
                                     color: '#4D4639',
                                     textTransform: 'capitalize',
+
                                   }}
                                 >
                                   {cohort.name}

diff --git a/src/components/MarkBulkAttendance.tsx b/src/components/MarkBulkAttendance.tsx
@@ -461,20 +461,40 @@ const MarkBulkAttendance: React.FC<MarkBulkAttendanceProps> = ({
                 <Loader showBackdrop={true} loadingText={t('COMMON.LOADING')} />
               )}
 
-              {dropoutCount > 0 ? (
-                <Box display={'flex'} justifyContent={'space-between'}>
-                  <Typography
-                    sx={{
-                      marginTop: '10px',
-                      fontSize: '12px',
-                      color: theme.palette.warning['A200'],
-                      padding: '0 10px',
-                    }}
-                  >
-                    {t('ATTENDANCE.ACTIVE_STUDENTS', {
-                      count: numberOfCohortMembers - dropoutCount,
-                    })}
-                  </Typography>
+              <Box
+                display={'flex'}
+                flexDirection="row"
+                justifyContent={'space-between'}
+              >
+                {dropoutCount > 0 ? (
+                  <>
+                    <Typography
+                      sx={{
+                        marginTop: '10px',
+                        fontSize: '12px',
+                        color: theme.palette.warning['A200'],
+                        padding: '0 10px',
+                      }}
+                    >
+                      {t('ATTENDANCE.ACTIVE_STUDENTS', {
+                        count: numberOfCohortMembers - dropoutCount,
+                      })}
+                    </Typography>
+                    <Typography
+                      sx={{
+                        marginTop: '10px',
+                        marginLeft: '0.5rem',
+                        fontSize: '12px',
+                        color: theme.palette.warning['A200'],
+                        padding: '0 10px',
+                      }}
+                    >
+                      {t('ATTENDANCE.DROPOUT_STUDENTS', {
+                        count: dropoutCount,
+                      })}
+                    </Typography>
+                  </>
+                ) : (
                   <Typography
                     sx={{
                       marginTop: '10px',
@@ -484,31 +504,15 @@ const MarkBulkAttendance: React.FC<MarkBulkAttendanceProps> = ({
                       padding: '0 10px',
                     }}
                   >
-                    {t('ATTENDANCE.DROPOUT_STUDENTS', {
-                      count: dropoutCount,
+                    {t('ATTENDANCE.TOTAL_STUDENTS', {
+                      count: numberOfCohortMembers,
                     })}
                   </Typography>
-                </Box>
-              ) : (
-                <Typography
-                  sx={{
-                    marginTop: '10px',
-                    marginLeft: '0.5rem',
-                    fontSize: '12px',
-                    color: theme.palette.warning['A200'],
-                    padding: '0 10px',
-                  }}
-                >
-                  {t('ATTENDANCE.TOTAL_STUDENTS', {
-                    count: numberOfCohortMembers,
-                  })}
-                </Typography>
-              )}
+                )}
 
-              <Box display={'flex'} justifyContent={'space-between'}>
                 <Typography
                   sx={{
-                    marginTop: '0px',
+                    marginTop: '10px',
                     marginLeft: '0.5rem',
                     fontSize: '12px',
                     color: theme.palette.warning['A200'],
@@ -520,7 +524,7 @@ const MarkBulkAttendance: React.FC<MarkBulkAttendanceProps> = ({
                 </Typography>
                 <Typography
                   sx={{
-                    marginTop: '0px',
+                    marginTop: '10px',
                     marginLeft: '0.5rem',
                     fontSize: '12px',
                     color: theme.palette.warning['A200'],
@@ -532,6 +536,7 @@ const MarkBulkAttendance: React.FC<MarkBulkAttendanceProps> = ({
                   })}
                 </Typography>
               </Box>
+
               {cohortMemberList && cohortMemberList?.length != 0 ? (
                 <Box
                   height={'64%'}