Skip to content

Commit

Permalink
Merge branch 'shiksha-2.0' of github.com:tekdi/shiksha-frontend into …
Browse files Browse the repository at this point in the history
…shiksha-2.0
  • Loading branch information
itsvick committed Jun 21, 2024
2 parents f6fc3c5 + 6f5d9ee commit 95b6340
Show file tree
Hide file tree
Showing 6 changed files with 170 additions and 96 deletions.
39 changes: 29 additions & 10 deletions app.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,21 +4,40 @@ export const dashboardDaysLimit: number = 30;
export const modifyAttendanceLimit: number = 6;
export const toastAutoHideDuration: number = 5000; // 5 seconds

// export const dropoutReasons = [
// {
// label: 'UNABLE_TO_COPE_WITH_STUDIES',
// value: 'unable_to_cope_with_studies',
// },
// { label: 'FAMILY_RESPONSIBILITIES', value: 'family_responsibilities' },
// {
// label: 'NEED_TO_GO_TO_WORK_OWN_WORK',
// value: 'need_to_go_to_work_own_work',
// },
// { label: 'MARRIAGE', value: 'marriage' },
// { label: 'ILLNESS', value: 'illness' },
// { label: 'MIGRATION', value: 'migration' },
// { label: 'PREGNANCY', value: 'pregnancy' },
// { label: 'DOCUMENT_ISSUE', value: 'document_issue' },
// { label: 'DISTANCE_ISSUE', value: 'distance_issue' },
// { label: 'SCHOOL_ADMISSION', value: 'school_admission' },
// ];

