Skip to content

Commit 19d5dcd

Browse files
committed
Fixed behaviour of preserving prev calendar data
1 parent e00c54f commit 19d5dcd

File tree

6 files changed

+115
-65
lines changed

6 files changed

+115
-65
lines changed

client/src/App.tsx

+7-4
Original file line numberDiff line numberDiff line change
@@ -158,18 +158,21 @@ const App: React.FC = () => {
158158
const oldData = storage.get('timetables');
159159

160160
// avoid overwriting data from previous save
161+
// TODO: need to check if this logic is correct - do we want to preserve more than just the prev timetable data
161162
const newTimetableTerms = {
162-
...oldData,
163-
...(oldData.hasOwnProperty(termsData.prevTerm.term) ? {} : { [termsData.prevTerm.term]: createDefaultTimetable() }),
164-
...(oldData.hasOwnProperty(termsData.newTerm.term) ? {} : { [termsData.newTerm.term]: createDefaultTimetable() }),
163+
// ...oldData,
164+
// ...(oldData.hasOwnProperty(termsData.prevTerm.term) ? {} : { [termsData.prevTerm.term]: createDefaultTimetable() }),
165+
// ...(oldData.hasOwnProperty(termsData.newTerm.term) ? {} : { [termsData.newTerm.term]: createDefaultTimetable() }),
166+
...({ [termsData.prevTerm.term]: oldData.hasOwnProperty(termsData.prevTerm.term) ? oldData[termsData.prevTerm.term] : createDefaultTimetable() }),
167+
...({ [termsData.newTerm.term]: oldData.hasOwnProperty(termsData.newTerm.term) ? oldData[termsData.newTerm.term] : createDefaultTimetable() }),
165168
}
166169

167170
setDisplayTimetables(newTimetableTerms)
168171
storage.set('timetables', newTimetableTerms);
169172
};
170173

171174
fetchReliably(fetchTermData);
172-
}, [year]);
175+
}, []);
173176

