Merge pull request #352 from suvarnakale/shiksha-2.0

Issue #1103 feat: UI issue fixes and data mapping changes
tekdi · Jul 5, 2024 · a8179f2 · a8179f2
2 parents 0a3bc27 + d7f2746
commit a8179f2
Show file tree

Hide file tree

Showing 8 changed files with 183 additions and 98 deletions.
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
@@ -77,7 +77,7 @@
     "MANAGE_USERS": "Manage Users",
     "FACILITATORS": "Facilitators",
     "CENTERS_ASSIGNED": "Centers Assigned in {{block}}",
-    "REASSIGN_CENTERS": "Re-assign Centers",
+    "REASSIGN_CENTERS": "Re-assign Center",
     "REASSIGN_BLOCKS_REQUEST": "Request to Re-assign Block",
     "ASSIGN": "Assign",
     "SEARCH_FACILITATORS": "Search Facilitators..",
@@ -252,20 +252,23 @@
     "NEW_BLOCK": "New Block",
     "BLOCK_NAME": "Block Name",
     "CREATE": "Create",
-    "SEARCH_BLOCKS": "Search Blocks"
+    "SEARCH_BLOCKS": "Search Blocks",
+    "REASSIGN_BLOCK_REQUESTED": "Reassign Block Requested Successfully!"
   },
   "CENTERS": {
     "CENTERS": "Centers",
     "REGULAR_CENTERS": "Regular Centers",
-    "REMOTE_CENTERS": "Remote Center",
+    "REMOTE_CENTERS": "Remote Centers",
+    "REMOTE_CENTER": "Remote Center",
     "REGULAR": "Regular",
     "REMOTE": "Remote",
     "SEARCH_BLOCKS": "Search Blocks",
     "BLOCK_REQUEST": "You are sending a request to the state Team Leader to re-assign the Block to this user",
     "NEW_CENTER": "New Center",
     "CENTER_TYPE": "Center Type",
     "UNIT_NAME": "Unit Name",
-    "NOTE": "Note: This will be the center name"
+    "NOTE": "Note: This will be the center name",
+    "CENTER_CREATED": "Center Created Successfully!"
   },
   "MANAGE_USERS": {
     "CENTERS_REQUESTED_SUCCESSFULLY": "Center Requested Successfully"

diff --git a/src/components/LearnersList.tsx b/src/components/LearnersList.tsx
@@ -27,6 +27,7 @@ import { Status, names } from '@/utils/app.constant';
 import ApartmentIcon from '@mui/icons-material/Apartment';
 import LocationOnOutlinedIcon from '@mui/icons-material/LocationOnOutlined';
 import ManageCentersModal from './ManageCentersModal';
+import { styled } from '@mui/system';
 
 type Anchor = 'bottom';
 const centerList = ['Nashik', 'Shirdi', 'kamptee'];
@@ -68,6 +69,12 @@ const LearnersList: React.FC<LearnerListProps> = ({
   const { t } = useTranslation();
   const [openCentersModal, setOpenCentersModal] = React.useState(false);
 
+  const CustomLink = styled(Link)(({ theme }) => ({
+    textDecoration: 'underline',
+    textDecorationColor: theme?.palette?.secondary.main,
+    textDecorationThickness: '1px',
+  }));
+
   useEffect(() => {
     if (reloadState) {
       setReloadState(false);
@@ -359,7 +366,7 @@ const LearnersList: React.FC<LearnerListProps> = ({
                   {learnerName}
                 </Box>
               ) : (
-                <Link className="word-break" href="#">
+                <CustomLink className="word-break" href="#">
                   <Typography
                     onClick={() => {
                       handleOpenModalLearner(userId!);
@@ -376,7 +383,7 @@ const LearnersList: React.FC<LearnerListProps> = ({
                   >
                     {learnerName}
                   </Typography>
-                </Link>
+                </CustomLink>
               )}
 
               <Box
@@ -538,7 +545,7 @@ const LearnersList: React.FC<LearnerListProps> = ({
                   name: isDropout ? 'unmark-drop-out' : 'mark-drop-out',
                 },
                 {
-                  label: t('COMMON.REMOVE_FROM_CENTER'),
+                  label: t('COMMON.DELETE_USER'),
                   icon: (
                     <DeleteOutlineIcon
                       sx={{ color: theme.palette.warning['300'] }}

diff --git a/src/components/ManageCentersModal.tsx b/src/components/ManageCentersModal.tsx
@@ -49,7 +49,7 @@ const ManageCentersModal: React.FC<ManageUsersModalProps> = ({
     bgcolor: theme.palette.warning['A400'],
     boxShadow: 24,
     borderRadius: '16px',
-    height: '526px',
+    height: 'auto',
     '@media (min-width: 600px)': {
       width: '450px',
     },
@@ -111,7 +111,7 @@ const ManageCentersModal: React.FC<ManageUsersModalProps> = ({
                 }}
                 component="h2"
               >
-                {t('COMMON.MANAGE_CENTERS')}
+                {t('COMMON.REASSIGN_CENTERS')}
               </Typography>
             </Box>
             <CloseIcon

diff --git a/src/components/ManageUser.tsx b/src/components/ManageUser.tsx
@@ -34,9 +34,10 @@ import { editEditUser } from '@/services/ProfileService';
 import ConfirmationModal from '@/components/ConfirmationModal';
 import { Status } from '@/utils/app.constant';
 import AddIcon from '@mui/icons-material/Add';
-
 import LearnersList from '@/components/LearnersList';
 import Link from 'next/link';
+import { styled } from '@mui/system';
+
 import { getFacilitatorList } from '@/services/MyClassDetailsService';
 interface Cohort {
   cohortId: string;
@@ -107,6 +108,12 @@ const manageUsers: React.FC<ManageUsersProps> = ({
   const [reassignBlockRequestModalOpen, setReassignBlockRequestModalOpen] =
     React.useState<boolean>(false);
 
+  const CustomLink = styled(Link)(({ theme }) => ({
+    textDecoration: 'underline',
+    textDecorationColor: theme?.palette?.secondary.main,
+    textDecorationThickness: '1px',
+  }));
+
   useEffect(() => {
     const getFacilitator = async () => {
       setLoading(true);
@@ -332,7 +339,7 @@ const manageUsers: React.FC<ManageUsersProps> = ({
       // if (response) {
       //   centers;
       //   handleCloseCentersModal();
-      //   toggleDrawer('bottom', false, '');
+      //      setState({ ...state, bottom: false });
       // }
     } catch (error) {
       console.error('Error assigning centers:', error);
@@ -354,6 +361,11 @@ const manageUsers: React.FC<ManageUsersProps> = ({
   };
   const noop = () => {};
 
+  const handleRequestBlockAction = () => {
+    showToastMessage(t('BLOCKS.REASSIGN_BLOCK_REQUESTED'), 'success');
+    setState({ ...state, bottom: false });
+  };
+
   return (
     <>
       {/* <Header /> */}
@@ -508,7 +520,7 @@ const manageUsers: React.FC<ManageUsersProps> = ({
                                 color: theme.palette.warning['300'],
                               }}
                             >
-                              <Link className="word-break" href="#">
+                              <CustomLink className="word-break" href="#">
                                 <Typography
                                   onClick={() => {
                                     handleLearnerFullProfile(user.userId!);
@@ -522,7 +534,7 @@ const manageUsers: React.FC<ManageUsersProps> = ({
                                 >
                                   {user.name}
                                 </Typography>
-                              </Link>
+                              </CustomLink>
 
                               <Box
                                 sx={{
@@ -571,6 +583,20 @@ const manageUsers: React.FC<ManageUsersProps> = ({
                           </Box>
                         </Box>
                       ))}
+                    {!users?.length && (
+                      <Box
+                        sx={{
+                          m: '1.125rem',
+                          display: 'flex',
+                          justifyContent: 'left',
+                          alignItems: 'center',
+                        }}
+                      >
+                        <Typography style={{ fontWeight: 'bold' }}>
+                          {t('COMMON.NO_DATA_FOUND')}
+                        </Typography>
+                      </Box>
+                    )}
                   </Box>
                 </Box>
               </Box>
@@ -662,6 +688,7 @@ const manageUsers: React.FC<ManageUsersProps> = ({
 
             <ConfirmationModal
               message={t('CENTERS.BLOCK_REQUEST')}
+              handleAction={handleRequestBlockAction}
               buttonNames={{
                 primary: t('COMMON.SEND_REQUEST'),
                 secondary: t('COMMON.CANCEL'),

diff --git a/src/components/center/CreateCenterModal.tsx b/src/components/center/CreateCenterModal.tsx
@@ -18,6 +18,7 @@ import CloseIcon from '@mui/icons-material/Close';
 import { useTranslation } from 'next-i18next';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
 import { useTheme, styled } from '@mui/material/styles';
+import { showToastMessage } from '../Toastify';
 
 interface CreateBlockModalProps {
   open: boolean;
@@ -54,7 +55,7 @@ const CreateCenterModal: React.FC<CreateBlockModalProps> = ({
   const handleCreateButtonClick = () => {
     console.log('Entered Center Name:', centerName);
     console.log('Selected Center Type:', centerType);
-
+    showToastMessage(t('CENTERS.CENTER_CREATED'), 'success');
     handleClose();
   };
 
@@ -101,12 +102,10 @@ const CreateCenterModal: React.FC<CreateBlockModalProps> = ({
           </Box>
           <Divider sx={{ mb: 2, mx: -2 }} />
           <FormControl component="fieldset" sx={{ mb: 2 }}>
-            <FormLabel sx={{ fontSize: '12px' }} component="legend">{t('CENTERS.CENTER_TYPE')}</FormLabel>
-            <RadioGroup
-              row
-              value={centerType}
-              onChange={handleRadioChange}
-            >
+            <FormLabel sx={{ fontSize: '12px' }} component="legend">
+              {t('CENTERS.CENTER_TYPE')}
+            </FormLabel>
+            <RadioGroup row value={centerType} onChange={handleRadioChange}>
               <FormControlLabel
                 value="Regular"
                 control={<CustomRadio />}

diff --git a/src/pages/blocks/centre.tsx b/src/pages/blocks/centre.tsx
@@ -256,7 +256,7 @@ const Blocks: React.FC<BlocksProps> = () => {
               ))}
           </Box>
           <Typography variant="h5" color={theme?.palette?.text?.primary} mt={2}>
-            {t('CENTERS.REMOTE_CENTERS')}
+            {t('CENTERS.REMOTE_CENTER')}
           </Typography>
           <Box
             sx={{