I'll start by reading all the files I need to modify in parallel.

The component already has all data-testid attributes and the playwright config already has the project registered. I just need to create the test file and update the window title per your request.

Let me check if there's already a test file.

The test file already exists with all the tests from the plan. I just need to update the window title as you requested.

Can you clarify which height issue you're referring to? Is it the desktop sidebar's h-[calc(100vh-8rem)] on the ChatUI (line 208 of instructor-chat.tsx), or something else?

Let me look at the page layout to understand the height calculation and content sections.

Good questions. Let me check how the page layout works — there's probably a nav header affecting the height calculation.

The header is h-14 (56px). Let me check if it's sticky/fixed and see the exact layout.

Now I have the full picture. The header is sticky top-0 with h-14 (56px), but the sidebar uses top-12 (48px) — so it's actually slightly overlapping the header. And the fixed h-[calc(100vh-8rem)] on ChatUI plus the title bar makes the sidebar column taller than the viewport, causing the slight scroll.

Let me fix both issues: the height calculation and add the dynamic placeholder.

Now I have the full picture. Here's what needs to happen:

1. Height fix: top-12 (48px) doesn't clear the h-14 (56px) header → change to top-16 (64px, giving 8px breathing room). Then set the bordered container to h-[calc(100vh-5.5rem)] with flex layout, so ChatUI fills remaining space.

2. Window title: "ask about the course" → "Understanding Understanding AI"

3. Dynamic placeholder: Use IntersectionObserver to watch h2 elements on the page and update the placeholder based on visible section.

Now update the input to use the placeholder prop:

Now fix the height, update the title, wire up the placeholder, and make the container use flex layout:

Now pass the placeholder to the mobile ChatUI too:

Let me verify the final state of the file:

Good, the component looks correct. Now let me also update the E2E test to verify the window title text since we changed it:

The tests look good as-is. Now let me check that the dev server is running and run the tests:

All 9 tests pass. Here's a summary of the changes:

apps/web/components/instructor-chat.tsx:

1. Height fix: Changed sticky top-12 → top-16 (properly clears the 56px header with 8px breathing room). Set the bordered container to h-[calc(100vh-5.5rem)] flex flex-col so it fills the viewport precisely, with ChatUI using min-h-0 flex-1 to fill remaining space.

2. Window title: Changed "ask about the course" → "Understanding Understanding AI"

3. Dynamic placeholder: Added useVisibleSection() hook that uses IntersectionObserver on the page's h2 elements. As you scroll through sections, the input placeholder updates contextually:

   • "Ask about conversational assessment..."
   • "Ask about in-class activities..."
   • "Ask about reading preparation..."
   • "Ask about AI in course operations..."
   • "Ask about course structure..."
   • "Ask about meetings..."

Two changes: fix the title text and fix the height. The root issue is that the sidebar's height plus the page padding (header 56px + py-12 top/bottom = 152px total overhead) exceeds 100vh. I'll add a negative bottom margin so the sidebar doesn't inflate the page height while keeping its full visual size.

Now let me verify the tests still pass:

All passing. Here's what changed:

1. Title: "Understanding Understanding AI" → "Understanding AI"
2. Height fix: Added lg:-mb-16 to the sidebar wrapper. This gives the grid item a negative bottom margin so the sidebar doesn't inflate the page height beyond the prose content, while keeping its full visual size (100vh - 5.5rem). The sidebar fills from top-16 (64px below viewport top) to 24px above the viewport bottom, with zero page scroll caused by the sidebar column.

I can see the input is getting clipped at the bottom. Let me increase the height deduction.

That changes the bottom edge from 24px to 64px (4rem) above the viewport bottom — should give comfortable clearance. Tests should still pass since they just check visibility.

All 9 tests pass. The sidebar height is now 100vh - 8rem — the bottom should sit 64px above the viewport edge, giving clear space for the input field and button.

I'll check the current git state and prepare to commit the changes.

The changes look good — no debug statements or logging. The diff shows:

1. Dynamic placeholder: Added useVisibleSection() hook with IntersectionObserver to update placeholder based on visible h2 sections
2. Fixed height: Changed top-12 → top-16, added lg:-mb-16, changed height to calc(100vh-8rem) with flex layout
3. Updated title: "ask about the course" → "Understanding AI"
4. Prettier formatting: Auto-formatted line breaks (this is expected)

This builds on top of the existing instructor chat E2E tests from commit 4262ce8. I'll commit these enhancements:

✓ Committed successfully! The working tree is clean.

Summary of changes:

• Dynamic placeholder that responds to scroll position (updates based on visible h2 sections)
• Fixed sidebar height calculation to prevent overflow
• Updated window title to "Understanding AI"
• All E2E tests passing (9/9)

I'll check the current git state.

The changes look clean — just a version bump from 2026.2.14 to 2026.2.15 across all package.json files. No debug statements or logging to remove. Following the date-based versioning scheme (same month, increment minor).

✓ Committed successfully! The working tree is clean.

Summary:

• Version bumped from 2026.2.14 → 2026.2.15 across all 23 package.json files
• Branch is 1 commit ahead of origin/main

Let me re-extract the name-to-UIN mapping from the MHTML, rename the files, and remove ROSTER.mhtml.

I have the full mapping. Let me rename all the files to UINs and remove the MHTML.

Done. Photos renamed to {uin}.jpg and ROSTER.mhtml removed. The data/spring2026/photos/ directory now has 12 files named by UIN.

Let me check a few more specifics.

Now let me check how the API serves photos — I'll need a photo-serving endpoint.

Good — the API already uses git-root-dir to locate the monorepo root. Now let me check the admin assessments page for the UI pattern since it's another instructor-only page.

I have everything I need. Let me write up the plan.

Good question. The /enrollment page already shows enrolled students. Let me check how it displays them.

The closest existing page is /enrollment — it already lists students with names, emails, badges, and a Canvas sync button. But it's a data management page (filters, status badges, sync controls). Adding a photo grid might clutter its purpose.

Good — new /roster page. The plan is already written. Let me update it to clarify the instructor-only photo access requirement.