174177
useEffect(() => {
175178
/**

client/src/components/controls/CourseSelect.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ const StyledSelect = styled(Box)`
5858

5959
const StyledTextField = styled(TextField, {
6060
shouldForwardProp: (prop) => prop !== 'selectedCourses',
61-
})<{
61+
}) <{
6262
selectedCourses: CourseData[];
6363
}>`
6464
.MuiOutlinedInput-root {
@@ -76,7 +76,7 @@ const StyledTextField = styled(TextField, {
7676
7777
label {
7878
color: ${({ theme, selectedCourses }) =>
79-
selectedCourses.length < maxAddedCourses ? theme.palette.secondary.dark : 'red'} !important;
79+
selectedCourses.length < maxAddedCourses ? theme.palette.secondary.dark : 'red'} !important;
8080
transition: 0.2s;
8181
}
8282
`;
@@ -88,7 +88,7 @@ const StyledInputAdornment = styled(InputAdornment)`
8888

8989
const StyledChip = styled(Chip, {
9090
shouldForwardProp: (prop) => prop !== 'backgroundColor',
91-
})<{
91+
}) <{
9292
backgroundColor: string;
9393
}>`
9494
transition: none !important;

client/src/components/navbar/Navbar.tsx

+5-52
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,17 @@
11
import { Description, Info, Security, Settings as SettingsIcon } from '@mui/icons-material';
2-
import { AppBar, Toolbar, Typography, useMediaQuery, useTheme, FormControl, MenuItem, Select } from '@mui/material';
2+
import { AppBar, Toolbar, Typography } from '@mui/material';
33
import { styled } from '@mui/system';
44
import React, { useContext, useState } from 'react';
55

66
import notanglesLogoGif from '../../assets/notangles.gif';
77
import notanglesLogo from '../../assets/notangles_1.png';
8-
import { ThemeType } from '../../constants/theme';
9-
import { AppContext } from '../../context/AppContext';
10-
import { CourseContext } from '../../context/CourseContext';
118
import About from './About';
129
import Changelog from './Changelog';
1310
import CustomModal from './CustomModal';
1411
import Privacy from './Privacy';
1512
import Settings from './Settings';
13+
import TermSelect from './TermSelect';
14+
1615

1716
const LogoImg = styled('img')`
1817
height: 46px;
@@ -42,41 +41,6 @@ const NavbarTitle = styled(Typography)`
4241
const Navbar: React.FC = () => {
4342
const [currLogo, setCurrLogo] = useState(notanglesLogo);
4443

45-
const {
46-
term,
47-
termName,
48-
setTermName,
49-
year,
50-
setTerm,
51-
setYear,
52-
setSelectedTimetable,
53-
displayTimetables,
54-
termsData
55-
} = useContext(AppContext);
56-
57-
const { setSelectedCourses, setSelectedClasses, setCreatedEvents } =
58-
useContext(CourseContext);
59-
60-
const theme = useTheme<ThemeType>();
61-
const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
62-
63-
const selectTerm = (e: any) => {
64-
const defaultStartTimetable = 0;
65-
66-
let newTermName = e.target.value.split(', ')[0]
67-
let termNum = 'T' + newTermName.split(' ')[1]
68-
let newYear = e.target.value.split(', ')[1]
69-
70-
setTerm(termNum)
71-
setYear(newYear)
72-
setTermName(newTermName)
73-
setSelectedTimetable(defaultStartTimetable);
74-
setSelectedClasses(displayTimetables[termNum][defaultStartTimetable].selectedClasses);
75-
setCreatedEvents(displayTimetables[termNum][defaultStartTimetable].createdEvents);
76-
setSelectedCourses(displayTimetables[termNum][defaultStartTimetable].selectedCourses);
77-
}
78-
79-
let termData = new Set([termsData.prevTerm.termName.concat(', ', termsData.prevTerm.year), termsData.newTerm.termName.concat(', ', termsData.newTerm.year)]);
8044
return (
8145
<NavbarBox>
8246
<StyledNavBar enableColorOnDark position="fixed">
@@ -90,18 +54,7 @@ const Navbar: React.FC = () => {
9054
<NavbarTitle variant="h6">
9155
Notangles
9256
</NavbarTitle>
93-
<FormControl>
94-
<Select
95-
value={isMobile ? term : termName.concat(', ', year)}
96-
onChange={selectTerm}
97-
>
98-
{
99-
Array.from(termData).map((term, index) => {
100-
return <MenuItem key={index} value={term}>{term}</MenuItem>;
101-
})
102-
}
103-
</Select>
104-
</FormControl>
57+
<TermSelect />
10558
<CustomModal
10659
title="About"
10760
showIcon={<Info />}
@@ -118,7 +71,7 @@ const Navbar: React.FC = () => {
11871
<CustomModal title="Settings" showIcon={<SettingsIcon />} description={'Settings'} content={<Settings />} />
11972
</Toolbar>
12073
</StyledNavBar>
121-
</NavbarBox>
74+
</NavbarBox >
12275
);
12376
};
12477

Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
import { useMediaQuery, useTheme, FormControl, MenuItem, Select, InputLabel } from '@mui/material';
2+
import React, { useContext } from 'react';
3+
4+
import { ThemeType } from '../../constants/theme';
5+
import { AppContext } from '../../context/AppContext';
6+
import { CourseContext } from '../../context/CourseContext';
7+
8+
9+
const TermSelect: React.FC = () => {
10+
11+
const {
12+
term,
13+
termName,
14+
setTermName,
15+
year,
16+
setTerm,
17+
setYear,
18+
setSelectedTimetable,
19+
displayTimetables,
20+
termsData
21+
} = useContext(AppContext);
22+
23+
const { setSelectedCourses, setSelectedClasses, setCreatedEvents } =
24+
useContext(CourseContext);
25+
26+
const theme = useTheme<ThemeType>();
27+
const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
28+
29+
const termData = new Set([termsData.prevTerm.termName.concat(', ', termsData.prevTerm.year), termsData.newTerm.termName.concat(', ', termsData.newTerm.year)]);
30+
31+
const selectTerm = (e: any) => {
32+
const defaultStartTimetable = 0;
33+
34+
let newTermName = e.target.value.split(', ')[0];
35+
let termNum = 'T' + newTermName.split(' ')[1];
36+
let newYear = e.target.value.split(', ')[1];
37+
38+
if (e.target.value.includes("Summer")) {
39+
// This is a summer term.
40+
termNum = "Summer";
41+
}
42+
43+
setTerm(termNum);
44+
setYear(newYear);
45+
setTermName(newTermName);
46+
setSelectedTimetable(defaultStartTimetable);
47+
setSelectedClasses(displayTimetables[termNum][defaultStartTimetable].selectedClasses);
48+
setCreatedEvents(displayTimetables[termNum][defaultStartTimetable].createdEvents);
49+
setSelectedCourses(displayTimetables[termNum][defaultStartTimetable].selectedCourses);
50+
}
51+
52+
return (
53+
<FormControl>
54+
<InputLabel sx={{ marginTop: 1, color: 'white' }}>Select your term</InputLabel>
55+
<Select
56+
label="Select your term"
57+
value={isMobile ? term : termName.concat(', ', year)}
58+
sx={{
59+
marginTop: 1,
60+
color: 'white',
61+
'.MuiSelect-icon': {
62+
color: 'white'
63+
},
64+
}}
65+
onChange={selectTerm}
66+
>
67+
{
68+
Array.from(termData).map((term, index) => {
69+
return <MenuItem key={index} value={term}>{term}</MenuItem>;
70+
})
71+
}
72+
</Select>
73+
</FormControl>
74+
);
75+
};
76+
77+
export default TermSelect;

client/src/components/timetableTabs/TimetableTabs.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -167,7 +167,7 @@ const TimetableTabs: React.FC = () => {
167167
<Droppable droppableId="tabs" direction="horizontal">
168168
{(props) => (
169169
<StyledTabs ref={props.innerRef} {...props.droppableProps}>
170-
{displayTimetables[term].map((timetable: TimetableData, index: number) => (
170+
{Object.keys(displayTimetables).length > 0 ? displayTimetables[term].map((timetable: TimetableData, index: number) => (
171171
<Draggable draggableId={index.toString()} index={index}>
172172
{(props) => (
173173
<Box
@@ -190,7 +190,7 @@ const TimetableTabs: React.FC = () => {
190190
</Box>
191191
)}
192192
</Draggable>
193-
))}
193+
)) : null}
194194
{props.placeholder}
195195
</StyledTabs>
196196
)}

client/src/constants/timetable.ts

+21-4
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,17 @@ export const getAvailableTermDetails = async () => {
6767
termNumber = 0; // This is a summer term.
6868
}
6969

70+
// // TODO: hardcoding to see behaviour of preserving prev timetable if the data exists
71+
// termName = `Summer Term`;
72+
// term = "Summer";
73+
// termNumber = 0; // This is a summer term.
74+
75+
// TODO: hardcoding to see behaviour of preserving prev timetable for new year
76+
// termNumber = 1;
77+
// term = `T${termNumber}`;
78+
// termName = `Term ${termNumber}`;
79+
// year = "2024"
80+
7081
const prevDateSplit = prevTermRes.split('/');
7182
let prevFirstDate = prevDateSplit.reverse().join('-');
7283
let prevTermName = `Summer Term`;
@@ -75,14 +86,20 @@ export const getAvailableTermDetails = async () => {
7586

7687
if (prevTermIdRes.length === REGULAR_TERM_STR_LEN) {
7788
// This is not a summer term.
78-
// prevTermNum = parseInt(prevTermIdRes.substring(1));
79-
// prevTerm = `T${prevTermNum}`;
80-
// prevTermName = `Term ${prevTermNum}`;
89+
prevTermNum = parseInt(prevTermIdRes.substring(1));
90+
prevTerm = `T${prevTermNum}`;
91+
prevTermName = `Term ${prevTermNum}`;
8192

8293
// TODO: hardcoded for now to be Term 2
83-
prevTermNum = 2
94+
prevTermNum = 2;
8495
prevTerm = `T${prevTermNum}`;
8596
prevTermName = `Term ${prevTermNum}`;
97+
98+
// TODO: testing restoring across years
99+
// prevTermName = `Summer Term`;
100+
// prevTerm = "Summer";
101+
// prevTermNum = 0; // This is a summer term.
102+
86103
} else {
87104
// This is a summer term.
88105
prevTermName = `Summer Term`;

0 commit comments

Comments
 (0)