Skip to content

Commit

Permalink
Merge pull request #265 from cmu15122/preview
Browse files Browse the repository at this point in the history 
Add new questions per topic metric to production
  • Loading branch information
@jacksontromero
jacksontromero authored Feb 16, 2024
2 parents 907e48d + a396d6c commit e561db0
Show file tree
Hide file tree
Showing 8 changed files with 8,187 additions and 6,597 deletions.
12,479 changes: 7,390 additions & 5,089 deletions client/package-lock.json
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions client/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
"@types/node": "^18.8.4",
"@types/react": "^18.0.21",
"@types/react-dom": "^18.0.6",
"axios": "^0.27.2",
"axios": "^1.6.7",
"chart.js": "^4.4.1",
"chat.js": "^1.0.2",
"downloadjs": "^1.4.7",
Expand All @@ -31,7 +31,7 @@
"react-cookie": "^4.1.1",
"react-dom": "^18.1.0",
"react-router-dom": "^6.3.0",
"react-scripts": "5.0.1",
"react-scripts": "^5.0.1",
"react-window": "^1.8.7",
"socket.io-client": "^4.5.1",
"styled-components": "^5.3.5",
Expand Down
114 changes: 93 additions & 21 deletions client/src/components/metrics/Graph.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,14 @@ import MetricsService from '../../services/MetricsService';

export default function Graph() {
const theme = useTheme();
const [numStudentsPerDayLastWeek, setNumStudentsPerDayLastWeek] = useState([]);
const [numStudentsPerDay, setNumStudentsPerDay] = useState([]);
const [numStudentsOverall, setNumStudentsOverall] = useState([]);
const [numQuestionsPerDayLastWeek, setNumQuestionsPerDayLastWeek] = useState([]);
const [numQuestionsPerDay, setNumQuestionsPerDay] = useState([]);
const [numQuestionsOverall, setNumQuestionsOverall] = useState([]);
const [numQuestionsPerTopic, setNumQuestionsPerTopic] = useState([]);

useEffect(() => {
MetricsService.getNumStudentsPerDayLastWeek().then((res) => {
setNumStudentsPerDayLastWeek(res.data.numStudentsPerDayLastWeek);
setNumQuestionsPerDayLastWeek(res.data.numStudentsPerDayLastWeek);
});

MetricsService.getNumStudentsPerDay().then((res) => {
Expand All @@ -30,11 +31,16 @@ export default function Graph() {
return days.indexOf(a.day) - days.indexOf(b.day);
});

setNumStudentsPerDay(dataBack);
setNumQuestionsPerDay(dataBack);
});

MetricsService.getNumStudentsOverall().then((res) => {
setNumStudentsOverall(res.data.numStudentsOverall);
setNumQuestionsOverall(res.data.numStudentsOverall);
});

MetricsService.getNumQuestionsPerTopic().then((res) => {
console.log(res.data.numQuestionsPerTopic);
setNumQuestionsPerTopic(res.data.numQuestionsPerTopic);
});
}, []);