export const dropoutReasons = [
{
label: 'UNABLE_TO_COPE_WITH_STUDIES',
value: 'unable_to_cope_with_studies',
value: 'Unable to cope with studies',
},
{ label: 'FAMILY_RESPONSIBILITIES', value: 'family_responsibilities' },
{ label: 'FAMILY_RESPONSIBILITIES', value: 'Family responsibility' },
{
label: 'NEED_TO_GO_TO_WORK_OWN_WORK',
value: 'need_to_go_to_work_own_work',
value: 'Need to go to work/ own work',
},
{ label: 'MARRIAGE', value: 'marriage' },
{ label: 'ILLNESS', value: 'illness' },
{ label: 'MIGRATION', value: 'migration' },
{ label: 'PREGNANCY', value: 'pregnancy' },
{ label: 'DOCUMENT_ISSUE', value: 'document_issue' },
{ label: 'DISTANCE_ISSUE', value: 'distance_issue' },
{ label: 'SCHOOL_ADMISSION', value: 'school_admission' },
{ label: 'MARRIAGE', value: 'Marriage' },
{ label: 'ILLNESS', value: 'Illness' },
{ label: 'MIGRATION', value: 'Migration' },
{ label: 'PREGNANCY', value: 'Pregnancy' },
{ label: 'DOCUMENT_ISSUE', value: 'Document issue' },
{ label: 'DISTANCE_ISSUE', value: 'Distance issue' },
{ label: 'SCHOOL_ADMISSION', value: 'School admission' },
];
2 changes: 1 addition & 1 deletion src/components/CohortLearnerList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ const CohortLearnerList : React.FC<CohortLearnerListProp> = ({cohortId, reloadSt
try {
if (cohortId) {
const page = 0;
const filters = cohortId;
const filters = {cohortId: cohortId};
const response = await getMyCohortMemberList({
limit,
page,
Expand Down
147 changes: 92 additions & 55 deletions src/components/DropOutModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,19 +13,21 @@ import {
SelectChangeEvent,
Typography,
} from '@mui/material';
import { useTheme } from '@mui/material/styles';

import CloseIcon from '@mui/icons-material/Close';
import { useTranslation } from 'next-i18next';
import { dropoutReasons } from '../../app.config';
import { updateCohortMemberStatus } from '@/services/MyClassDetailsService';
import ReactGA from 'react-ga4';
import { dropoutReasons } from '../../app.config';
import { showToastMessage } from './Toastify';
import { updateCohortMemberStatus } from '@/services/MyClassDetailsService';
import { useTheme } from '@mui/material/styles';
import { useTranslation } from 'next-i18next';

interface DropOutModalProps {
open: boolean;
onClose: (confirmed: boolean, reason?: string) => void;
cohortMembershipId: string | number;
isButtonAbsent?: boolean;
statusReason?: string;
reloadState: boolean;
setReloadState: React.Dispatch<React.SetStateAction<boolean>>;
}
Expand All @@ -34,8 +36,10 @@ function DropOutModal({
open,
onClose,
cohortMembershipId,
reloadState,
setReloadState
isButtonAbsent,
statusReason,
reloadState,
setReloadState,
}: DropOutModalProps) {
const [selectedReason, setSelectedReason] = React.useState<string>('');
const [isButtonDisabled, setIsButtonDisabled] = React.useState<boolean>(true);
Expand All @@ -46,8 +50,8 @@ function DropOutModal({

React.useEffect(() => {
if (reloadState) {
setReloadState(false);
window.location.reload();
setReloadState(false);
// window.location.reload();
}
}, [reloadState, setReloadState]);

Expand All @@ -59,7 +63,7 @@ function DropOutModal({
width: '85%',
boxShadow: 24,
bgcolor: '#fff',
borderRadius: '24px',
borderRadius: '16px',
'@media (min-width: 600px)': {
width: '450px',
},
Expand All @@ -74,27 +78,29 @@ function DropOutModal({
try {
onClose(true, selectedReason);
setLoading(true);

if (selectedReason && cohortMembershipId) {
const memberStatus = 'dropout';
const statusReason = selectedReason;
const membershipId = cohortMembershipId;

const response = await updateCohortMemberStatus({
memberStatus,
statusReason,
membershipId,
});

if (response?.responseCode !== 200 || response?.params?.err) {
ReactGA.event('dropout-student-error', { cohortMembershipId: membershipId });
ReactGA.event('dropout-student-error', {
cohortMembershipId: membershipId,
});
// throw new Error(response.params?.errmsg || 'An error occurred while updating the user.');
}else{
} else {
ReactGA.event('dropout-student-successful', {
cohortMembershipId: membershipId,
});
showToastMessage(t('COMMON.LEARNER_UNMARKED_DROPOUT'),'success');
setReloadState(true)
showToastMessage(t('COMMON.LEARNER_MARKED_DROPOUT'), 'success');
setReloadState(true);
}
setIsButtonDisabled(true);
}
Expand All @@ -104,7 +110,7 @@ function DropOutModal({
} finally {
setLoading(false);
}
};
};

return (
<React.Fragment>
Expand Down Expand Up @@ -140,52 +146,83 @@ function DropOutModal({
/>
</Box>
<Divider />
<Box sx={{ padding: '10px 18px' }}>
<FormControl sx={{ mt: 1, width: '100%' }}>
<InputLabel
sx={{ fontSize: '16px', color: theme.palette.warning['300'] }}
id="demo-multiple-name-label"
{isButtonAbsent ? (
<Box sx={{ padding: '18px 16px', width: '100%' }}>
<Typography
variant="h2"
sx={{
color: theme.palette.warning['400'],
fontSize: '14px',
}}
component="h2"
>
{t('COMMON.REASON_FOR_DROPOUT')}
</InputLabel>
<Select
labelId="demo-multiple-name-label"
id="demo-multiple-name"
input={<OutlinedInput label="Reason for Dropout" />}
onChange={handleSelection}
</Typography>

<Typography
variant="h2"
sx={{
color: theme.palette.warning['300'],
fontSize: '16px',
}}
component="h2"
>
{dropoutReasons?.map((reason) => (
<MenuItem
key={reason.value}
value={reason.value}
{statusReason}
</Typography>
</Box>
) : (
<>
<Box sx={{ padding: '10px 18px' }}>
<FormControl sx={{ mt: 1, width: '100%' }}>
<InputLabel
sx={{
fontSize: '16px',
color: theme.palette.warning['300'],
}}
id="demo-multiple-name-label"
>
{reason.label
.replace(/_/g, ' ')
.toLowerCase()
.replace(/^\w/, (c) => c.toUpperCase())}
</MenuItem>
))}
</Select>
</FormControl>
</Box>
<Box mt={1.5}>
<Divider />
</Box>
<Box p={'18px'}>
<Button
className="w-100"
sx={{ boxShadow: 'none' }}
variant="contained"
onClick={handleMarkDropout}
disabled={isButtonDisabled}
>
{t('COMMON.MARK_DROP_OUT')}
</Button>
</Box>
{t('COMMON.REASON_FOR_DROPOUT')}
</InputLabel>
<Select
labelId="demo-multiple-name-label"
id="demo-multiple-name"
input={<OutlinedInput label="Reason for Dropout" />}
onChange={handleSelection}
>
{dropoutReasons?.map((reason) => (
<MenuItem
key={reason.value}
value={reason.value}
sx={{
fontSize: '16px',
color: theme.palette.warning['300'],
}}
>
{reason.label
.replace(/_/g, ' ')
.toLowerCase()
.replace(/^\w/, (c) => c.toUpperCase())}
</MenuItem>
))}
</Select>
</FormControl>
</Box>
<Box mt={1.5}>
<Divider />
</Box>
<Box p={'18px'}>
<Button
className="w-100"
sx={{ boxShadow: 'none' }}
variant="contained"
onClick={handleMarkDropout}
disabled={isButtonDisabled}
>
{t('COMMON.MARK_DROP_OUT')}
</Button>
</Box>
</>
)}
</Box>
</Modal>
</React.Fragment>
Expand Down
22 changes: 19 additions & 3 deletions src/components/LearnersList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ const LearnersList: React.FC<LearnerListProps> = ({
useEffect(()=>{
if (reloadState) {
setReloadState(false);
window.location.reload();
// window.location.reload();
}
},[reloadState, setReloadState])

Expand Down Expand Up @@ -100,6 +100,7 @@ const LearnersList: React.FC<LearnerListProps> = ({
} else {
setConfirmationModalOpen(true);
}
setState({ ...state, bottom: false });
};

const handleAction = async () => {
Expand Down Expand Up @@ -132,7 +133,7 @@ const LearnersList: React.FC<LearnerListProps> = ({
setLoading(false);
}
setConfirmationModalOpen(false);
handleCloseBottomDrawer();
setState({ ...state, bottom: false });
};

const handleCloseModel = () => {
Expand All @@ -145,6 +146,7 @@ const LearnersList: React.FC<LearnerListProps> = ({

const handleDroppedOutLabelClick = () => {
console.log('handleDroppedOutLabelClick');
setShowModal(true);
};

const renderCustomContent = () => {
Expand Down Expand Up @@ -296,13 +298,27 @@ const LearnersList: React.FC<LearnerListProps> = ({
renderCustomContent={renderCustomContent}
/>

<DropOutModal
{
isDropout?
<DropOutModal
open={showModal}
onClose={() => setShowModal(false)}
cohortMembershipId={cohortMembershipId}
isButtonAbsent = {true}
statusReason = {statusReason}
reloadState={reloadState}
setReloadState={setReloadState}
/>
:
<DropOutModal
open={showModal}
onClose={() => setShowModal(false)}
cohortMembershipId={cohortMembershipId}
reloadState={reloadState}
setReloadState={setReloadState}
/>
}

<ConfirmationModal
message={t('COMMON.SURE_REMOVE')}
handleAction={handleAction}
Expand Down
Loading

0 comments on commit 95b6340

Please sign in to comment.