Skip to content

Commit 9330897

Browse files
jacksontromerojacksontromero
authored
Merge pull request #296 from cmu15122/jtromero/working
Jtromero/working
2 parents 4279e92 + 3f92f98 commit 9330897

17 files changed

+814
-453
lines changed

‎client/src/components/home/shared/AskQuestion.tsx‎

Lines changed: 128 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,37 @@
1-
import React, {useState, useEffect, useMemo, useContext} from 'react';
1+
import React, { useState, useEffect, useMemo, useContext } from 'react';
22
import {
3-
Typography, Divider, CardContent, CardActions, Stack,
4-
FormControl, InputLabel, MenuItem, Box, Select, Input, Button,
3+
Typography,
4+
Divider,
5+
CardContent,
6+
CardActions,
7+
Stack,
8+
FormControl,
9+
InputLabel,
10+
MenuItem,
11+
Box,
12+
Select,
13+
Input,
14+
Button,
515
} from '@mui/material';
616

717
import CooldownViolationOverlay from './CooldownViolationOverlay';
818
import BaseCard from '../../common/cards/BaseCard';
919

1020
import HomeService from '../../../services/HomeService';
11-
import {UserDataContext} from '../../../contexts/UserDataContext';
12-
import {QueueDataContext} from '../../../contexts/QueueDataContext';
21+
import { UserDataContext } from '../../../contexts/UserDataContext';
22+
import { QueueDataContext } from '../../../contexts/QueueDataContext';
23+
import { StudentDataContext } from '../../../contexts/StudentDataContext';
1324

1425
function createData(assignment_id, name) {
15-
return {assignment_id, name};
26+
return { assignment_id, name };
1627
}
1728

1829
const date = new Date();
1930

