Refactor AnnouncementsTab to use switch case

This commit is contained in:
Leonardo Murça 2022-08-17 20:18:04 -03:00
parent c9a099dd88
commit 87e7dba5a0

View file

@ -16,8 +16,12 @@ import jitsiLogo from '../../../assets/jitsi.svg';
function AnnouncementsTab({ layoutType, announcementsTabData, classroom }) {
const { container } = styles[layoutType];
const layoutResolver = (state, layoutType) => {
if (layoutType === 'desktop') {
return announcementsTabData && announcementsTabData.state === 'loading' ? (
switch (state) {
case 'loading':
return (
<Grid sx={container} container spacing={2}>
<Grid sx={{ padding: '0 !important' }} item xs={4}>
{createArrayFrom1ToN(3).map(i => (
@ -42,7 +46,10 @@ function AnnouncementsTab({ layoutType, announcementsTabData, classroom }) {
))}
</Grid>
</Grid>
) : announcementsTabData.state === 'gone' ? null : (
);
case 'idle':
return (
<Grid sx={container} container spacing={2}>
<Grid sx={{ padding: '0 !important' }} item xs={4}>
<Stack gap="30px">
@ -93,7 +100,9 @@ function AnnouncementsTab({ layoutType, announcementsTabData, classroom }) {
variant="elevation"
>
<Stack justifyContent="flex-start" spacing={1}>
<h3 style={{ fontWeight: 500 }}>Horários de Atendimento</h3>
<h3 style={{ fontWeight: 500 }}>
Horários de Atendimento
</h3>
{classroom.appointmentSlots.map((appts, index) => (
<Typography key={index} variant="body1">
{appts.weekDay}, {appts.start}h - {appts.end}h
@ -122,8 +131,17 @@ function AnnouncementsTab({ layoutType, announcementsTabData, classroom }) {
</Grid>
</Grid>
);
case 'gone':
return null;
default:
return null;
}
} else if (layoutType === 'mobile') {
return announcementsTabData && announcementsTabData.state === 'loading' ? (
switch (state) {
case 'loading':
return (
<Stack
alignItems="center"
justifyContent="center"
@ -151,7 +169,10 @@ function AnnouncementsTab({ layoutType, announcementsTabData, classroom }) {
/>
))}
</Stack>
) : announcementsTabData.state === 'gone' ? null : (
);
case 'idle':
return (
<Stack
alignItems="center"
justifyContent="center"
@ -234,7 +255,20 @@ function AnnouncementsTab({ layoutType, announcementsTabData, classroom }) {
</Stack>
</Stack>
);
case 'gone':
return null;
default:
return null;
}
}
};
return layoutResolver(
announcementsTabData && announcementsTabData.state,
layoutType
);
}
export default AnnouncementsTab;