diff --git a/src/context/user.js b/src/context/user.js index 67fc789..b168ba7 100644 --- a/src/context/user.js +++ b/src/context/user.js @@ -7,6 +7,7 @@ import { getClassroomById, getClassrooms, getFaq, + getUpcomingAssignmentsById, } from '../services/user-service'; const UserContext = createContext(); @@ -35,6 +36,9 @@ function UserProvider(props) { const fetchClassroomAnnouncements = classId => getClassroomAnnouncementsById(classId); + const fetchUpcomingAssignments = classId => + getUpcomingAssignmentsById(classId); + return ( @@ -58,6 +63,7 @@ function useUser() { fetchClassroomById, fetchFAQ, fetchClassroomAnnouncements, + fetchUpcomingAssignments, } = useContext(UserContext); return { @@ -67,6 +73,7 @@ function useUser() { fetchClassroomById, fetchFAQ, fetchClassroomAnnouncements, + fetchUpcomingAssignments, }; } diff --git a/src/screens/Classroom/View.js b/src/screens/Classroom/View.js index 4c7b245..c503ff3 100644 --- a/src/screens/Classroom/View.js +++ b/src/screens/Classroom/View.js @@ -1,8 +1,10 @@ import { Avatar, AvatarGroup, + Card, Container, Grid, + Link, Paper, Stack, Tab, @@ -19,10 +21,9 @@ function View({ classroom, selectedTabOption, onSelectTabOption, - announcements, + announcementsTabData, }) { const { title, container, paper, tabs, avatar, tooltip } = styles[layoutType]; - if (layoutType === 'desktop') { return ( @@ -71,20 +72,26 @@ function View({ )} - {announcements === null ? ( + {announcementsTabData === null ? (

Loading...

) : ( - - Left + + + +

Próximas Atividades

+ {announcementsTabData.upcomingAssignments.map(ua => ( + + {ua.title} + + ))} +
+
@@ -96,7 +103,7 @@ function View({ direction="row" gap="30px" > - {announcements.data.map(announcement => ( + {announcementsTabData.announcements.map(announcement => ( )} - {announcements === null ? ( + {announcementsTabData === null ? (

Loading...

) : ( - - Left + + + +

Próximas Atividades

+ {announcementsTabData.upcomingAssignments.map(ua => ( + + {ua.title} + + ))} +
+
- {announcements.data.map(announcement => ( + {announcementsTabData.announcements.map(announcement => ( o.value).indexOf('announcements') @@ -40,11 +44,13 @@ function Classroom() { async function getSelectedTabData() { setTabData(null); if (selectedTabOption === 0) { - console.log('Fetch announcements'); - const result = await fetchClassroomAnnouncements(params.id); + const announcements = await fetchClassroomAnnouncements(params.id); + const upcomingAssignments = await fetchUpcomingAssignments(params.id); + setTabData({ tab: TAB_OPTIONS[selectedTabOption].value, - data: [...result.data], + announcements: [...announcements.data], + upcomingAssignments: [...upcomingAssignments.data], }); } else if (selectedTabOption === 1) { console.log('Fetch assignments'); @@ -53,7 +59,12 @@ function Classroom() { } } getSelectedTabData(); - }, [fetchClassroomAnnouncements, selectedTabOption, params]); + }, [ + fetchClassroomAnnouncements, + fetchUpcomingAssignments, + selectedTabOption, + params, + ]); return ( ); } diff --git a/src/services/mocks.js b/src/services/mocks.js index 5d92767..d8a74e1 100644 --- a/src/services/mocks.js +++ b/src/services/mocks.js @@ -89,6 +89,19 @@ const allAssignments = [ ], classrooms: allClassrooms.filter(c => c.id === '321'), }, + { + id: '0128', + title: + 'Prova 2 - Visualização de Dados. Matemática e Estatística em CD. Análise de Dados', + dueDate: '2022-09-01 23:59', + scores: [ + { + classroomId: '321', + value: 30, + }, + ], + classrooms: allClassrooms.filter(c => c.id === '321'), + }, { id: '1234', title: 'Trabalho NoSQL', @@ -197,6 +210,35 @@ const allClassroomAnnouncements = [ }, ]; +const allUpcomingAssignments = [ + { + id: '5435', + title: + 'Prova 1 - Armazenamento de Dados. Python em CD. Armazenamento Analítico', + dueDate: '2022-07-01 23:59', + scores: [ + { + classroomId: '321', + value: 30, + }, + ], + classrooms: allClassrooms.filter(c => c.id === '321'), + }, + { + id: '0128', + title: + 'Prova 2 - Visualização de Dados. Matemática e Estatística em CD. Análise de Dados', + dueDate: '2022-09-01 23:59', + scores: [ + { + classroomId: '321', + value: 30, + }, + ], + classrooms: allClassrooms.filter(c => c.id === '321'), + }, +]; + const faq = [ { question: 'Como faço para acessar a biblicoteca virtual?', @@ -244,4 +286,5 @@ export { faq, user, authFailure, + allUpcomingAssignments, }; diff --git a/src/services/user-service.js b/src/services/user-service.js index f655877..4693036 100644 --- a/src/services/user-service.js +++ b/src/services/user-service.js @@ -6,6 +6,7 @@ import { user, authFailure, allClassroomAnnouncements, + allUpcomingAssignments, } from './mocks'; const getClassrooms = userId => @@ -32,6 +33,16 @@ const getClassroomAnnouncementsById = classId => }; }); +const getUpcomingAssignmentsById = classId => + sleep(3000).then(() => { + console.log('classId ' + classId); + return { + data: allUpcomingAssignments.filter(a => + a.classrooms.filter(c => c.id === classId) + ), + }; + }); + const getAssignments = userId => sleep(4000).then(() => { console.log('userId: ' + userId); @@ -63,6 +74,7 @@ export { getClassroomById, getAssignments, getClassroomAnnouncementsById, + getUpcomingAssignmentsById, getFaq, getUser, };