Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 | 1x 15x 15x 8x 7x 8x 8x 8x 8x | import { useTheme } from "@mui/material/styles";
import { Chip, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Typography } from "@mui/material";
import { formatDate } from "@/utils/helpers/utcToLocalTime";
import { STATUS_META, statusColor } from "@/app/student-page/page/my-grade/gradeStatus";
const AssignmentsGradeTable = ({ assignments }) => {
const theme = useTheme();
if (!assignments || assignments.length === 0) {
return (
<Typography variant="body2" color="text.secondary">
No assignments yet.
</Typography>
);
}
return (
<TableContainer>
<Table size="small" id="student-my-grade-table" aria-label="Assignment grades">
<TableHead>
<TableRow>
<TableCell sx={{ fontWeight: 600 }}>Assignment</TableCell>
<TableCell sx={{ fontWeight: 600 }}>Type</TableCell>
<TableCell sx={{ fontWeight: 600 }}>Date Close</TableCell>
<TableCell sx={{ fontWeight: 600 }}>Status</TableCell>
<TableCell sx={{ fontWeight: 600 }} align="right">
Grade
</TableCell>
</TableRow>
</TableHead>
<TableBody>
{assignments.map((a) => {
const meta = STATUS_META[a.status] ?? STATUS_META.incomplete;
const Icon = meta.Icon;
const color = statusColor(theme, meta.colorKey);
return (
<TableRow key={a.assignment_id} data-assignment-id={a.assignment_id}>
<TableCell>{a.title ?? "Untitled"}</TableCell>
<TableCell sx={{ textTransform: "capitalize" }}>{a.type ?? "—"}</TableCell>
<TableCell>{a.date_close ? formatDate(a.date_close) : "—"}</TableCell>
<TableCell>
<Chip
size="small"
icon={<Icon sx={{ fontSize: 16 }} />}
label={meta.label}
variant="outlined"
sx={{ color, borderColor: color, "& .MuiChip-icon": { color } }}
/>
</TableCell>
<TableCell align="right" sx={{ fontWeight: 700 }}>
{typeof a.grade === "number" ? a.grade.toFixed(2) : "—"}
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
</TableContainer>
);
};
export default AssignmentsGradeTable;
|