Skip to content

Pages

Jump to bottom
Nishanth S edited this page May 8, 2026 · 34 revisions

Pages

Overview

This document describes the current page routes, behavior, and data flow in Teambuilder.

Primary routes are defined by files in pages, and sidebar navigation is configured in components/Navbar.vue.

Current primary nav links:

  • Projects
  • Partners
  • Students
  • Generate Teams
  • Teams
  • Demographics (newDemographics route)
  • S.C.I.P.E. Bot
  • GitHub Bot

Route Map

Home Page

File: pages/index.vue

Behavior:

  • Immediately redirects to the Projects page.
  • Uses a 301 redirect to /projects.

Students Page

File: pages/students.vue

Purpose:

  • Manage student roster, CSV import workflows, filtering, editing, deletion, and export.

Current behavior:

  • On mount, loads students and semesters from:
    • GET /api/students
    • GET /api/semesters
  • Displays a filterable DataTable with derived full name and day tabs:
    • All
    • Wednesday
    • Thursday
  • Supports row selection with a modal for details and editing.
  • Saves edits via PUT to student endpoint by id.
  • Supports single student delete and bulk clear of all students.
  • Supports CSV export of visible students.

Upload flows:

  • Merge upload
    • POST /api/students with transformed CSV rows
  • Replace upload
    • DELETE /api/students (optionally by meeting day), then POST /api/students
  • Bid response CSV upload path
    • Detects bid response columns and posts to POST /api/bids
  • Supports day-forced uploads (Wednesday or Thursday variants).

Additional controls:

  • Download template CSV
  • Clear students
  • Clear entire database button path exists in page logic and calls POST /api/database/reset

Projects Page

File: pages/projects.vue

Purpose:

  • Manage project list, project metadata, semester views, meeting-day filtering, bulk updates, CSV import/replace, and deletion.

Current behavior:

  • On mount, loads:
    • GET /api/projects
    • GET /api/semesters
  • Supports view by semester and day tab filtering.
  • DataTable filters for name, partner, meeting day, status, and type.
  • Row click opens project detail modal.
  • Edit modal saves via PUT to project endpoint by id.

Bulk actions:

  • Multi-select projects in table.
  • Bulk assign meeting day via multiple PUT calls.
  • Bulk assign project type via multiple PUT calls.

Upload flows:

  • Merge upload
    • POST /api/projects with mapped CSV data and semester context
  • Replace upload
    • Full replace path: DELETE /api/projects, then POST /api/projects
    • Day-specific replace path handles BOTH-day downgrades and selective deletes before POST
  • Wednesday/Thursday forced upload variants are supported.

Other controls:

  • Delete single project
  • Clear entire database (POST /api/database/reset)
  • Download project template CSV

Partners Page

File: pages/partners.vue

Purpose:

  • Manage partner organizations and contact info.

Current behavior:

  • On mount, loads:
    • GET /api/partners
    • GET /api/semesters
  • Displays filterable table with partner name, contact, and linked project names.
  • Row selection opens modal for edit.
  • Saves edits via PUT to partner endpoint by id.
  • Supports delete of single partner.

Upload flows:

  • Merge upload
    • POST /api/partners
  • Replace upload
    • DELETE /api/partners, then POST /api/partners

Other controls:

  • Download partner template CSV
  • Clear entire database (POST /api/database/reset)

Generate Teams Page

File: pages/generate-teams.vue

Purpose:

  • Three-step workflow to create semester, activate projects, and generate teams.

Current behavior:

Step 1: New semester

  • Creates semester with POST /api/semesters.

Step 2: Activate projects for semester

  • Uses pick-list inactive/active model.
  • Activates selected projects by creating teams:
    • POST /api/teams
  • Deactivates selected projects:
    • DELETE /api/teams

Step 3: Generate teams

  • Configurable algorithm options (min/max team size, returning-student priority, 3200 priority, diversity and matching toggles).
  • Generates per day:
    • POST /api/teams/generate with semesterId, day, and config
  • Stores generated payload in local storage for Teams page continuity.
  • Navigates to /teams after generation.

Validation warnings shown before generation:

  • Projects missing partner assignment.
  • Students with no valid project choices for selected day.

Teams Page

File: pages/teams.vue

Purpose:

  • Display and manage team assignments by semester/day, export CSV, and manual member adjustments.

Current behavior:

  • Loads semesters via GET /api/semesters.
  • On semester change, loads assignments from:
    • GET /api/teams?semesterId=...
  • Builds table rows from assignment map plus team metadata.
  • Supports day tabs (All, Wednesday, Thursday).
  • Shows assignment metrics overlay (top-choice percentages, under-min teams, etc.).

Editing behavior:

  • Team modal supports member move between teams and member removal.
  • Persists changes with POST /api/teams/assign.

CSV behavior:

  • Export teams via POST /api/teams/export.
  • Replace teams from CSV path:
    • If no teams exist, bootstraps teams from CSV project names via POST /api/teams.
    • Replaces assignments after parsing and resolving students/projects.

Demographics Page

File: pages/newDemographics.vue

Purpose:

  • Componentized demographics dashboard prototype using composables and chart wrapper components.

Current behavior:

  • Uses composables from demo-composables for filters, time period, upload, and chart rendering.
  • Calls GET /api/demographic with query params built from sidebar selections.
  • Renders chart via demo chart component and local chart composable.
  • Sidebar interaction and chart update are functional, but this remains a demo-oriented implementation.

S.C.I.P.E. Page

File: pages/SCIPE.vue

Purpose:

  • Discord bot operations panel for team infrastructure management.

Current behavior:

  • Bot and channel operations:
    • POST /api/discord/update-channels
    • POST /api/discord/delete-channels
  • Role operations:
    • POST /api/discord/assign-project-roles
    • POST /api/discord/delete-roles
  • Diagnostics:
    • GET /api/discord/diagnostics
  • Semester list for role assignment scope:
    • GET /api/semesters
  • Shows detailed success/error output blocks and diagnostics summaries.

GitHub Page

File: pages/github.vue

Purpose:

  • GitHub integration management for repo creation/sync by semester.

Current behavior:

  • Connection status and session controls:
    • GET /api/github/status
    • POST /api/github/connect
    • POST /api/github/disconnect
  • Semester/project selection:
    • GET /api/semesters
    • GET /api/teams?semesterId=... (to derive team/project options)
  • Create or sync repositories:
    • POST /api/github/create-repos with semesterId and optional projectIds
  • Displays per-team operation results including links and errors.

Navigation Notes

Navigation component:

Current navigation behavior:

  • Sidebar is collapsible on mobile and static on larger viewports.
  • Active-route highlighting is implemented.
  • Logo links are external images in sidebar; route links are text menu items.

Known Gaps and Legacy Notes

  • Several pages still include direct alert/confirm flows and local console logging patterns.
  • Generate Teams workflow depends on semester activation state and valid student choices.
  • Team editing and CSV replacement logic is complex and should be regression-tested when refactoring.

Related Documentation

Wiki

Website Functionality

Demographics Workflows

Project Plans

Resources

Clone this wiki locally