2031
export default function AskQuestion() {
21-
const {userData} = useContext(UserDataContext);
22-
const {queueData} = useContext(QueueDataContext);
32+
const { userData } = useContext(UserDataContext);
33+
const { queueData, setQueueData } = useContext(QueueDataContext);
34+
const { setStudentData } = useContext(StudentDataContext);
2335

2436
// not changing name or andrewID to use global because this component can also be used by TAs to manually add questions
2537
const [name, setName] = useState('');
@@ -41,7 +53,10 @@ export default function AskQuestion() {
4153
const dayDict = queueData.locations.dayDictionary;
4254
newLocations = dayDict;
4355

44-
const roomsForDay = (newLocations && newLocations[day]) ? newLocations[day] : ['Office Hours'];
56+
const roomsForDay =
57+
newLocations && newLocations[day] ?
58+
newLocations[day] :
59+
['Office Hours'];
4560

4661
if (roomsForDay.length === 1) {
4762
setLocation(roomsForDay[0]);
@@ -55,7 +70,10 @@ export default function AskQuestion() {
5570
if (queueData != null) {
5671
const newRows = [];
5772
queueData.topics.forEach((topic) => {
58-
if (new Date(topic.start_date) <= new Date() && new Date(topic.end_date) > new Date()) {
73+
if (
74+
new Date(topic.start_date) <= new Date() &&
75+
new Date(topic.end_date) > new Date()
76+
) {
5977
newRows.push(topic);
6078
}
6179
});
@@ -99,10 +117,27 @@ export default function AskQuestion() {
99117
clearValues();
100118
}
101119

120+
if (res.status === 200) {
121+
manuallyGetNewData();
122+
}
123+
102124
setAskDisabled(false);
103125
});
104126
}
105127

128+
const manuallyGetNewData = () => {
129+
// just to make sure the queue data and student data are up to date,
130+
// we manually refresh the queue data and student data
131+
HomeService.getAll().then((res) => {
132+
setQueueData(res.data);
133+
});
134+
HomeService.getStudentData().then((res) => {
135+
if (res.status === 200 && res.data.andrewID === userData.andrewID) {
136+
setStudentData(res.data);
137+
}
138+
});
139+
};
140+
106141
function clearValues() {
107142
setName('');
108143
setAndrewID('');
@@ -114,85 +149,113 @@ export default function AskQuestion() {
114149
return (
115150
<div>
116151
<BaseCard>
117-
<CardActions style={{justifyContent: 'space-between'}}>
118-
<Typography variant='h5' sx={{fontWeight: 'bold', ml: 2, my: 1}}>Ask A Question</Typography>
152+
<CardActions style={{ justifyContent: 'space-between' }}>
153+
<Typography variant="h5" sx={{ fontWeight: 'bold', ml: 2, my: 1 }}>
154+
Ask A Question
155+
</Typography>
119156
</CardActions>
120157
<Divider></Divider>
121158

122-
<CardContent sx={{mx: 1.5}}>
159+
<CardContent sx={{ mx: 1.5 }}>
123160
<form onSubmit={handleSubmit}>
124-
{
125-
userData.isTA &&
126-
<Stack direction='row' justifyContent='left' sx={{mb: 2}}>
127-
<Box sx={{minWidth: 120, width: '47%'}}>
128-
<FormControl required fullWidth>
129-
<Input
130-
placeholder='Student Name'
131-
onChange={(event) => setName(event.target.value)}
132-
value={name}
133-
fullWidth
134-
inputProps={{maxLength: 30}}
135-
/>
136-
</FormControl>
137-
</Box>
138-
<Box sx={{minWidth: 120, width: '47%', margin: 'auto', mr: 1}}>
139-
<FormControl required fullWidth>
140-
<Input
141-
placeholder='Student Andrew ID'
142-
onChange={(event) => setAndrewID(event.target.value)}
143-
value={andrewID}
144-
fullWidth
145-
inputProps={{maxLength: 20}}
146-
/>
147-
</FormControl>
148-
</Box>
149-
</Stack>
150-
}
151-
<Stack direction='row' justifyContent='left'>
152-
<Box sx={{minWidth: 120, width: '47%'}}>
153-
<FormControl variant='standard' required fullWidth>
154-
<InputLabel id='location-select'>Location</InputLabel>
161+
{userData.isTA && (
162+
<Stack direction="row" justifyContent="left" sx={{ mb: 2 }}>
163+
<Box sx={{ minWidth: 120, width: '47%' }}>
164+
<FormControl required fullWidth>
165+
<Input
166+
placeholder="Student Name"
167+
onChange={(event) => setName(event.target.value)}
168+
value={name}
169+
fullWidth
170+
inputProps={{ maxLength: 30 }}
171+
/>
172+
</FormControl>
173+
</Box>
174+
<Box
175+
sx={{ minWidth: 120, width: '47%', margin: 'auto', mr: 1 }}
176+
>
177+
<FormControl required fullWidth>
178+
<Input
179+
placeholder="Student Andrew ID"
180+
onChange={(event) => setAndrewID(event.target.value)}
181+
value={andrewID}
182+
fullWidth
183+
inputProps={{ maxLength: 20 }}
184+
/>
185+
</FormControl>
186+
</Box>
187+
</Stack>
188+
)}
189+
<Stack direction="row" justifyContent="left">
190+
<Box sx={{ minWidth: 120, width: '47%' }}>
191+
<FormControl variant="standard" required fullWidth>
192+
<InputLabel id="location-select">Location</InputLabel>
155193
<Select
156-
labelId='location-select-label'
157-
id='location-select'
194+
labelId="location-select-label"
195+
id="location-select"
158196
value={location ?? ''}
159-
label='Location'
160-
onChange={(e)=>setLocation(e.target.value)}
161-
style={{textAlign: 'left'}}
197+
label="Location"
198+
onChange={(e) => setLocation(e.target.value)}
199+
style={{ textAlign: 'left' }}
162200
>
163-
{locations.map((loc) => <MenuItem value={loc} key={loc}>{loc}</MenuItem>)}
201+
{locations.map((loc) => (
202+
<MenuItem value={loc} key={loc}>
203+
{loc}
204+
</MenuItem>
205+
))}
164206
</Select>
165207
</FormControl>
166208
</Box>
167-
<Box sx={{minWidth: 120, width: '47%', margin: 'auto', mr: 1}}>
168-
<FormControl variant='standard' required fullWidth>
169-
<InputLabel id='topic-select'>Topic</InputLabel>
209+
<Box sx={{ minWidth: 120, width: '47%', margin: 'auto', mr: 1 }}>
210+
<FormControl variant="standard" required fullWidth>
211+
<InputLabel id="topic-select">Topic</InputLabel>
170212
<Select
171-
labelId='topic-select-label'
172-
id='topic-select'
213+
labelId="topic-select-label"
214+
id="topic-select"
173215
value={topic ?? ''}
174-
label='Topic'
175-
onChange={(e)=>setTopic(e.target.value)}
176-
style={{textAlign: 'left'}}
216+
label="Topic"
217+
onChange={(e) => setTopic(e.target.value)}
218+
style={{ textAlign: 'left' }}
177219
>
178-
{topics.map((top) => <MenuItem value={top} key={top.assignment_id}>{top.name}</MenuItem>)}
220+
{topics.map((top) => (
221+
<MenuItem value={top} key={top.assignment_id}>
222+
{top.name}
223+
</MenuItem>
224+
))}
179225
</Select>
180226
</FormControl>
181227
</Box>
182228
</Stack>
183-
<Typography variant='h6' sx={{fontWeight: 'bold', textAlign: 'left', mt: 2}}>Question:</Typography>
184-
<FormControl required fullWidth sx={{mt: 0.5}}>
229+
<Typography
230+
variant="h6"
231+
sx={{ fontWeight: 'bold', textAlign: 'left', mt: 2 }}
232+
>
233+
Question:
234+
</Typography>
235+
<FormControl required fullWidth sx={{ mt: 0.5 }}>
185236
<Input
186-
placeholder='Question (max 256 characters)'
237+
placeholder="Question (max 256 characters)"
187238
onChange={(event) => setQuestion(event.target.value)}
188239
value={question ?? ''}
189240
fullWidth
190241
multiline
191-
inputProps={{maxLength: 256}}
192-
type='text'
242+
inputProps={{ maxLength: 256 }}
243+
type="text"
193244
/>
194245
</FormControl>
195-
<Button disabled={askDisabled} fullWidth variant='contained' sx={{mt: 3, py: 1, fontSize: '16px', fontWeight: 'bold', alignContent: 'center'}} type='submit'>
246+
<Button
247+
disabled={askDisabled}
248+
fullWidth
249+
variant="contained"
250+
sx={{
251+
mt: 3,
252+
py: 1,
253+
fontSize: '16px',
254+
fontWeight: 'bold',
255+
alignContent: 'center',
256+
}}
257+
type="submit"
258+
>
196259
Ask
197260
</Button>
198261
</form>

0 commit comments

Comments
 (0)