CSC/ECE 517 Fall 2025 - E2568. Finish tabbed view for Assignments, including Topics and Calibration tabs

Introduction

Overview

This project is a continuation of E2558. The Edit Assignment front end will get an additional tab for review calibration. Additionally, the Topics tab created as part of E2558 will be integrated with the topic table created by E2557. The images below are samples provided to the team.

Requirements

Calibration Tab

• Tab header should be "Submit reviews for calibration"
• Table should have three columns titled:
  • Participant name: displays the name in the format of "unityid (Full Name)"
  • Action: contains a link to "Begin" that once clicked changes to the links "View" and "Edit"
  • Submitted item(s): provides a view of the submitted calibration materials

Topics Table Integration

• Communicate with the respective team to ensure compatibility
• Work with them to adjust any requirements or details

Design

Front end work

• We need to add a new Calibration tab to the existing setup
• These changes will happen in the AssignmentEditor.tsx file along with the rest of the editor tabs.
• Since there's a table to be added, we will use the previously built table component to avoid having to create a custom design. This also helps ensure the design stays consistent with the rest of the site.
• We'll need to store certain states on this tab to trigger the visibility of other buttons. These states will be stored in the AssignmentUtils.tsx file.
• To integrate the table from project E2557, we'll have to make changes to the existing tab layout and add any dependencies the new table has.

Design Principles used

1. Don't Repeat Yourself: Shared table rendering logic reused via helper components. API utility reused for all fetch calls.
2. Single Responsibility Principle: Each tab component handles only its own view and logic.
3. Open/Closed Principle: Since the tabs are modular, we can add new tabs without modifying existing ones. This makes it much easier to add or change them without messing with the rest of the structure.

Testing Plan

• For frontend tests, we will focus on getting the system setup from scratch since the Assignment Editor doesn't have one as of yet.
• This will involve adding tests top check whether appropriate components are visible when they should be, and if the different states stored for each tab stay consistent across the session.
• We'll also focus on checking if the data seen in the tables on the tabs is correct and aligns with what we're fetching from the backend

Code changes

To be added

Team Members

• Keyur Gondhalekar
• Nishad Tardalkar
• Evan Shea
• Mentor: Koushik Gudipelly

Additional References

Prior Project (E2558)

• E2558 Wiki Page
• Current front-end implementation repo
• Current back-end implementation repo