+ {/* Previously hidden when data fit a single page; now always driven by the showColumnFilter prop. */}
+ {showColumnFilter && header.column.getCanFilter() ? (
+
+ ) : null}
+
+ )}
+
@@ -266,7 +259,8 @@ const Table: React.FC = ({
setPageSize={table.setPageSize}
getPageCount={table.getPageCount}
getState={table.getState}
- totalItems={initialData.length}
+ // Use pre-pagination row count so the total reflects active filters, not raw data length.
+ totalItems={table.getPrePaginationRowModel().rows.length}
/>
)}
diff --git a/src/css-modules.d.ts b/src/css-modules.d.ts
index 96ac9c7e..1f64335c 100644
--- a/src/css-modules.d.ts
+++ b/src/css-modules.d.ts
@@ -1,4 +1,25 @@
+/**
+ * Type declarations for CSS Modules.
+ *
+ * Vite processes any file named *.module.css or *.module.scss as a CSS Module,
+ * hashing all local class names so they are scoped to the importing component.
+ * These declarations tell TypeScript that `import styles from "*.module.css/scss"`
+ * returns a plain object mapping original class names to their hashed equivalents,
+ * e.g. styles.tbl_heat → "tbl_heat_a1b2c3".
+ *
+ * Classes that must remain globally named (used as plain strings by components that
+ * don't import the module) should be wrapped in `:global { }` inside the SCSS file.
+ *
+ * Note: do NOT add `declare module "*.scss"` or `declare module "*.css"` here —
+ * those blanket declarations would allow side-effect imports of non-module files
+ * without type checking and mask missing-file errors.
+ */
declare module "*.module.css" {
const classes: { readonly [key: string]: string };
export default classes;
}
+
+declare module "*.module.scss" {
+ const classes: { readonly [key: string]: string };
+ export default classes;
+}
diff --git a/src/pages/ReviewTableau/ScoreWidgets.tsx b/src/pages/ReviewTableau/ScoreWidgets.tsx
index 7a255c1b..061d9d98 100644
--- a/src/pages/ReviewTableau/ScoreWidgets.tsx
+++ b/src/pages/ReviewTableau/ScoreWidgets.tsx
@@ -1,7 +1,6 @@
import React from 'react';
-import { getColorClass } from '../ViewTeamGrades/utils';
+import { getColorClass } from '../ViewTeamGrades/heatgridUtils';
import { ScoreWidgetProps } from '../../types/reviewTableau';
-import '../ViewTeamGrades/grades.scss';
/**
* Reusable circular score widget that matches the design used in ViewTeamGrades
diff --git a/src/pages/StudentTasks/StudentTaskDetail.module.css b/src/pages/StudentTasks/StudentTaskDetail.module.css
new file mode 100644
index 00000000..4b1236e1
--- /dev/null
+++ b/src/pages/StudentTasks/StudentTaskDetail.module.css
@@ -0,0 +1,185 @@
+.container {
+ font-family: Arial, sans-serif;
+ padding: 1.5rem 2.5rem;
+ max-width: 1200px;
+ margin: 0 auto;
+}
+
+/* Header Section */
+.header {
+ border-bottom: 2px solid #e0e0e0;
+ padding-bottom: 1rem;
+ margin-bottom: 1.5rem;
+ overflow: hidden;
+}
+
+.header h1 {
+ font-size: 22px;
+ font-weight: 600;
+ color: #333;
+ margin: 0;
+}
+
+.programLink {
+ color: #333;
+ text-decoration: none;
+}
+
+.programLink:hover {
+ text-decoration: underline;
+}
+
+/* Email link */
+.link_to_right {
+ float: right;
+ font-size: 13px;
+}
+
+/* Task Links Section */
+.taskLinks {
+ background-color: #fafafa;
+ border: 1px solid #e8e8e8;
+ border-radius: 6px;
+ padding: 1rem 1.5rem;
+ margin-bottom: 2rem;
+}
+
+.taskList {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+}
+
+.taskItem {
+ font-size: 16px;
+ line-height: 1.5;
+ border-bottom: 1px solid #f0f0f0;
+ padding: 4px 0;
+}
+
+.taskItem:last-child {
+ border-bottom: none;
+}
+
+.taskDescription {
+ color: #666;
+ font-size: 15px;
+}
+
+/* Timeline Section */
+.timelineContainer {
+ margin: 20px 0;
+ background-color: #fafafa;
+ border: 1px solid #e8e8e8;
+ border-radius: 6px;
+ padding: 2rem;
+}
+
+.timelineDates {
+ display: flex;
+ justify-content: space-between;
+ font-size: 14px;
+ font-weight: 500;
+ color: #333;
+ align-items: center;
+ margin-bottom: 12px;
+}
+
+.timelineVisual {
+ position: relative;
+ height: 30px;
+ margin: 15px 0;
+}
+
+.timelineLine {
+ position: absolute;
+ top: 50%;
+ left: 0;
+ right: 0;
+ background-color: #dc3545;
+ transform: translateY(-50%);
+ height: 4px;
+ width: 100%;
+}
+
+.timelineDots {
+ display: flex;
+ justify-content: space-between;
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ height: 100%;
+}
+
+.dot {
+ width: 25px;
+ height: 25px;
+ background-color: #dc3545;
+ border-radius: 50%;
+ margin-top: 7px;
+}
+
+.timelineDeadlines {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 20px;
+}
+
+.deadlineLink {
+ color: #986633;
+ text-decoration: none;
+ font-weight: 600;
+ text-align: center;
+ flex: 1;
+ font-size: 15px;
+}
+
+/* Send Email button */
+.emailButton {
+ position: absolute;
+ top: calc(1rem + 10px);
+ transform: translateY(-50%);
+ right: 3rem;
+ background-color: #A90201;
+ color: white;
+ border: none;
+ border-radius: 4px;
+ padding: 6px 14px;
+ font-size: 14px;
+ cursor: pointer;
+ text-decoration: none;
+}
+
+.emailButton:hover {
+ background-color: #870100;
+ color: white;
+ text-decoration: none;
+}
+
+.deadlineLink:hover {
+ text-decoration: underline;
+ color: #7a4f1f;
+}
+
+/* Footer Section */
+.footer {
+ display: flex;
+ justify-content: center;
+ padding: 20px 0;
+ border-top: 1px solid #e0e0e0;
+ margin-top: 2rem;
+ gap: 20px;
+}
+
+/* Clickable link styling */
+.clickableLink {
+ color: #986633;
+ text-decoration: none;
+}
+
+.clickableLink:hover {
+ color: #000000;
+ text-decoration: underline;
+}
+
diff --git a/src/pages/StudentTasks/StudentTaskDetail.tsx b/src/pages/StudentTasks/StudentTaskDetail.tsx
new file mode 100644
index 00000000..baa6f905
--- /dev/null
+++ b/src/pages/StudentTasks/StudentTaskDetail.tsx
@@ -0,0 +1,350 @@
+/**
+ * StudentTaskDetail — the per-assignment detail page reached by clicking an assignment
+ * name in the StudentTasks dashboard.
+ *
+ * Two data sources are combined:
+ * - router state (location.state): summary fields (assignment name, currentStage, etc.)
+ * passed via Link state= in StudentTasks. These are available immediately, so the page
+ * renders a meaningful header before the API responds.
+ * - GET /student_tasks/show/:participantId: full task data including due_dates[]. This
+ * is always fetched — router state deliberately omits due_dates to avoid serialising
+ * large arrays into navigation history.
+ *
+ * Timeline rendering:
+ * - due_dates are sorted by date and displayed as three aligned rows:
+ * Row 1: formatted date + time labels
+ * Row 2: visual track line with coloured nodes (completed=red filled, current=pulsing,
+ * pending=grey outline)
+ * Row 3: deadline names, linked to /responses/:id for submitted responses
+ * - progressPercent drives a CSS linear-gradient on the track line so the red portion
+ * advances to the midpoint of the current stage node.
+ * - Date parsing handles both ISO (YYYY-MM-DD) and legacy dd-mm-yyyy formats from the API.
+ *
+ * "Your feedbacks" link navigates to /view-team-grades?assignmentId=X, using the
+ * assignmentId passed via router state (participant.parent_id on the backend).
+ */
+import React, { useState, useEffect, useMemo } from "react";
+import { useParams, Link, useLocation, useNavigate } from "react-router-dom";
+import styles from "./StudentTaskDetail.module.css";
+import axiosClient from "utils/axios_client";
+
+interface DueDates {
+ id: number | null;
+ type: number;
+ name: string;
+ date: string;
+ round: number | null;
+}
+
+interface TaskData {
+ assignment: string;
+ badges: boolean;
+ course: string;
+ currentStage: string;
+ due_dates: DueDates[];
+ id: number;
+ publishingRights: boolean;
+ reviewGrade: string;
+ stageDeadline: string;
+ topic: string;
+}
+
+interface StateData {
+ task: TaskData;
+ assignmentId?: number;
+}
+
+const StudentTaskDetail: React.FC = () => {
+ const { id } = useParams<{ id: string }>();
+ const location = useLocation();
+ const navigate = useNavigate();
+ const stateData = location.state as StateData;
+
+ // 1. Establish a single, consistent baseline instance for "today"
+ const today = useMemo(() => new Date(), []);
+
+ // 2. Always fetch full task data from API (router state lacks due_dates)
+ const [apiData, setApiData] = useState(null);
+ const [isLoading, setIsLoading] = useState(true);
+
+ useEffect(() => {
+ const fetchTaskDetails = async () => {
+ try {
+ setIsLoading(true);
+ const response = await axiosClient.get(`/student_tasks/show/${id}`);
+ setApiData(response.data);
+ } catch (error: any) {
+ if (error?.response?.status === 403 || error?.response?.status === 404) {
+ navigate("/");
+ return;
+ }
+ console.error("Error fetching student task details:", error);
+ } finally {
+ setIsLoading(false);
+ }
+ };
+
+ fetchTaskDetails();
+ }, [id]);
+
+ // Permissions from the participant object in the API response
+ const canSubmit = apiData?.participant?.can_submit !== false;
+ const canReview = apiData?.participant?.can_review !== false;
+
+ // Router state has camelCase summary fields; API has snake_case + due_dates
+ const assignment = stateData?.task?.assignment || apiData?.assignment || "Unknown Assignment";
+ const current_stage = stateData?.task?.currentStage || apiData?.current_stage || "Not Started";
+
+ // Parse due_dates from the API response. The backend may return dates in either
+ // ISO 8601 format (YYYY-MM-DDTHH:MM:SSZ) or legacy dd-mm-yyyy HH:MM:SS format.
+ // Only the legacy format is reformatted — ISO strings already parse correctly in all browsers.
+ const due_dates: DueDates[] = useMemo(() => {
+ return (apiData?.due_dates || []).map((due: any) => {
+ let safeDateString = due.date;
+
+ // Only reformat dd-mm-yyyy strings; skip ISO dates (which already start YYYY-)
+ if (due.date && due.date.includes('-') && !/^\d{4}-/.test(due.date)) {
+ const [datePart, timePart] = due.date.split(' ');
+ const [day, month, year] = datePart.split('-');
+ safeDateString = `${year}-${month}-${day}T${timePart}Z`;
+ }
+
+ return {
+ id: due.id ?? null,
+ type: due.type,
+ name: due.name || "Unknown Stage",
+ date: safeDateString || new Date().toISOString(),
+ round: due.round ?? null
+ };
+ });
+ }, [apiData?.due_dates]);
+
+ /**
+ * Determines the visual status of a due-date node for the timeline.
+ * Primary path: find the index of the due_date whose name matches current_stage
+ * (e.g. "submission" matches "Submission deadline"). Nodes before it are "completed",
+ * the matching node is "current", nodes after are "pending".
+ * Fallback (when no name match): treat the first future due_date as "current" and
+ * everything before it as "completed". This handles stages like "In progress" that
+ * don't map directly to a due_date name.
+ */
+ const getStageStatus = (index: number): "completed" | "current" | "pending" => {
+ const currentStageIndex = due_dates.findIndex(due_date =>
+ due_date.name.toLowerCase().includes(current_stage.toLowerCase())
+ );
+
+ // Fallback: If "In progress" doesn't strictly string-match "Submission" or "Review"
+ if (currentStageIndex === -1) {
+ const deadlineDate = new Date(due_dates[index].date);
+ if (deadlineDate > today) {
+ const firstFutureIndex = due_dates.findIndex(d => new Date(d.date) > today);
+ return index === firstFutureIndex ? "current" : "pending";
+ }
+ return "completed";
+ }
+
+ if (index < currentStageIndex) return "completed";
+ if (index === currentStageIndex) return "current";
+ return "pending";
+ };
+
+ if (isLoading) {
+ return
Loading task details...
;
+ }
+
+ // Compute how far along the timeline track line should be filled red.
+ // Uses step-based calculation (each node occupies 100/N %) rather than wall-clock time,
+ // so equally spaced nodes visually represent equal progress regardless of real duration.
+ // The active node's midpoint is used so the red line ends at the centre of the current dot.
+ const progressPercent = (() => {
+ const totalCount = due_dates.length;
+ if (totalCount === 0) return 0;
+
+ const activeIndex = due_dates.findIndex((_, idx) => getStageStatus(idx) === "current");
+
+ if (activeIndex === -1) {
+ const allPast = due_dates.every(d => new Date(d.date) < today);
+ return allPast ? 100 : 0;
+ }
+
+ const stepSize = 100 / totalCount;
+ return (activeIndex * stepSize) + (stepSize / 2);
+ })();
+
+ return (
+
+
+
+ Submit or Review work for{" "}
+
+ {assignment}
+
+
+
+
+
+
+
+ Send Email To Reviewers
+
+
+
+ Your team
+ (View and manage your team)
+
+ {canSubmit && (
+
+ Your work
+ (View your work)
+
+ )}
+ {canReview && (
+
+ Others' work
+ (Give feedback to others on their work)
+
+ )}
+
+ Your feedbacks
+ (View scores and feedback on your work)
+
+
+ Change your handle
+ (Provide a different handle for this assignment)
+
+
+ {/* Row 2: Dynamic Visual Line Progression and Nodes */}
+
+
+ {/* Dynamic Colored Timeline Track Line (Overrides solid background with inline linear gradient) */}
+
+
+ {/* Nodes Stacked Directly on top of the track line */}
+
+ );
+};
+
+export default StudentTasksList;
diff --git a/src/pages/ViewTeamGrades/App.tsx b/src/pages/ViewTeamGrades/App.tsx
index 3b63a8fe..2c96adf6 100644
--- a/src/pages/ViewTeamGrades/App.tsx
+++ b/src/pages/ViewTeamGrades/App.tsx
@@ -7,12 +7,21 @@ export interface TeamMember {
username: string;
}
+// Sentinel type returned by the backend when a questionnaire item is a SectionHeader.
+// The backend injects { type: "header", txt: "..." } at the correct positions in the
+// per-round scores array so the frontend can render labelled section dividers between rows.
+export interface SectionHeaderData {
+ type: "header";
+ txt: string;
+}
+
// Interface defining the structure of ReviewData
export interface ReviewData {
itemNumber: string;
itemText: string;
itemType?: string; // Type of item (Scale, Criterion, TextArea, etc.)
reviews: {
+ name?: string; // reviewer name (populated by convertBackendRoundArray)
score?: number;
comment?: string;
textResponse?: string; // For TextArea/TextField
diff --git a/src/pages/ViewTeamGrades/Data/authorFeedback.json b/src/pages/ViewTeamGrades/Data/authorFeedback.json
deleted file mode 100644
index ed3317ae..00000000
--- a/src/pages/ViewTeamGrades/Data/authorFeedback.json
+++ /dev/null
@@ -1,84 +0,0 @@
-[
- [
- {
- "questionNumber": "1",
- "questionText": "This reviewer appeared to understand my work.",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The reviewer demonstrated a deep understanding of the work, providing insightful feedback." },
- { "name": "Alice", "score": 3, "comment": "While the reviewer grasped the main points, some aspects could have been clarified further." },
- { "name": "Bob", "score": 4, "comment": "The reviewer's understanding was evident, although certain nuances could have been explored more." },
- { "name": "Emma", "score": 5, "comment": "The reviewer showcased a comprehensive understanding of the work, offering valuable insights." },
- { "name": "Mike", "score": 4, "comment": "The reviewer's comprehension was evident, but a few minor details could have been addressed." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "2",
- "questionText": "This reviewer's comments helped me improve my work.",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The reviewer's comments were insightful and contributed significantly to the improvement of the work." },
- { "name": "Alice", "score": 5, "comment": "The reviewer's feedback was instrumental in refining various aspects of the work." },
- { "name": "Bob", "score": 5, "comment": "The reviewer's constructive criticism was invaluable in enhancing the quality of the work." },
- { "name": "Emma", "score": 5, "comment": "The reviewer's suggestions were practical and directly led to improvements in the work." },
- { "name": "Mike", "score": 5, "comment": "The reviewer's feedback played a crucial role in refining the work and addressing potential shortcomings." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "3",
- "questionText": "The tone of this review was respectful.",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The reviewer maintained a respectful tone throughout the review, fostering a positive exchange of ideas." },
- { "name": "Alice", "score": 5, "comment": "The review was conducted in a respectful manner, acknowledging the efforts put into the work." },
- { "name": "Bob", "score": 5, "comment": "The reviewer's tone was consistently respectful, contributing to a constructive review process." },
- { "name": "Emma", "score": 5, "comment": "The tone of the review remained respectful, focusing on constructive criticism." },
- { "name": "Mike", "score": 5, "comment": "Throughout the review, the tone remained respectful and professional." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- }
- ],
- [
- {
- "questionNumber": "1",
- "questionText": "This reviewer appeared to understand my work.",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The reviewer demonstrated a good understanding of the work, providing valuable insights." },
- { "name": "Alice", "score": 5, "comment": "The reviewer's understanding of the work was evident, contributing to meaningful feedback." },
- { "name": "Bob", "score": 3, "comment": "While the reviewer grasped the main points, certain aspects could have been explained more clearly." },
- { "name": "Emma", "score": 4, "comment": "The reviewer showcased a solid understanding of the work, offering constructive feedback." },
- { "name": "Mike", "score": 5, "comment": "The reviewer's comprehension was evident, providing insightful comments." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "2",
- "questionText": "This reviewer's comments helped me improve my work.",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The reviewer's comments offered valuable insights that contributed to improving the work." },
- { "name": "Alice", "score": 5, "comment": "The reviewer provided constructive criticism that directly led to enhancements in the work." },
- { "name": "Bob", "score": 3, "comment": "While the reviewer's feedback was helpful, certain suggestions could have been elaborated further." },
- { "name": "Emma", "score": 4, "comment": "The reviewer's suggestions were practical and contributed to refining various aspects of the work." },
- { "name": "Mike", "score": 5, "comment": "The reviewer's feedback played a crucial role in refining the work and addressing potential weaknesses." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "3",
- "questionText": "The tone of this review was respectful.",
- "reviews": [
- { "name": "John", "score": 4, "comment": "While the review was generally respectful, there were a few instances where the tone could have been more considerate." },
- { "name": "Alice", "score": 5, "comment": "The reviewer maintained a respectful tone throughout the review, fostering a positive exchange of ideas." },
- { "name": "Bob", "score": 3, "comment": "While most of the review was conducted with a respectful tone, certain sections could have been phrased more diplomatically." },
- { "name": "Emma", "score": 4, "comment": "The review was conducted with a respectful tone, focusing on constructive criticism." },
- { "name": "Mike", "score": 5, "comment": "Throughout the review, the tone remained respectful and professional." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- }
- ]
-]
diff --git a/src/pages/ViewTeamGrades/Data/dummyData.json b/src/pages/ViewTeamGrades/Data/dummyData.json
deleted file mode 100644
index 3963694a..00000000
--- a/src/pages/ViewTeamGrades/Data/dummyData.json
+++ /dev/null
@@ -1,24 +0,0 @@
-{
- "team": "Straw Hat Pirates",
- "members": [
- {
- "name": "Aniket Singh Shaktawat",
- "username": "ashaktaw"
- },
- {
- "name": "Pankhi Saini",
- "username": "psaini"
- },
- {
- "name": "Siddharth Shah",
- "username": "sshah"
- },
- {
- "name": "Riya Gori",
- "username": "rgori"
- }
- ],
- "grade": "Grade for submission",
- "comment": "Comment for submission",
- "late_penalty": 0
-}
\ No newline at end of file
diff --git a/src/pages/ViewTeamGrades/Data/heatMapData.json b/src/pages/ViewTeamGrades/Data/heatMapData.json
deleted file mode 100644
index 7ea51e2b..00000000
--- a/src/pages/ViewTeamGrades/Data/heatMapData.json
+++ /dev/null
@@ -1,371 +0,0 @@
-[
- [
- {
- "questionNumber": "1",
- "questionText": "What is the main purpose of this feature?",
- "reviews": [
- { "name": "John", "score": 4, "comment": "Great work on this aspect!" },
- { "name": "Alice", "score": 3, "comment": "Could use some improvement here." },
- { "name": "Bob", "score": 4, "comment": "The presentation was well-organized and clear. However, some points could have been elaborated further to provide a deeper understanding of the topic." },
- { "name": "Emma", "score": 5, "comment": "The speaker demonstrated a profound understanding of the subject matter, making the session engaging and informative." },
- { "name": "Mike", "score": 4, "comment": "The visuals were compelling and helped in understanding complex concepts easily. However, there were a few slides with too much text, which made it hard to follow at times." },
- { "name": "Sophia", "score": 5, "comment": "The use of real-world examples made the concepts more relatable and easier to grasp. Additionally, the speaker was engaging and kept the audience hooked throughout." },
- { "name": "David", "score": 4, "comment": "The interactive exercises were beneficial in reinforcing the learning. However, there were a few technical glitches that disrupted the flow." },
- { "name": "Olivia", "score": 5, "comment": "The hands-on activities were the highlight of the session, providing practical experience that complemented the theoretical learning." },
- { "name": "William", "score": 4, "comment": "The guest speaker brought a fresh perspective to the topic, offering valuable insights that sparked further discussions among the participants." },
- { "name": "Sophia", "score": 5, "comment": "The case studies presented were enlightening, providing practical examples that showcased the application of theoretical concepts." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "2",
- "questionText": "How user-friendly is this feature?",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The interface was intuitive and easy to navigate." },
- { "name": "Alice", "score": 2, "comment": "There were some confusing elements that could be simplified." },
- { "name": "Bob", "score": 5, "comment": "The feature was straightforward to use, with clear instructions." },
- { "name": "Emma", "score": 2, "comment": "The user experience could be improved, especially for new users." },
- { "name": "Mike", "score": 3, "comment": "Some aspects were user-friendly, but others required a learning curve." },
- { "name": "Sophia", "score": 2, "comment": "More tooltips or hints could enhance the user-friendliness." },
- { "name": "David", "score": 3, "comment": "Overall, the feature was easy to grasp, but minor improvements could enhance the user experience." },
- { "name": "Olivia", "score": 4, "comment": "The feature was generally user-friendly, with a few areas for improvement." },
- { "name": "William", "score": 3, "comment": "Certain functions were straightforward, while others could use simplification." },
- { "name": "Sophia", "score": 2, "comment": "The feature would benefit from clearer labels and instructions." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "3",
- "questionText": "Does this feature meet the project requirements?",
- "reviews": [
- { "name": "John", "score": 1},
- { "name": "Alice", "score": 1},
- { "name": "Bob", "score": 1},
- { "name": "Emma", "score": 0},
- { "name": "Mike", "score": 1},
- { "name": "Sophia", "score": 0},
- { "name": "David", "score": 1},
- { "name": "Olivia", "score": 1},
- { "name": "William", "score": 1},
- { "name": "Sophia", "score": 0}
- ],
- "RowAvg": 0,
- "maxScore": 1
- },
- {
- "questionNumber": "4",
- "questionText": "How would you rate the performance of this feature?",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The feature performs adequately under normal conditions." },
- { "name": "Alice", "score": 2, "comment": "Performance could be improved, especially for larger datasets." },
- { "name": "Bob", "score": 4, "comment": "The feature's performance is generally satisfactory." },
- { "name": "Emma", "score": 1, "comment": "Performance issues were encountered during testing." },
- { "name": "Mike", "score": 3, "comment": "Overall, the feature performs well, but some optimizations could enhance speed." },
- { "name": "Sophia", "score": 2, "comment": "The feature's performance is acceptable but could be faster." },
- { "name": "David", "score": 3, "comment": "The feature handles most tasks efficiently, but a few functions could be optimized." },
- { "name": "Olivia", "score": 4, "comment": "Performance is stable and meets expectations for regular use." },
- { "name": "William", "score": 3, "comment": "The feature's performance meets the needs for the intended tasks." },
- { "name": "Sophia", "score": 2, "comment": "There were occasional lags in performance during heavy usage." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "5",
- "questionText": "What are your thoughts on the design of this feature?",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The design is sleek and modern, enhancing usability." },
- { "name": "Alice", "score": 3, "comment": "Some design elements could be more cohesive." },
- { "name": "Bob", "score": 5, "comment": "The feature's design is intuitive and visually appealing." },
- { "name": "Emma", "score": 2, "comment": "The design could be more user-centric." },
- { "name": "Mike", "score": 4, "comment": "Overall, the design facilitates ease of use." },
- { "name": "Sophia", "score": 3, "comment": "Certain design choices enhance functionality, while others could be refined." },
- { "name": "David", "score": 4, "comment": "The design aligns well with the feature's purpose." },
- { "name": "Olivia", "score": 5, "comment": "The design elements contribute to a seamless user experience." },
- { "name": "William", "score": 4, "comment": "Design considerations are apparent, benefiting user interaction." },
- { "name": "Sophia", "score": 2, "comment": "Some design aspects may confuse new users." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "6",
- "questionText": "Were the documentation and help resources helpful?",
- "reviews": [
- { "name": "John", "score": 3, "comment": "The design is average, with room for improvement." },
- { "name": "Alice", "score": 5, "comment": "Certain design elements enhance usability effectively." },
- { "name": "Bob", "score": 5, "comment": "The design stands out with its intuitive layout." },
- { "name": "Emma", "score": 3, "comment": "Some design aspects could be more cohesive." },
- { "name": "Mike", "score": 5, "comment": "The feature's design is modern and visually appealing." },
- { "name": "Sophia", "score": 5, "comment": "Design considerations are apparent, benefiting user interaction." },
- { "name": "David", "score": 3, "comment": "The design offers room for improvement in certain areas." },
- { "name": "Olivia", "score": 4, "comment": "The feature's design is clean and uncluttered." },
- { "name": "William", "score": 5, "comment": "Certain design elements contribute significantly to usability." },
- { "name": "Sophia", "score": 3, "comment": "The design could be more user-centric." }
- ],
-
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "7",
- "questionText": "Did the feature perform well under stress/load?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The design is sleek and modern, enhancing usability." },
- { "name": "Alice", "score": 5, "comment": "The feature's design is intuitive and visually appealing." },
- { "name": "Bob", "score": 3, "comment": "Some design elements could be streamlined for clarity." },
- { "name": "Emma", "score": 5, "comment": "Overall, the design facilitates ease of use." },
- { "name": "Mike", "score": 5, "comment": "The design elements contribute to a seamless user experience." },
- { "name": "Sophia", "score": 3, "comment": "Certain design choices enhance functionality, while others could be refined." },
- { "name": "David", "score": 5, "comment": "The design aligns well with the feature's purpose." },
- { "name": "Olivia", "score": 5, "comment": "The design delights users with its attention to detail." },
- { "name": "William", "score": 3, "comment": "Some design aspects may confuse new users." },
- { "name": "Sophia", "score": 4, "comment": "The design balances aesthetics with functionality effectively." }
- ],
-
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "8",
- "questionText": "How satisfied are you with the support provided for this feature?",
- "reviews": [
- { "name": "John", "score": 3 },
- { "name": "Alice", "score": 4 },
- { "name": "Bob", "score": 5 },
- { "name": "Emma", "score": 2 },
- { "name": "Mike", "score": 4 },
- { "name": "Sophia", "score": 3 },
- { "name": "David", "score": 4 },
- { "name": "Olivia", "score": 5 },
- { "name": "William", "score": 4 },
- { "name": "Sophia", "score": 2 }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "9",
- "questionText": "Would you recommend this feature to others?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The design is exceptional, exceeding expectations." },
- { "name": "Alice", "score": 3, "comment": "Certain design aspects could be polished further." },
- { "name": "Bob", "score": 5, "comment": "Overall, the design enhances user experience effectively." },
- { "name": "Emma", "score": 5, "comment": "The feature's design is top-notch, setting a new standard." },
- { "name": "Mike", "score": 3, "comment": "Some design elements could be more intuitive." },
- { "name": "Sophia", "score": 5, "comment": "The design offers a pleasant user journey." },
- { "name": "David", "score": 5, "comment": "Design considerations are evident, making tasks straightforward." },
- { "name": "Olivia", "score": 3, "comment": "Certain design choices may require further refinement." },
- { "name": "William", "score": 5, "comment": "The design adapts well to different screen sizes and devices." },
- { "name": "Sophia", "score": 5, "comment": "The feature's design is a joy to interact with." }
- ],
-
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "10",
- "questionText": "Overall, how would you rate this feature?",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The design is polished and professional." },
- { "name": "Alice", "score": 5, "comment": "Certain design elements make the feature a joy to use." },
- { "name": "Bob", "score": 3, "comment": "Some design aspects could benefit from refinement." },
- { "name": "Emma", "score": 5, "comment": "The design is user-friendly, with intuitive navigation." },
- { "name": "Mike", "score": 5, "comment": "Certain design elements enhance user interaction effectively." },
- { "name": "Sophia", "score": 3, "comment": "Some design aspects may require further attention." },
- { "name": "David", "score": 5, "comment": "The design encourages exploration and discovery." },
- { "name": "Olivia", "score": 5, "comment": "The feature's design sets a new standard for user interfaces." },
- { "name": "William", "score": 3, "comment": "Certain design elements are confusing and could be clarified." },
- { "name": "Sophia", "score": 5, "comment": "The design offers an inviting and engaging experience." }
- ],
-
- "RowAvg": 0,
- "maxScore": 5
- }
- ],
- [
- {
- "questionNumber": "1",
- "questionText": "What is the main purpose of this feature?",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The design is polished and professional." },
- { "name": "Alice", "score": 5, "comment": "Certain design elements make the feature a joy to use." },
- { "name": "Bob", "score": 3, "comment": "Some design aspects could benefit from refinement." },
- { "name": "Emma", "score": 4, "comment": "The design is user-friendly, with intuitive navigation." },
- { "name": "Mike", "score": 5, "comment": "Certain design elements enhance user interaction effectively." },
- { "name": "Sophia", "score": 4, "comment": "Some design aspects may require further attention." },
- { "name": "David", "score": 4, "comment": "The design encourages exploration and discovery." },
- { "name": "Olivia", "score": 5, "comment": "The feature's design sets a new standard for user interfaces." },
- { "name": "William", "score": 4, "comment": "Certain design elements are confusing and could be clarified." },
- { "name": "Sophia", "score": 4, "comment": "The design offers an inviting and engaging experience." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "2",
- "questionText": "How user-friendly is this feature?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The design is flawless, making tasks effortless." },
- { "name": "Alice", "score": 2, "comment": "Some design aspects could be more user-oriented." },
- { "name": "Bob", "score": 4, "comment": "The feature's design is inviting and approachable." },
- { "name": "Emma", "score": 5, "comment": "Certain design elements provide a delightful user journey." },
- { "name": "Mike", "score": 2, "comment": "Some design choices could enhance user engagement." },
- { "name": "Sophia", "score": 4, "comment": "The design adapts well to varying user needs." },
- { "name": "David", "score": 5, "comment": "The feature's design excels in simplicity and effectiveness." },
- { "name": "Olivia", "score": 3, "comment": "Certain design elements could benefit from more visual hierarchy." },
- { "name": "William", "score": 4, "comment": "The design offers a pleasing aesthetic while being functional." },
- { "name": "Sophia", "score": 5, "comment": "The feature's design is intuitive and user-centric." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "3",
- "questionText": "Does this feature meet the project requirements?",
- "reviews": [
- { "name": "John", "score": 1},
- { "name": "Alice", "score": 1},
- { "name": "Bob", "score": 1},
- { "name": "Emma", "score": 0},
- { "name": "Mike", "score": 1},
- { "name": "Sophia", "score": 0},
- { "name": "David", "score": 1},
- { "name": "Olivia", "score": 0},
- { "name": "William", "score": 0},
- { "name": "Sophia", "score": 1 }
- ],
- "RowAvg": 0,
- "maxScore": 1
- },
- {
- "questionNumber": "4",
- "questionText": "How would you rate the performance of this feature?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The design is exceptional, exceeding expectations." },
- { "name": "Alice", "score": 5, "comment": "Certain design aspects could be polished further." },
- { "name": "Bob", "score": 4, "comment": "Overall, the design enhances user experience effectively." },
- { "name": "Emma", "score": 5, "comment": "The feature's design is top-notch, setting a new standard." },
- { "name": "Mike", "score": 0, "comment": "Some design elements could be more intuitive." },
- { "name": "Sophia", "score": 4, "comment": "The design offers a pleasant user journey." },
- { "name": "David", "score": 5, "comment": "Design considerations are evident, making tasks straightforward." },
- { "name": "Olivia", "score": 5, "comment": "Certain design choices may require further refinement." },
- { "name": "William", "score": 5, "comment": "The design adapts well to different screen sizes and devices." },
- { "name": "Sophia", "score": 5, "comment": "The feature's design is a joy to interact with." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "5",
- "questionText": "What are your thoughts on the design of this feature?",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The design is polished and professional." },
- { "name": "Alice", "score": 5, "comment": "Certain design elements make the feature a joy to use." },
- { "name": "Bob", "score": 3, "comment": "Some design aspects could benefit from refinement." },
- { "name": "Emma", "score": 4, "comment": "The design is user-friendly, with intuitive navigation." },
- { "name": "Mike", "score": 5, "comment": "Certain design elements enhance user interaction effectively." },
- { "name": "Sophia", "score": 2, "comment": "Some design aspects may require further attention." },
- { "name": "David", "score": 4, "comment": "The design encourages exploration and discovery." },
- { "name": "Olivia", "score": 5, "comment": "The feature's design sets a new standard for user interfaces." },
- { "name": "William", "score": 4, "comment": "Certain design elements are confusing and could be clarified." },
- { "name": "Sophia", "score": 4, "comment": "The design offers an inviting and engaging experience." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "6",
- "questionText": "Were the documentation and help resources helpful?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The design is flawless, making tasks effortless." },
- { "name": "Alice", "score": 3, "comment": "Some design aspects could be more user-oriented." },
- { "name": "Bob", "score": 5, "comment": "The feature's design is inviting and approachable." },
- { "name": "Emma", "score": 5, "comment": "Certain design elements provide a delightful user journey." },
- { "name": "Mike", "score": 3, "comment": "Some design choices could enhance user engagement." },
- { "name": "Sophia", "score": 4, "comment": "The design adapts well to varying user needs." },
- { "name": "David", "score": 5, "comment": "The feature's design excels in simplicity and effectiveness." },
- { "name": "Olivia", "score": 1, "comment": "Certain design elements could benefit from more visual hierarchy." },
- { "name": "William", "score": 5, "comment": "The design offers a pleasing aesthetic while being functional." },
- { "name": "Sophia", "score": 5, "comment": "The feature's design is intuitive and user-centric." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "7",
- "questionText": "Did the feature perform well under stress/load?",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The design is sleek and modern, enhancing usability." },
- { "name": "Alice", "score": 5, "comment": "The feature's design is intuitive and visually appealing." },
- { "name": "Bob", "score": 3, "comment": "Some design elements could be streamlined for clarity." },
- { "name": "Emma", "score": 4, "comment": "Overall, the design facilitates ease of use." },
- { "name": "Mike", "score": 5, "comment": "The design elements contribute to a seamless user experience." },
- { "name": "Sophia", "score": 2, "comment": "Certain design choices enhance functionality, while others could be refined." },
- { "name": "David", "score": 4, "comment": "The design aligns well with the feature's purpose." },
- { "name": "Olivia", "score": 5, "comment": "The design delights users with its attention to detail." },
- { "name": "William", "score": 2, "comment": "Some design aspects may confuse new users." },
- { "name": "Sophia", "score": 4, "comment": "The design balances aesthetics with functionality effectively." }
- ],
-
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "8",
- "questionText": "How satisfied are you with the support provided for this feature?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The design is exceptional, exceeding expectations." },
- { "name": "Alice", "score": 4, "comment": "Certain design aspects could be polished further." },
- { "name": "Bob", "score": 4, "comment": "Overall, the design enhances user experience effectively." },
- { "name": "Emma", "score": 5, "comment": "The feature's design is top-notch, setting a new standard." },
- { "name": "Mike", "score": 2, "comment": "Some design elements could be more intuitive." },
- { "name": "Sophia", "score": 4, "comment": "The design offers a pleasant user journey." },
- { "name": "David", "score": 5, "comment": "Design considerations are evident, making tasks straightforward." },
- { "name": "Olivia", "score": 3, "comment": "Certain design choices may require further refinement." },
- { "name": "William", "score": 4, "comment": "The design adapts well to different screen sizes and devices." },
- { "name": "Sophia", "score": 5, "comment": "The feature's design is a joy to interact with." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "9",
- "questionText": "Would you recommend this feature to others?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "The design is flawless, making tasks effortless." },
- { "name": "Alice", "score": 3, "comment": "Some design aspects could be more user-oriented." },
- { "name": "Bob", "score": 4, "comment": "The feature's design is inviting and approachable." },
- { "name": "Emma", "score": 5, "comment": "Certain design elements provide a delightful user journey." },
- { "name": "Mike", "score": 2, "comment": "Some design choices could enhance user engagement." },
- { "name": "Sophia", "score": 4, "comment": "The design adapts well to varying user needs." },
- { "name": "David", "score": 5, "comment": "The feature's design excels in simplicity and effectiveness." },
- { "name": "Olivia", "score": 2, "comment": "Certain design elements could benefit from more visual hierarchy." },
- { "name": "William", "score": 4, "comment": "The design offers a pleasing aesthetic while being functional." },
- { "name": "Sophia", "score": 5, "comment": "The feature's design is intuitive and user-centric." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "10",
- "questionText": "Overall, how would you rate this feature?",
- "reviews": [
- { "name": "John", "score": 4, "comment": "The design is sleek and modern, enhancing usability." },
- { "name": "Alice", "score": 5, "comment": "The feature's design is intuitive and visually appealing." },
- { "name": "Bob", "score": 3, "comment": "Some design elements could be streamlined for clarity." },
- { "name": "Emma", "score": 4, "comment": "Overall, the design facilitates ease of use." },
- { "name": "Mike", "score": 3, "comment": "The design elements contribute to a seamless user experience." },
- { "name": "Sophia", "score": 3, "comment": "Certain design choices enhance functionality, while others could be refined. Overall scope of improvement" },
- { "name": "David", "score": 4, "comment": "The design aligns well with the feature's purpose." },
- { "name": "Olivia", "score": 5, "comment": "The design delights users with its attention to detail." },
- { "name": "William", "score": 4, "comment": "Some design aspects may confuse new users." },
- { "name": "Sophia", "score": 4, "comment": "The design balances aesthetics with functionality effectively." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- }
- ]
-]
\ No newline at end of file
diff --git a/src/pages/ViewTeamGrades/Data/teammateData.json b/src/pages/ViewTeamGrades/Data/teammateData.json
deleted file mode 100644
index 7b6a20a8..00000000
--- a/src/pages/ViewTeamGrades/Data/teammateData.json
+++ /dev/null
@@ -1,124 +0,0 @@
-
- [
- {
- "questionNumber": "1",
- "questionText": "How many times was this person late to meetings?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "He was never late for any meeting." },
- { "name": "Alice", "score": 4, "comment": "She was late once due to traffic." },
- { "name": "Bob", "score": 5, "comment": "He was punctual for all meetings." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "2",
- "questionText": "How many times did this person fail to show up?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "This never happened." },
- { "name": "Alice", "score": 4, "comment": "She missed one meeting due to illness." },
- { "name": "Bob", "score": 5, "comment": "He never failed to show up." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "3",
- "questionText": "What fraction of the work assigned to this person did (s)he do?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "He completed all assigned tasks on time." },
- { "name": "Alice", "score": 4, "comment": "She completed 70% of the assigned work." },
- { "name": "Bob", "score": 5, "comment": "He completed 100% of his assigned work." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "4",
- "questionText": "Did this person do assigned work on time?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "Yes, he did all the work on time." },
- { "name": "Alice", "score": 4, "comment": "She completed most of the work on time." },
- { "name": "Bob", "score": 5, "comment": "He always completed his work on time." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "5",
- "questionText": "How much initiative did this person take on this project?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "He always took initiatives and brought fresh ideas." },
- { "name": "Alice", "score": 4, "comment": "She occasionally proposed new ideas for improvement." },
- { "name": "Bob", "score": 5, "comment": "He consistently showed initiative and creativity." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "6",
- "questionText": "Did this person shirk any task that was necessary for completing the project?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "This never happened." },
- { "name": "Alice", "score": 4, "comment": "She occasionally avoided tasks she found challenging." },
- { "name": "Bob", "score": 5, "comment": "He always fulfilled his responsibilities." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "7",
- "questionText": "Did you need to clean up any of the code written by this team member?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "No, the code was clean and easy to read." },
- { "name": "Alice", "score": 4, "comment": "Some parts of her code needed minor cleanup." },
- { "name": "Bob", "score": 5, "comment": "His code was well-structured and required no cleanup." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "8",
- "questionText": "Did this person make any unneeded modifications that did not benefit the project, but may have increased their score on the Github metrics?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "Not at all, he always had good explanation for his part of the work." },
- { "name": "Alice", "score": 4, "comment": "She made a few unnecessary changes to increase her commit count." },
- { "name": "Bob", "score": 5, "comment": "He only made changes that were necessary for project improvement." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "9",
- "questionText": "Did this person exhibit any behaviors that could cause dissension on the team?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "No, he is fun to work with." },
- { "name": "Alice", "score": 4, "comment": "She occasionally disagreed with team decisions but was respectful." },
- { "name": "Bob", "score": 5, "comment": "He was cooperative and maintained a positive attitude." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "10",
- "questionText": "What fraction of the documentation did this person write? (Note: Contribution of all team members should not add up to more than 100%)",
- "reviews": [
- { "name": "John", "score": 4, "comment": "He did 50% of the work, He made the basic structure for the documentation and took most of the responsibility related to it." },
- { "name": "Alice", "score": 5, "comment": "She contributed 40% to the documentation, focusing on detailed explanations." },
- { "name": "Bob", "score": 4, "comment": "His contribution to documentation was 30%, mainly focused on formatting and organization." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- },
- {
- "questionNumber": "11",
- "questionText": "How important was this person to the team?",
- "reviews": [
- { "name": "John", "score": 5, "comment": "He brought great ideas for the project and thus was very important." },
- { "name": "Alice", "score": 4, "comment": "She played a significant role in decision-making and problem-solving." },
- { "name": "Bob", "score": 5, "comment": "His contributions were invaluable to the success of the project." }
- ],
- "RowAvg": 0,
- "maxScore": 5
- }
- ]
diff --git a/src/pages/ViewTeamGrades/FeedbackTable.tsx b/src/pages/ViewTeamGrades/FeedbackTable.tsx
new file mode 100644
index 00000000..685d7b41
--- /dev/null
+++ b/src/pages/ViewTeamGrades/FeedbackTable.tsx
@@ -0,0 +1,288 @@
+import React from "react";
+import { ReviewData, SectionHeaderData } from "./App";
+import { getColorClass, isHeader, RoundRow } from "./heatgridUtils";
+import { useSelector } from "react-redux";
+import { RootState } from "../../store/store";
+
+interface FeedbackTableProps {
+ /** All rounds of review data — each round is a mixed array of ReviewData and SectionHeaderData */
+ data: RoundRow[][];
+ /**
+ * -1 = show all rounds
+ * 0 = round 1 only
+ * 1 = round 2 only
+ */
+ roundSelected: number;
+}
+
+const STICKY_NO_WIDTH = 68; // px — wide enough for two-digit item numbers + weight badge on one line
+const STICKY_Q_WIDTH = 340; // px — the Question column
+
+const cellBase: React.CSSProperties = {
+ padding: "8px 10px",
+ verticalAlign: "top",
+ border: "1px solid #ddd",
+ fontSize: "13px",
+ whiteSpace: "normal",
+ wordBreak: "break-word",
+};
+
+const stickyNo: React.CSSProperties = {
+ ...cellBase,
+ position: "sticky",
+ left: 0,
+ zIndex: 3,
+ background: "#fff",
+ width: STICKY_NO_WIDTH,
+ minWidth: STICKY_NO_WIDTH,
+ maxWidth: STICKY_NO_WIDTH,
+ textAlign: "center",
+ fontWeight: "bold",
+ // no right border here — the Question column's left border provides the single divider
+ borderRight: "none",
+};
+
+const stickyQ: React.CSSProperties = {
+ ...cellBase,
+ position: "sticky",
+ left: STICKY_NO_WIDTH,
+ zIndex: 3,
+ background: "#fff",
+ width: STICKY_Q_WIDTH,
+ minWidth: STICKY_Q_WIDTH,
+ maxWidth: STICKY_Q_WIDTH,
+ borderLeft: "1px solid #ddd", // single line between # and Question
+ borderRight: "2px solid #aaa", // strong separator before reviewer columns
+};
+
+const reviewerCell: React.CSSProperties = {
+ ...cellBase,
+ minWidth: 260,
+ maxWidth: 380,
+ verticalAlign: "top",
+};
+
+/** Colour-coded score badge */
+const ScoreBadge: React.FC<{ score: number; maxScore: number }> = ({ score, maxScore }) => (
+
+ {score}
+
+);
+
+/** One per-round feedback table */
+const RoundFeedbackTable: React.FC<{ roundData: RoundRow[]; roundIndex: number; totalRounds: number; isStudent: boolean }> = ({
+ roundData,
+ roundIndex,
+ totalRounds,
+ isStudent,
+}) => {
+ if (!roundData || roundData.length === 0) return null;
+ // Find the first scored row (skip any leading SectionHeader) to get reviewer count
+ const firstScored = roundData.find(r => !isHeader(r)) as ReviewData | undefined;
+ const numReviewers = firstScored?.reviews.length ?? 0;
+
+ return (
+
+
Round {roundIndex + 1}
+
+ {/* Outer wrapper with horizontal scroll */}
+
+
+
+
+ {/* Sticky header: # — z-index 5 so it stays above body sticky cells (z-index 3) */}
+