Expand All @@ -50,7 +56,7 @@ export default function Graph() {

<div style={{height: '40vh', width: 'auto', position: 'relative'}}>
<Line
datasetIdKey='numStudentsPerDayLastWeek'
datasetIdKey='numQuestionsPerDayLastWeek'
options={{
layout: {
padding: {
Expand Down Expand Up @@ -81,7 +87,7 @@ export default function Graph() {
y: {
title: {
display: true,
text: 'Number of Students',
text: 'Number of Questions',
font: {
size: 16,
},
Expand All @@ -97,11 +103,11 @@ export default function Graph() {
}}

data={{
labels: numStudentsPerDayLastWeek.map((day) => dateFormatter(day.day)),
labels: numQuestionsPerDayLastWeek.map((day) => dateFormatter(day.day)),
datasets: [
{
label: 'Number of Students',
data: numStudentsPerDayLastWeek.map((day) => day.students),
label: 'Number of Questions',
data: numQuestionsPerDayLastWeek.map((day) => day.students),
fill: false,
backgroundColor: theme.palette.primary.main,
borderColor: theme.palette.primary.main,
Expand All @@ -119,7 +125,7 @@ export default function Graph() {

<div style={{height: '40vh', width: 'auto', position: 'relative'}}>
<Line
datasetIdKey='numStudentsPerDayOverall'
datasetIdKey='numQuestionsPerDayOverall'
options={{
layout: {
padding: {
Expand Down Expand Up @@ -150,7 +156,7 @@ export default function Graph() {
y: {
title: {
display: true,
text: 'Number of Students',
text: 'Number of Questions',
font: {
size: 16,
},
Expand All @@ -166,11 +172,11 @@ export default function Graph() {
}}

data={{
labels: numStudentsOverall.map((day) => dateFormatter(day.day)),
labels: numQuestionsOverall.map((day) => dateFormatter(day.day)),
datasets: [
{
label: 'Number of Students',
data: numStudentsOverall.map((day) => day.students),
label: 'Number of Questions',
data: numQuestionsOverall.map((day) => day.students),
fill: false,
backgroundColor: theme.palette.primary.main,
borderColor: theme.palette.primary.main,
Expand All @@ -188,7 +194,73 @@ export default function Graph() {

<div style={{height: '40vh', width: 'auto', position: 'relative'}}>
<Bar
datasetIdKey='numStudentsPerDayOfWeek'
datasetIdKey='numQuestionsPerDayOfWeek'
options={{
layout: {
padding: {
top: 40,
right: 100,
bottom: 40,
left: 50,
},
},
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
},
},
scales: {
x: {
ticks: {
font: {
size: 16,
},
},
grid: {
color: theme.palette.divider,
},
},
y: {
title: {
display: true,
text: 'Number of Questions',
font: {
size: 16,
},
},
ticks: {
autoSkip: true,
},
grid: {
color: theme.palette.divider,
},
},
},
}}
data={{
labels: numQuestionsPerDay.map((day) => day.day),
datasets: [
{
label: 'Number of Questions',
data: numQuestionsPerDay.map((day) => day.students),
backgroundColor: theme.palette.primary.main,
borderColor: theme.palette.primary.main,
borderWidth: 3,
},
],
}}
/>
</div>

<Typography variant="h5" sx={{mt: 4, ml: 10}} fontWeight='bold'>
Number of Questions per Topic
</Typography>

<div style={{height: '40vh', width: 'auto', position: 'relative'}}>
<Bar
datasetIdKey='numQuestionsPerTopic'
options={{
layout: {
padding: {
Expand Down Expand Up @@ -219,7 +291,7 @@ export default function Graph() {
y: {
title: {
display: true,
text: 'Number of Students',
text: 'Number of Questions',
font: {
size: 16,
},
Expand All @@ -234,11 +306,11 @@ export default function Graph() {
},
}}
data={{
labels: numStudentsPerDay.map((day) => day.day),
labels: numQuestionsPerTopic.map((topic) => topic.name),
datasets: [
{
label: 'Number of Students',
data: numStudentsPerDay.map((day) => day.students),
label: 'Number of Questions',
data: numQuestionsPerTopic.map((topic) => topic.count),
backgroundColor: theme.palette.primary.main,
borderColor: theme.palette.primary.main,
borderWidth: 3,
Expand Down
4 changes: 4 additions & 0 deletions client/src/services/MetricsService.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,10 @@ class MetricsDataService {
getNumStudentsOverall() {
return http.get('/metrics/numStudentsOverall');
}

getNumQuestionsPerTopic() {
return http.get('/metrics/numQuestionsPerTopic');
}
}

export default new MetricsDataService();
61 changes: 61 additions & 0 deletions server/controllers/metrics.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -427,6 +427,67 @@ exports.get_num_students_overall = (req, res) => {
});
}

exports.get_num_questions_per_topic = (req, res) => {
if (!req.user || !req.user.isTA) {
respond_error(req, res, "You don't have permissions to perform this operation", 403);
return;
}

let assignmentsSet = {};

assignmentsSet[-1] = {
name: "Other",
start_date: new Date("1/1/2000"),
end_date: new Date("1/1/3000")
}

models.assignment_semester.findAll({
where: {
sem_id: settings.get_admin_settings().currSem,
},
order: [['start_date', 'ASC']],
include: models.assignment
}).then((assignments) => {

for (const assignmentSem of assignments) {
let assignment = assignmentSem.assignment;
assignmentsSet[assignment.assignment_id] = {
name: assignment.name,
start_date: assignmentSem.start_date,
end_date: assignmentSem.end_date
};
}

return models.question.findAll({
attributes: [
'assignment',
[Sequelize.fn('count', Sequelize.col('question_id')), 'count']
],
where: {
sem_id: settings.get_admin_settings().currSem,
help_time: {
[Sequelize.Op.ne]: null
},
},
group: [[Sequelize.col('assignment')]],
})
}).then((data) => {
for (const row of data) {
let assnCount = row.dataValues;
assignmentsSet[assnCount.assignment].count = assnCount.count;
}

let result = [];

for (const [id, assn] of Object.entries(assignmentsSet)) {
result.push(assn)
}
result.sort((a, b) => a.start_date - b.start_date)

respond(req, res, "Got number of questions per topic", { numQuestionsPerTopic: result }, 200);
});
}

exports.get_ranked_students = (req, res) => {
if (!req.user || !req.user.isTA || !req.user.isAdmin) {
respond_error(req, res, "You don't have permission to perform this operation", 403);
Expand Down
Loading

0 comments on commit e561db0

Please sign in to comment.