Costume Fitting Scheduler

A browser-based planner that merges rehearsal schedules with student memberships to surface fitting windows. Upload CSV exports for rehearsals and casts, slice by studio/date/group, view a one-day timeline, and export or print day sheets. The app is a static React + Vite + TypeScript build so it can be hosted on GitHub Pages or any static host.

Getting Started

npm install
npm run dev

Open the printed URL (default http://localhost:5173) to use the app locally. Tailwind CSS utilities are loaded via the CDN-powered runtime build declared in index.html, so no extra tooling is required beyond the standard Vite setup.

CSV format

Two files are required:

1. events.csv
   • Columns: date, start_time, end_time, studio, labels
   • labels is a comma-separated list of groups/roles attending the event.
2. memberships.csv
   • Columns: student_id, student_name, memberships
   • memberships is a comma-separated list of groups the student belongs to.

Sample files live in public/samples. Download links are built into the app for quick reference.

Core workflow

1. Import events.csv and memberships.csv.
2. Choose a date (required) and optionally filter by studio, group, student, or minimum slot length.
3. Review:
   • Student availability – merged busy windows with free slots rendered as quick badges.
   • Group availability – “any member free” union and “all members free” intersection.
   • Visual day planner – a Microsoft Teams inspired single-day timeline for quick scanning.
   • Day sheet preview – formatted, print-friendly breakdown ready for fitting paperwork.
4. Export student free windows as CSV or print the day sheet.

Availability is calculated within the default fitting window of 09:00–17:00 Eastern. Adjust the minimum slot length to exclude short gaps.

Building for production

npm run build
npm run preview   # optional: serve the production bundle locally

Artifacts are written to dist/. Vite 7 requires Node.js >= 20.19.0; the CI workflow pins this version.

Tests

Lightweight behavioral tests cover the interval math and CSV import helpers. Run them from the command line:

npm test

The test script compiles TypeScript under tests/ to build-tests/ and executes the resulting Node.js program.

GitHub Pages deployment

The repository includes .github/workflows/deploy.yml, which builds, tests, and deploys the site to GitHub Pages on pushes to main. Update the trigger branch if you use a different default and ensure Pages is enabled in the repository settings.

For alternative static hosts, upload the dist/ directory and preserve index.html as the single-page entry point.

Project structure

src/
  components/ # visual timeline and future UI building blocks
  lib/        # CSV parsing, interval math, time helpers
  App.tsx     # main interface & state orchestration
  types.ts    # shared TypeScript types
public/samples/
  events.csv
  memberships.csv
tests/
  run-tests.ts # no-dependency test runner for core utilities

Future ideas

• Calendar-style visualization of free/busy blocks.
• LocalStorage persistence to avoid re-importing between sessions.
• Label aliasing to correct typos on upload.
• Drag-to-block tentative fitting requests.