Student Page + Table Component

[thomas-rocha]

Tracking Info

Part 1 of 2 of resolving issue 28

Changes

• Updated student model to hold "archived" field
• Created "archiveStudents" and "deleteStudents" to bulk archive/unarchive and delete students in a single request
• Added SVG icons with configurable colors
• Updated certain global css styles to match figma design
• Added a toast component with configurable "success", "neutral", and "error" states, as well as an optional action that can be triggered with a button
• Updated stylings for the StudentForm component

TODOS

• Add support for users in the Table component
• Integrate section color support when the sections PR goes through
• Add validation to archive/delete functions

Testing

I used a lot of manual testing. I went through the user flows in the figma to make sure the proper functionality worked as expected. I tried a variety of test cases to see how the table worked. I did the following tests to check for robustness.

• Trying to delete/archive/unarchive students when nothing is selected displays an error
• All sorting features properly work (sorting by section enrollment, name, ascending / descending, active / archived)
• Page navigation properly checks bounds and updates correctly on page refresh

Confirmation of Change

Since this PR includes a lot of functionality, I made a demo video to show the changes instead of spamming screenshots.

student-table-demo.mp4

[github-actions]

Visit the preview URL for this PR (updated for commit c0cb30c):

https://meemli-dev--pr41-student-staff-table-t3a5f06b.web.app

_{(expires Thu, 19 Mar 2026 03:05:46 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 633a893569aee98f762f025e27aa080a469727e1}