Skip to content

Commit f61c7df

Browse files
rmfay1rmfay1
committed
fixing the learning objectives grade rubric
2 parents 7c36085 + b3ea0ce commit f61c7df

File tree

19 files changed

+773
-118
lines changed

19 files changed

+773
-118
lines changed

‎src/Components/CourseHome/CourseHome.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,6 @@ function CourseHome() {
9393
<InputLabel>View As</InputLabel>
9494
<Select
9595
inputProps={{ 'data-testid': 'courseHomeViewSelector' }}
96-
// data-testid="courseHomeViewSelector"
9796
value={viewType}
9897
onChange={handleChange}
9998
classes={{ root: classes.menuItem }}

‎src/Components/LinearProgressWithLabel/ObjectiveDropDown.tsx‎

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import {
1414
Task,
1515
TaskObjectiveProgress,
1616
TaskObjectiveProgressFieldsFragment,
17+
useGetTaskObjectiveProgressQuery,
1718
} from '../../__generated__/types';
1819

1920
const useStyles = makeStyles((theme: Theme) =>
@@ -108,6 +109,19 @@ export interface ObjectiveDropDownProps {
108109
tasks: TaskObjectiveProgress[];
109110
}
110111

112+
function getTaskObjectivePorgress(task: TaskObjectiveProgress) {
113+
const { data: taskObjectiveProgress } = useGetTaskObjectiveProgressQuery({
114+
variables: {
115+
taskId: task.task.id,
116+
},
117+
});
118+
if (taskObjectiveProgress === undefined) {
119+
return <></>;
120+
}
121+
const objectiveProgresses = (taskObjectiveProgress.getTaskObjectiveProgress as unknown) as TaskObjectiveProgress[];
122+
return objectiveProgresses;
123+
}
124+
111125
function getProgressBar(status: number) {
112126
if (status === 0) {
113127
return <NotStartedProgress />;
@@ -174,7 +188,12 @@ export default function ObjectiveDropDown({ name, tasks }: ObjectiveDropDownProp
174188

175189
<Collapse in={open} timeout="auto" unmountOnExit>
176190
{tasks.map((task: TaskObjectiveProgress) => (
177-
<Link to={{ pathname: `/viewTask/${task.task.id}`, state: task }}>
191+
<Link
192+
to={{
193+
pathname: `/viewTask/${task.task.id}`,
194+
state: getTaskObjectivePorgress(task),
195+
}}
196+
>
178197
{console.log(task)}
179198
<List component="div" disablePadding>
180199
<div style={{ display: 'flex', flexDirection: 'row' }}>

‎src/Components/SingleStudentMasteryOverview/TargetMasteryCard.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ function getStatusTitle(status: number) {
105105
return 'Not Mastered';
106106
}
107107
if (status > 0.75) {
108-
return 'Almost Mastered';
108+
return 'Nearly Mastered';
109109
}
110110
return 'Mastered';
111111
}

‎src/Components/SingleStudentOverview/MasteryCard.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,7 @@ function getStatusTitle(status: number) {
106106
return 'Not Mastered';
107107
}
108108
if (status >= 0.75) {
109-
return 'Almost Mastered';
109+
return 'Nearly Mastered';
110110
}
111111
return 'Mastered';
112112
}

‎src/Components/SingleStudentOverview/SingleMissionOverview.tsx‎

Lines changed: 29 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,13 @@ import { Divider } from '@material-ui/core';
1111
import StudentPicture from '../../assets/images/images-1.png';
1212
import { User } from '../../interfaces/User';
1313
import LinearProgressWithLabel from '../LinearProgressWithLabel/LinearProgressWithLabel';
14-
import { MissionProgress, TaskStats, useGetMissionProgressQuery } from '../../__generated__/types';
14+
import {
15+
MissionProgress,
16+
TaskObjectiveProgress,
17+
TaskStats,
18+
useGetMissionProgressQuery,
19+
useGetTaskObjectiveProgressQuery,
20+
} from '../../__generated__/types';
1521

1622
const StudentDiv = styled.div`
1723
height: 200px;
@@ -109,6 +115,19 @@ const useStyles = makeStyles((theme: Theme) =>
109115
})
110116
);
111117

118+
function getTaskObjectiveProgress(task: TaskStats) {
119+
const { data: taskObjectiveProgress } = useGetTaskObjectiveProgressQuery({
120+
variables: {
121+
taskId: task.taskId,
122+
},
123+
});
124+
if (taskObjectiveProgress === undefined) {
125+
return <></>;
126+
}
127+
const objectiveProgresses = (taskObjectiveProgress.getTaskObjectiveProgress as unknown) as TaskObjectiveProgress[];
128+
return objectiveProgresses;
129+
}
130+
112131
function getMissionProgress(missionData: MissionProgress[], name: string) {
113132
for (const mission of missionData) {
114133
if (mission.mission.name === name) {
@@ -176,7 +195,15 @@ function SingleMissionOverview() {
176195
<TaskRowDiv className="row">
177196
<LeftColumnDiv className="col-12" style={{ justifyContent: 'right' }}>
178197
{missionProgressData?.map((task: TaskStats) => (
179-
<Link to={`/viewTask/${task.taskId}`} data-testid="task-btn">
198+
// <Link to={`/viewTask/${task.taskId}`} data-testid="task-btn">
199+
<Link
200+
to={{
201+
pathname: `/viewTask/${task.taskId}`,
202+
state: getTaskObjectiveProgress(task),
203+
}}
204+
data-testid="task-btn"
205+
>
206+
{console.log(task)}
180207
<List
181208
component="div"
182209
disablePadding

‎src/Components/StudentOverview/LTStudentViewTable.tsx‎

Lines changed: 97 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,44 @@
1+
/* eslint-disable @typescript-eslint/no-explicit-any */
2+
/* eslint-disable array-callback-return */
3+
/* eslint-disable @typescript-eslint/restrict-template-expressions */
4+
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
5+
/* eslint-disable no-param-reassign */
6+
/* eslint-disable @typescript-eslint/no-unsafe-call */
7+
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
8+
/* eslint-disable no-restricted-syntax */
19
import { useHistory } from 'react-router-dom';
10+
import { useQuery } from '@apollo/client';
11+
import React, { useState } from 'react';
12+
import { ToggleButton, ToggleButtonGroup } from '@material-ui/lab';
213
import TableComponent from '../TableComponent/TableComponent';
3-
import { useProgressOverviewQuery, UserProgress } from '../../__generated__/types';
14+
import {
15+
CmStudentFieldsFragment,
16+
Target,
17+
useClassMissionMasteryQuery,
18+
} from '../../__generated__/types';
19+
import { LIST_TARGETS_BY_COURSE } from '../../hooks/ListTargetsByCourse';
20+
import SelectedLTStudentViewTable from './SelectedLTStudentViewTable';
421

522
function LTStudentViewTable() {
6-
const { data: progressData } = useProgressOverviewQuery({
7-
variables: {
8-
course: 'Integrated Science',
9-
},
10-
});
23+
const { data: missionMasteryData } = useClassMissionMasteryQuery();
24+
25+
const [selectedLT, setSlectedLT] = useState<string | null>(null);
26+
27+
const handleLTSelection = (
28+
event: React.MouseEvent<HTMLElement>,
29+
newSelectedLT: string | null
30+
) => {
31+
setSlectedLT(newSelectedLT);
32+
};
1133

1234
const history = useHistory();
1335

36+
const { data: courseTargets } = useQuery(LIST_TARGETS_BY_COURSE);
37+
38+
if (!courseTargets) {
39+
return <div />;
40+
}
41+
1442
const rowClicked = (userName: string) => {
1543
history.push({
1644
pathname: '/singleStudentMasteryOverview',
@@ -19,31 +47,30 @@ function LTStudentViewTable() {
1947
};
2048

2149
const data: any[] = [];
22-
progressData?.progressOverview.userProgress.map((userProgress: UserProgress) =>
23-
data.push({
24-
row: {
25-
section: 1,
26-
name: userProgress.userName,
27-
recent: {
28-
status:
29-
userProgress.progress.length !== 0
30-
? userProgress.progress[userProgress.progress.length - 1].taskId
31-
: '',
32-
style: {
33-
backgroundColor:
34-
userProgress.progress.length !== 0
35-
? userProgress.progress[userProgress.progress.length - 1].status
36-
? '#00b300'
37-
: '#ff6666'
38-
: '#a6a6a6',
39-
},
50+
missionMasteryData?.classMissionMastery?.studentMissionMasteryList.map(
51+
(studentMissionMastery: CmStudentFieldsFragment) =>
52+
data.push({
53+
row: {
54+
section: '1',
55+
name: `${studentMissionMastery.student.lastName} ${studentMissionMastery.student.firstName}`,
56+
team: studentMissionMastery.student.team,
57+
recent: studentMissionMastery.currentTaskName,
58+
average: '',
59+
progress: `${(studentMissionMastery.progress * 100).toFixed(1)}%`,
4060
},
41-
average: '',
42-
progress: '%',
43-
},
44-
})
61+
})
4562
);
4663

64+
// TODO remove when names are populated
65+
data.forEach((dataEntry) => {
66+
if (dataEntry.row.name.indexOf('null') !== -1) {
67+
dataEntry.row.name = 'Mary Lee';
68+
}
69+
if (dataEntry.row.name.length > 25) {
70+
dataEntry.row.name = dataEntry.row.name.substring(0, 25);
71+
}
72+
});
73+
4774
console.log(data);
4875

4976
const tableColumns = [
@@ -58,13 +85,13 @@ function LTStudentViewTable() {
5885
Header: 'Student',
5986
accessor: 'row.name',
6087
},
88+
{
89+
Header: 'Team',
90+
accessor: 'row.team',
91+
},
6192
{
6293
Header: 'Recent',
6394
accessor: 'row.recent',
64-
Cell: ({ value }: { value: any }) => {
65-
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
66-
return <>{value.status} </>;
67-
},
6895
},
6996
{
7097
Header: 'Average',
@@ -83,27 +110,50 @@ function LTStudentViewTable() {
83110
columns: [],
84111
};
85112

113+
// Set handles the case of two learing targets with the same name
86114
const learningTargetSet = new Set();
87115

88-
if (progressData !== undefined) {
89-
for (const target of progressData?.progressOverview.targets) {
90-
data.map((row) => {
91-
row.row[target.targetName] = '';
116+
courseTargets.targets.map((target: Target) => {
117+
data.map((row: any) => {
118+
row.row[target.targetName] = '';
119+
});
120+
if (!learningTargetSet.has(target.targetName)) {
121+
learningTargetSet.add(target.targetName);
122+
learningTargetGroup.columns.push({
123+
Header: target.description,
124+
accessor: `row.${target.targetName}`,
92125
});
93-
if (!learningTargetSet.has(target.targetName)) {
94-
learningTargetSet.add(target.targetName);
95-
learningTargetGroup.columns.push({
96-
Header: target.targetName,
97-
accessor: `row.${target.targetName}`,
98-
});
99-
}
100126
}
101-
tableColumns.push(learningTargetGroup);
102-
}
127+
});
128+
tableColumns.push(learningTargetGroup);
103129

104130
return (
105-
<div className="base-table">
106-
<TableComponent columns={tableColumns} data={data} rowClickFunction={rowClicked} />
131+
<div>
132+
<ToggleButtonGroup
133+
value={selectedLT}
134+
style={{ paddingLeft: '20px' }}
135+
exclusive
136+
onChange={handleLTSelection}
137+
>
138+
{courseTargets.targets.map((target: Target) => {
139+
return (
140+
<ToggleButton value={target.targetId} style={{ width: '100px' }}>
141+
{target.targetName}
142+
</ToggleButton>
143+
);
144+
})}
145+
</ToggleButtonGroup>
146+
147+
{selectedLT === null ? (
148+
<div className="base-table">
149+
<TableComponent columns={tableColumns} data={data} rowClickFunction={rowClicked} />
150+
</div>
151+
) : (
152+
<SelectedLTStudentViewTable
153+
classMissionMastery={missionMasteryData?.classMissionMastery}
154+
selectedLTId={selectedLT}
155+
/>
156+
)}
107157
</div>
108158
);
109159
}

0 commit comments

Comments
 (0)