From e00c54f1597b7a97ed4ce5469c8f3b4ee2ee80cd Mon Sep 17 00:00:00 2001 From: Shaam Date: Sun, 15 Oct 2023 22:21:27 +1100 Subject: [PATCH] fix: increased timeout value for fetching course info + refactored fetchTermData to fix issue with restoring previously saved data --- client/src/App.tsx | 47 +++------------------- client/src/api/getCourseInfo.ts | 2 +- client/src/components/controls/History.tsx | 1 - client/src/components/navbar/Navbar.tsx | 26 ++---------- client/src/constants/timetable.ts | 9 ++--- 5 files changed, 12 insertions(+), 73 deletions(-) diff --git a/client/src/App.tsx b/client/src/App.tsx index f6cf28695..673ecf6f7 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -156,11 +156,14 @@ const App: React.FC = () => { setFirstDayOfTerm(firstDayOfTerm); setTermsData(termsData); const oldData = storage.get('timetables'); + + // avoid overwriting data from previous save const newTimetableTerms = { ...oldData, - [termsData.prevTerm.term]: createDefaultTimetable(), - [termsData.newTerm.term]: createDefaultTimetable(), + ...(oldData.hasOwnProperty(termsData.prevTerm.term) ? {} : { [termsData.prevTerm.term]: createDefaultTimetable() }), + ...(oldData.hasOwnProperty(termsData.newTerm.term) ? {} : { [termsData.newTerm.term]: createDefaultTimetable() }), } + setDisplayTimetables(newTimetableTerms) storage.set('timetables', newTimetableTerms); }; @@ -379,21 +382,6 @@ const App: React.FC = () => { // The following three useUpdateEffects update local storage whenever a change is made to the timetable useUpdateEffect(() => { - // console.log('updating selected courses') - // console.log(displayTimetables); - // const newDisplayTimetables = { - // ...displayTimetables, - // [term]: displayTimetables[term].map((timetable, index) => { - // return index === selectedTimetable ? - // { ...timetable, selectedCourses: selectedCourses } - // : timetable; - // }) - // } - // console.log(newDisplayTimetables); - // storage.set('courseData', courseData); - // storage.set('timetables', newDisplayTimetables); - // setDisplayTimetables(newDisplayTimetables); - // console.log(storage.get('timetables')[term][selectedTimetable]) displayTimetables[term][selectedTimetable].selectedCourses = selectedCourses; const newCourseData = courseData; storage.set('courseData', newCourseData); @@ -402,37 +390,12 @@ const App: React.FC = () => { }, [selectedCourses]); useUpdateEffect(() => { - // console.log('updating selected classes') - // console.log(displayTimetables); - // const newDisplayTimetables = { - // ...displayTimetables, - // [term]: displayTimetables[term].map((timetable, index) => { - // return index === selectedTimetable ? - // { ...timetable, selectedClasses: selectedClasses } - // : timetable; - // }) - // } - // console.log(newDisplayTimetables); - // storage.set('timetables', newDisplayTimetables); - // setDisplayTimetables(newDisplayTimetables); - // console.log(storage.get('timetables')[term][selectedTimetable]) - // console.log(displayTimetables[term][selectedTimetable]) displayTimetables[term][selectedTimetable].selectedClasses = selectedClasses; storage.set('timetables', displayTimetables); setDisplayTimetables(displayTimetables); }, [selectedClasses]); useUpdateEffect(() => { - // const newDisplayTimetables = { - // ...displayTimetables, - // [term]: displayTimetables[term].map((timetable, index) => { - // return index === selectedTimetable ? - // { ...timetable, createdEvents: createdEvents } - // : timetable; - // }) - // } - // storage.set('timetables', newDisplayTimetables); - // setDisplayTimetables(newDisplayTimetables); displayTimetables[term][selectedTimetable].createdEvents = createdEvents; storage.set('timetables', displayTimetables); setDisplayTimetables(displayTimetables); diff --git a/client/src/api/getCourseInfo.ts b/client/src/api/getCourseInfo.ts index e3515e122..3f17f4356 100644 --- a/client/src/api/getCourseInfo.ts +++ b/client/src/api/getCourseInfo.ts @@ -86,7 +86,7 @@ const getCourseInfo = async ( ): Promise => { const baseURL = `${API_URL.timetable}/terms/${year}-${term}`; try { - const data = await timeoutPromise(1500, fetch(`${baseURL}/courses/${courseCode}/`)); + const data = await timeoutPromise(2000, fetch(`${baseURL}/courses/${courseCode}/`)); // Remove any leftover courses from localStorage if they are not offered in the current term // which is why a 400 error is returned diff --git a/client/src/components/controls/History.tsx b/client/src/components/controls/History.tsx index 3af54fb36..9186cc11e 100644 --- a/client/src/components/controls/History.tsx +++ b/client/src/components/controls/History.tsx @@ -121,7 +121,6 @@ const History: React.FC = () => { if (displayTimetables[term].length > 1) { disableStatus.all = false; } - console.log(displayTimetables, term, selectedTimetable); // Current timetable being non-empty is resetAll and resetOne-able const currentTimetable = displayTimetables[term][selectedTimetable]; diff --git a/client/src/components/navbar/Navbar.tsx b/client/src/components/navbar/Navbar.tsx index 4c2f14f83..3c68ca1d0 100644 --- a/client/src/components/navbar/Navbar.tsx +++ b/client/src/components/navbar/Navbar.tsx @@ -1,6 +1,5 @@ import { Description, Info, Security, Settings as SettingsIcon } from '@mui/icons-material'; -import { AppBar, Toolbar, Typography, useMediaQuery, useTheme, FormControl, MenuItem, Select, InputLabel } from '@mui/material'; -import { createDefaultTimetable } from '../../utils/timetableHelpers'; +import { AppBar, Toolbar, Typography, useMediaQuery, useTheme, FormControl, MenuItem, Select } from '@mui/material'; import { styled } from '@mui/system'; import React, { useContext, useState } from 'react'; @@ -39,16 +38,6 @@ const NavbarTitle = styled(Typography)` z-index: 1201; `; -const Weak = styled('span')` - font-weight: 300; - opacity: 0.8; - margin-left: 15px; - font-size: 90%; - vertical-align: middle; - position: relative; - bottom: 1px; - z-index: 1201; -`; const Navbar: React.FC = () => { const [currLogo, setCurrLogo] = useState(notanglesLogo); @@ -60,10 +49,8 @@ const Navbar: React.FC = () => { year, setTerm, setYear, - selectedTimetable, setSelectedTimetable, displayTimetables, - setDisplayTimetables, termsData } = useContext(AppContext); @@ -74,18 +61,15 @@ const Navbar: React.FC = () => { const isMobile = useMediaQuery(theme.breakpoints.down('sm')); const selectTerm = (e: any) => { - // // TODO: need to handle selecting that corresponding term n reloading term data/resetting timetable? + const defaultStartTimetable = 0; + let newTermName = e.target.value.split(', ')[0] let termNum = 'T' + newTermName.split(' ')[1] let newYear = e.target.value.split(', ')[1] - // // TODO:fix this so that we switch the termId for the current tab - // // TODO:implement error message to ask user if they want to reset the current timetable (if it has any data) b4 switching terms - // NEW IDEA: TODO: use arrow buttons to switch between terms - we shld keep independent timetables for each term and change/restore these when we switch between the terms setTerm(termNum) setYear(newYear) setTermName(newTermName) - const defaultStartTimetable = 0; setSelectedTimetable(defaultStartTimetable); setSelectedClasses(displayTimetables[termNum][defaultStartTimetable].selectedClasses); setCreatedEvents(displayTimetables[termNum][defaultStartTimetable].createdEvents); @@ -105,14 +89,10 @@ const Navbar: React.FC = () => { /> Notangles - {/* {isMobile ? term : termName.concat(', ', year)} */}