Skip to content

Commit

Permalink
Merge pull request #447 from AkshataKatwal16/reassign-cohorts
Browse files Browse the repository at this point in the history
Issue feat:Removed archived centers from addFacilitator modal and center selection formcontrol
  • Loading branch information
itsvick authored Nov 27, 2024
2 parents 4649092 + 90f8c83 commit 796aa99
Showing 2 changed files with 45 additions and 21 deletions.
15 changes: 9 additions & 6 deletions src/components/AddFacilitator.tsx
Original file line number Diff line number Diff line change
@@ -94,12 +94,15 @@ const AddFacilitatorModal: React.FC<AddFacilitatorModalprops> = ({
if (typeof window !== 'undefined' && window.localStorage) {
const CenterList = localStorage.getItem('CenterList');
const centerOptions = CenterList ? JSON.parse(CenterList) : [];
centerOptionsList = centerOptions.map(
(center: { cohortId: string; cohortName: string }) => ({
value: center.cohortId,
label: center.cohortName,
})
);
console.log("centerOptions",centerOptions);

centerOptionsList = centerOptions
.filter((center: { cohortStatus: string }) => center.cohortStatus === 'active')
.map((center: { cohortId: string; cohortName: string }) => ({
value: center.cohortId,
label: center.cohortName,
}));

console.log(centerOptionsList);
}
const assignCentersField: Field = {
51 changes: 36 additions & 15 deletions src/components/CohortSelectionSection.tsx
Original file line number Diff line number Diff line change
@@ -104,6 +104,9 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
const { t } = useTranslation();
const setCohorts = useStore((state) => state.setCohorts);
const setBlock = useStore((state) => state.setBlock);
const [filteredCohortData, setFilteredCohortData] = React.useState<any>();
const [filteredManipulatedCohortData, setFilteredManipulatedCohortData] = React.useState<any>();


const store = manageUserStore();

@@ -140,6 +143,22 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
}
}, [router, setClassId, setIsAuthenticated, setUserId]);

useEffect(() => {
const filteredData = cohortsData?.filter(
(cohort: any) =>

cohort?.status?.toLowerCase() === "active"
);
setFilteredCohortData(filteredData);
const filteredManipulatedData = manipulatedCohortData?.filter(
(cohort: any) =>

cohort?.status?.toLowerCase() === "active"
);
setFilteredManipulatedCohortData(filteredManipulatedData);
console.log(filteredData)
}, [manipulatedCohortData, cohortsData]);

useEffect(() => {
if (userId) {
setLoading(true);
@@ -228,6 +247,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
cohortId: item?.cohortId,
parentId: item?.parentId,
name: item?.cohortName || item?.name,
status: item?.status,
}))
?.filter(Boolean);
setCohortsData(filteredData);
@@ -274,6 +294,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
parentId: item?.parentId,
name: item?.cohortName || item?.name,
typeOfCohort: typeOfCohort || t('ATTENDANCE.UNKNOWN'),
status: item?.status,
};
})
?.filter(Boolean);
@@ -368,7 +389,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
{loading && (
<Loader showBackdrop={true} loadingText={t('COMMON.LOADING')} />
)}
{!loading && cohortsData && (
{!loading && filteredCohortData && (
<Box
sx={{
'@media (min-width: 900px)': {
@@ -381,7 +402,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
},
}}
>
{!loading && cohortsData && (
{!loading && filteredCohortData && (
<Box>
{blockName ? (
<Box>
@@ -394,7 +415,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
</Typography>
<Box className="mt-md-16">
<Box sx={{ minWidth: 120, gap: '15px' }} display={'flex'}>
{cohortsData?.length > 1 ? (
{filteredCohortData?.length > 1 ? (
<FormControl
className="drawer-select"
sx={{
@@ -444,8 +465,8 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
/>
)}
>
{cohortsData?.length !== 0 ? (
manipulatedCohortData?.map((cohort) => (
{filteredCohortData?.length !== 0 ? (
filteredManipulatedCohortData?.map((cohort: any) => (
<MenuItem
key={cohort.cohortId}
value={cohort.cohortId}
@@ -479,7 +500,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
</FormControl>
) : (
<Typography color={theme.palette.warning['300']}>
{toPascalCase(cohortsData[0]?.name)}
{toPascalCase(filteredCohortData[0]?.name)}
</Typography>
)}
</Box>
@@ -489,7 +510,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
<Box>
<Box className="mt-md-16">
<Box sx={{ minWidth: 120, gap: '15px' }} display={'flex'}>
{cohortsData?.length > 1 ? (
{filteredCohortData?.length > 1 ? (
<FormControl
className={showFloatingLabel ? '' : 'drawer-select'}
sx={{ m: 0, width: '100%' }}
@@ -502,7 +523,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
<Select
labelId="center-select-label"
label={showFloatingLabel ? t('COMMON.CENTER') : ''}
value={classId ? classId : cohortsData[0]?.cohortId}
value={classId ? classId : filteredCohortData[0]?.cohortId}
onChange={handleCohortSelection}
// displayEmpty
// style={{ borderRadius: '4px' }}
@@ -550,7 +571,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
}
}
>
{cohortsData?.length !== 0 ? (
{filteredCohortData?.length !== 0 ? (
manipulatedCohortData?.map((cohort) => (
<MenuItem
key={cohort.cohortId}
@@ -581,7 +602,7 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
</FormControl>
) : (
<>
{showDisabledDropDown && cohortsData?.length === 1 ? (
{showDisabledDropDown && filteredCohortData?.length === 1 ? (
<FormControl
disabled={true}
className={
@@ -599,25 +620,25 @@ const CohortSelectionSection: React.FC<CohortSelectionSectionProps> = ({
label={
showFloatingLabel ? t('COMMON.CENTER') : ''
}
value={cohortsData[0]?.cohortId}
value={filteredCohortData[0]?.cohortId}
>
<MenuItem
key={cohortsData[0]?.cohortId}
value={cohortsData[0]?.cohortId}
key={filteredCohortData[0]?.cohortId}
value={filteredCohortData[0]?.cohortId}
style={{
fontWeight: '500',
fontSize: '14px',
color: theme.palette.warning['A200'],
textTransform: 'capitalize',
}}
>
{cohortsData[0]?.name}
{filteredCohortData[0]?.name}
</MenuItem>
</Select>
</FormControl>
) : (
<Typography color={theme.palette.warning['300']}>
{cohortsData[0]?.name}
{filteredCohortData[0]?.name}
</Typography>
)}
</>

0 comments on commit 796aa99

Please sign in to comment.