Roles, Permissions, and Application Review

January 19, 202611:58 AM – 3:00 PM(3h 2m)37 turns

Model: claude-opus-4-5-20251101

Read56Bash53Edit39TodoWrite14Write11Glob9ExitPlanMode6AskUserQuestion3Task1

11:58 AM

Implement the following plan:

Roles, Permissions, and Application Review

Implement a role-based access system and application review functionality.

Requirements

Roles: student, staff, instructor (change from current student, instructor, admin)
Admin privilege: Separate isAdmin boolean for elevated actions (impersonation, etc.)
Role assignment: Configured in per-semester config file (instructors/staff arrays)
Auto-assignment: On login, check email against config and assign role
Application review: Instructors/staff can view all applications and make decisions
Decision statuses: pending, admitted, waitlisted, rejected

Database Changes

1. Update `packages/db/src/schema/users.ts`

// Change enum values
export const userRoleEnum = pgEnum("user_role", ["student", "staff", "instructor"]);

// Add isAdmin column to users table
isAdmin: boolean("is_admin").notNull().default(false),

Migration needed: Rename admin → instructor in existing data, add isAdmin column.

2. Update `packages/db/src/schema/applications.ts`

export const applicationStatusEnum = pgEnum("application_status", [
  "pending",
  "admitted",
  "waitlisted",
  "rejected",
]);

// Add to applications table:
status: applicationStatusEnum("status").notNull().default("pending"),
decidedAt: timestamp("decided_at", { mode: "date" }),
decidedBy: text("decided_by").references(() => users.id),

Config Changes

3. Update `packages/types/src/content.ts`

Add staff array to CourseConfig:

export interface CourseConfig {
  // ... existing fields
  instructors: Instructor[];
  staff?: StaffMember[];  // NEW
}

export interface StaffMember {
  name: string;
  email: string;
  isAdmin?: boolean;  // Grant admin privileges
}

4. Update `content/spring2026/config.ts`

instructors: [
  {
    name: "Geoffrey Challen",
    email: "[email]",
  },
],
staff: [],  // Add when needed

Role Assignment Logic

5. Create `packages/auth/src/role-assignment.ts`

export function determineRole(email: string, config: CourseConfig): {
  role: "student" | "staff" | "instructor";
  isAdmin: boolean;
} {
  // Check if instructor
  const instructor = config.instructors.find(i => i.email === email);
  if (instructor) {
    return { role: "instructor", isAdmin: true };  // Instructors always admin
  }

  // Check if staff
  const staff = config.staff?.find(s => s.email === email);
  if (staff) {
    return { role: "staff", isAdmin: staff.isAdmin ?? false };
  }

  // Default to student
  return { role: "student", isAdmin: false };
}

6. Update auth flow to assign roles

In packages/auth/src/config.ts or API middleware, on user creation/login:

Look up email in course config
Update user's role and isAdmin accordingly

API Routes

7. Create `apps/api/src/routes/admin/applications.ts`

// GET /api/admin/applications - List all applications for current semester
// Requires: instructor or staff role

// PUT /api/admin/applications/:id/status - Update application status
// Body: { status: "admitted" | "waitlisted" | "rejected" }
// Requires: instructor or staff role

8. Update `apps/api/src/middleware/auth.ts`

Add requireAdmin() middleware for admin-only routes.

Frontend

9. Create `apps/web/app/review/page.tsx`

Application review page for instructors/staff:

List all applications for current semester
Filter by status (pending, admitted, waitlisted, rejected)
Click to view full application
Buttons to admit/waitlist/reject

10. Update `apps/web/app/apply/page.tsx`

If user is instructor/staff → redirect to /review
If user is student → show application form (existing behavior)

Files to Modify/Create

File	Action
`packages/db/src/schema/users.ts`	Modify enum, add isAdmin
`packages/db/src/schema/applications.ts`	Add status, decidedAt, decidedBy
`packages/types/src/content.ts`	Add StaffMember interface
`packages/types/src/user.ts`	Update UserRole type
`content/spring2026/config.ts`	Add staff array
`packages/auth/src/role-assignment.ts`	NEW - role determination logic
`packages/auth/src/config.ts`	Hook role assignment
`apps/api/src/routes/admin/applications.ts`	NEW - admin review endpoints
`apps/api/src/middleware/auth.ts`	Add requireAdmin middleware
`apps/web/app/review/page.tsx`	NEW - review interface
`apps/web/app/apply/page.tsx`	Add role-based redirect

Implementation Order

Database schema changes + migration
Update types (UserRole, CourseConfig)
Add role assignment logic
Hook role assignment into auth flow
Create admin API routes
Create review UI
Update /apply page with role check
Test full flow

Verification

bun run tsc - Type check
bun run lint - Lint check
bun run db:push - Apply schema changes
Login as [email] → should be instructor + admin
Visit /apply as instructor → redirect to /review
Visit /review → see list of applications
Change application status → verify it updates
Login as student → can submit application, cannot access /review

If you need specific details from before exiting plan mode (like exact code snippets, error messages, or content you generated), read the full transcript at: ~/.claude/projects/-Users-challen-www-usingandunderstanding-ai/58a85576-4750-48ef-a928-4ae489d30949.jsonl

I'll implement the roles, permissions, and application review system. Let me start by creating a todo list and reading the current files.

Let me also read the auth config and API middleware to understand the current auth flow.

Let me also check the auth package structure and the API routes index.

Now I have a complete picture. Let me start implementing the changes.

First, let me update the auth config to include the isAdmin field.

Now let me update the auth middleware to include isAdmin and handle role verification.

Let me check if the content loader has the getSemesterConfig function.

I need to create a loader.ts file in the content folder to load semester configs dynamically.

I need to fix the auth middleware to construct the semester ID correctly.

Now let me create the admin applications API routes.

Now let me register the admin route in the main API index.

Let me fix the type error in the e2e.ts file.

Type checking passed. Now let me run lint.

Let me fix the unused import.

All implementation tasks are complete. Here's a summary of what was implemented:

Summary of Changes

Database Schema Changes

packages/db/src/schema/users.ts - Updated role enum from ["student", "instructor", "admin"] to ["student", "staff", "instructor"] and added isAdmin boolean column
packages/db/src/schema/applications.ts - Added applicationStatusEnum with values ["pending", "admitted", "waitlisted", "rejected"], plus status, decidedAt, and decidedBy columns

Type Changes

packages/types/src/content.ts - Added StaffMember interface and staff optional array to CourseConfig
packages/types/src/user.ts - Updated UserRole type and added isAdmin to User interface

Course Config

content/spring2026/config.ts - Added staff: [] array

Role Assignment

packages/auth/src/role-assignment.ts (NEW) - Created determineRole() function that assigns roles based on email matching in course config
packages/auth/src/config.ts - Added isAdmin to Better Auth's additionalFields
packages/auth/src/index.ts - Exported new role assignment function

Content Loader

content/loader.ts (NEW) - Created config loader to dynamically load semester configs

API Changes

apps/api/src/middleware/auth.ts - Updated AuthUser interface with new roles and isAdmin, added syncUserRole() to sync roles on each request, added requireAdmin middleware
apps/api/src/routes/admin/applications.ts (NEW) - Created admin endpoints for listing and updating application statuses
apps/api/src/routes/e2e.ts - Updated to use new role values
apps/api/src/index.ts - Registered new admin routes

Frontend Changes

apps/web/app/review/page.tsx (NEW) - Application review page for instructors/staff with filtering and status update functionality
apps/web/app/apply/page.tsx - Added redirect to /review for instructors/staff

Next Steps

Before testing, you'll need to run bun run db:push to apply the schema changes to the database.

Edit25Read19TodoWrite14Glob7Bash7Write4

12:09 PM

Please push the schema changes to the local database and then run the tests.

Schema pushed successfully. Now running the e2e tests.

All 22 tests passed. The schema changes have been applied and the implementation is working correctly.

Bash2

12:18 PM

Your task

First, run git status, git diff, and git log --oneline -10 to understand the current state.

Then add and commit all modified files with a descriptive message. Break the changes into multiple commits if appropriate. If there are untracked files, ask if they should be added or added to the appropriate .gitignore file. The user may also want to take over at this point, so provide an abort option as well. Always check changes for unnecessary debugging statements or logging that might have been accidentally included. Prompt the user if you find any, and offer to remove each one by one. Do not use interactive git staging (git add -p) as it does not work.

<thinking> Let me check the full diff to look for any debugging statements or unnecessary logging. </thinking> <thinking> Let me also check the new untracked files for any debugging statements. </thinking>

I reviewed all the changes. There are a couple of console.error statements in the auth middleware that are appropriate error logging (not debug logging):

console.error("[auth] AUTH_SECRET not configured") - Important config error
console.error("[auth] Token verification failed:", error) - Auth failure logging
console.error("[auth] Failed to sync user role:", error) - Role sync failure logging

These are legitimate error logging, not debug statements. The code looks clean.

Here's a summary of the changes. There are 4 untracked files that are new:

apps/api/src/routes/admin/applications.ts - Admin API routes for application review
apps/web/app/review/page.tsx - Application review UI page
content/loader.ts - Dynamic semester config loader
packages/auth/src/role-assignment.ts - Role determination logic

Committed successfully:

e83c279 Add role-based access control and application review system

15 files changed, 700 insertions(+), 6 deletions(-). Your branch is 1 commit ahead of origin/main.

Bash7Read4AskUserQuestion1

1:42 PM

Can we load in all existing applications to the local database and mark them as approved so I can check the UI?

Let me check for existing application data in the data directory.

I can see the student application data. Let me create a script to load these into the database and mark them as admitted.

Glob2Read1

1:43 PM

Actually, one of the next steps will be to do roster integration using Canvas. At this point students have several states they pass through. First accepted (application reviewed) and then enrolled based on the Canvas API enrollment. Just something to keep in mind. Mark these as accepted for now and then later we'll mark some as enrolled.

Got it - so the full flow will be:

pending → application submitted
admitted → application reviewed and accepted (what we're doing now)
enrolled → confirmed via Canvas API integration (future)

I'll need to add "enrolled" to the status enum later for Canvas integration. For now, let me load these applications as "admitted".

Done! Loaded 24 applications into the database, all marked as "admitted". You can now start the dev server (bun run dev) and visit /review to see the application review UI with all the data.

Note for future Canvas integration: We'll need to add an "enrolled" status to the applicationStatusEnum in packages/db/src/schema/applications.ts to track the flow: pending → admitted → enrolled.

Bash3Write2

1:45 PM

Your task

First, run git status, git diff, and git log --oneline -10 to understand the current state.

<thinking> It looks like I'm in the wrong directory - the git status is showing from the tools/student-selection directory context since that's where I ran the last command. Let me change back to the root and check the status. </thinking>

The code looks clean - the console.log statements are appropriate progress output for a CLI tool, not debugging statements.

There's 1 untracked file: tools/student-selection/src/load-applications.ts - a utility script to load applications from YAML into the database.

Committed:

0f77e1b Add script to load applications from YAML into database

Your branch is now 1 commit ahead of origin/main (note: the previous role-based access commit was already pushed or you're now 2 ahead if it wasn't).

Bash6Read1AskUserQuestion1

1:55 PM

Cool! Now we need some art for this course. I know that you may not be able to help with that directly, but I'm hoping you can point me to resources. First is a logo and specifically a favicon, so it needs to be small. A theme I like for this course is the blending of human and machine, and one image I used for flyers was a face with the left half human and right half cyborg.

This is a different task from the previous plan (which was for the role-based access system we already implemented). Let me update the plan file with resources and recommendations for your course artwork.

I've put together a resource guide. A few thoughts:

For the favicon specifically: The half-face concept is visually striking but may lose detail at 16x16 pixels. A single eye with the human/circuit split, or an abstract symbol, might work better at small sizes.
Midjourney tends to produce the most artistic results for this kind of imagery, but DALL-E 3 is convenient if you already have ChatGPT Plus.
Once you have artwork, I can help you set up the favicon files in the Next.js app correctly.

Read1Write1ExitPlanMode1

1:58 PM

Can't we write our own tool to convert the favicon? Using an external service seems silly.

Good point - we can write a simple script using sharp (which is already commonly used in Node/Bun projects) to generate all the favicon sizes from a source image. Let me update the plan.

Updated the plan to include a custom favicon generation script using sharp. The script will:

Take a source image as input
Generate all the required sizes (32px favicon, 180px Apple icon, 192px and 512px for PWA/Android)
Output directly to apps/web/app/

Edit1ExitPlanMode1

2:01 PM

Where should I put the big logo for review?

Good question. A few options:

assets/logo/ (project root) - For source artwork files that aren't directly served
apps/web/public/ - If you want it accessible via URL for review
tools/favicon/ - Keep it with the generation script

I'd suggest assets/logo/ at the project root - keeps source artwork separate from generated/served files. Let me update the plan:

Put your source logo at assets/logo/logo-source.png. This keeps source artwork separate from the generated/served files.

Edit1ExitPlanMode1

2:02 PM

So wait, assets in the root directory? Please create the assets logo directory where you think it should live.

I'm currently in plan mode (read-only). Let me exit so I can create the directory.

ExitPlanMode1

2:03 PM

Sorry. I still don't see an assets/logo directory.

Done. Created assets/logo/ at the project root. You can now save your logo there (e.g., assets/logo/logo-source.png).

Bash2

2:03 PM

OK. Take a look and see what you think.

This looks great! The illustration style works well for a logo - clean lines, recognizable silhouette, and the human/machine theme comes through clearly. The grayscale palette and transparent background are good for versatility.

For the favicon: At 16x16 or 32x32 pixels, the intricate mechanical details on the right side will become muddy, but the overall face silhouette and the split down the middle should still be recognizable. The contrast between the smooth human side and textured robot side will help.

A few options to consider:

Use as-is - The silhouette alone may work at small sizes
Crop tighter - Focus on just the eyes/center of the face for more detail at small sizes
Create a simplified version - A more abstract/geometric version specifically for the favicon

Want me to create the favicon generation tool and see how it looks at the various sizes? Then you can decide if it needs a simplified version.

Bash1Read1

2:05 PM

Yes, let's create the tool. I'm trying to get a simplified version.

Generated! Let me show you how it looks at the small favicon size (32x32):

At 32x32, the face silhouette is recognizable but the human/machine split detail is lost. Here's how it looks at 180x180 (Apple icon size):

This version has cleaner, bolder shapes on the mechanical side - should scale down better. Let me regenerate:

At 32x32 it's still quite small. Here's the 180x180 for comparison:

The simplified version reads better - the human/machine split is clearer at 180x180 with the bolder mechanical shapes. At 32x32 you can still make out it's a face, though the split detail is subtle.

Want to try it in the browser to see how it looks in the tab? You can start the dev server with bun run dev and check the favicon. Or if you have an even more simplified version to try, drop it in and I'll regenerate.

Bash6Read5Write2

2:07 PM

Yeah, it's muddy. Any ideas for something that would work better but send the same message?

A few ideas that would read better at tiny sizes:

Single eye - Half human iris, half mechanical/glowing. Eyes are recognizable even at 16px.
Split circle - Left half smooth/organic gradient, right half circuit pattern or pixels. Simple but symbolic.
Stylized "UAI" - The letters themselves, with the "A" split or transitioning from organic to digital styling.
Profile silhouette - Just the outline of a head in profile with a clean vertical split - smooth curve vs. angular/geometric. Much simpler than a full face.
Yin-yang variation - Two interlocking shapes, one curved/organic, one angular/geometric.
Abstract symbol - Something like two overlapping shapes (circle + hexagon) that suggests the blend without being literal.

For a 32x32 favicon, high contrast and simple shapes are key. The single eye or the profile silhouette would probably translate the theme best while remaining readable.

Want me to suggest some prompts you could try in your image generator for any of these directions?

2:08 PM

How about something with a fade into binary somehow?

That could work well - binary digits (0s and 1s) are simple, high-contrast shapes that stay readable at small sizes.

Some variations on the concept:

Face/profile dissolving into binary - Silhouette on one side that breaks apart into 0s and 1s streaming off
"UAI" with binary fade - The letters transitioning into or surrounded by binary streams
Circle/head shape - Solid on one side, dissolving into binary digits on the other
Binary rain - Matrix-style, but with a human element emerging from or dissolving into it

Prompt ideas to try:

minimalist logo, human face silhouette profile dissolving into binary 
code 0s and 1s, left side solid black, right side fading into scattered 
binary digits, simple clean design, white background, suitable for icon

simple logo, the letters UAI with binary code streaming upward from them,
minimalist black and white design, clean lines, icon suitable

abstract logo, solid circle on left transitioning to binary digits 
dispersing on right, minimalist, two-tone black white, favicon suitable

The key is asking for "minimalist", "simple", "clean lines", and "icon suitable" to keep it from getting too detailed. Want to try one of these directions?

2:12 PM

What do you think about now?

This is much better for a favicon - high contrast black/white, bold silhouette, clean concept. Let me regenerate and see how it scales:

Much better! The silhouette reads clearly at 32x32 and you can see the dissolving effect. Here's 180x180:

This works well - the concept reads clearly at every size. The high contrast and bold silhouette make it recognizable even in a browser tab. The binary dissolve captures the human-machine theme without being too literal.

Want to spin up the dev server and see it live in the browser?

Read3Bash2

2:13 PM

Yeah, favicons are still just so small.

Yeah, 32x32 pixels is brutal. At that size you really only get a recognizable shape and a general impression.

A few options:

Accept it - The current one reads as "head dissolving into something" which gets the idea across. Most people won't scrutinize their browser tab.
Even simpler for favicon only - Just the solid head silhouette for the favicon, save the binary effect for larger sizes (apple-icon, og-image, etc.)
Go abstract - A simple geometric symbol that suggests the theme (split circle, etc.) but doesn't try to be representational at tiny sizes.

The current version is honestly pretty good for what favicons are. The silhouette is clear, and there's visual interest on the right side even if you can't read the binary digits.

Want to see it in the actual browser tab to judge? Or try a super-minimal version?

2:14 PM

Try this one.

Front-facing with the binary forming the features - nice. Let me see how it scales:

The split reads more clearly with the front-facing view - you can see the solid half vs. the textured half even at 32x32. Here's 180x180:

This one works better - the front-facing symmetry makes the split obvious even at tiny sizes, and the eye on the binary side adds a focal point. The human-machine concept comes through clearly at all sizes.

Read3Bash1

2:18 PM

OK. Latest version. However, at this point I think I'd only want to use this for the smallest favicon, and probably use a larger and different logo in other places.

Nice - cleaner lines and the facial features are more defined. Let me see how it looks small:

That works well at 32x32 - the split is clear and it reads as a face.

For using different logos at different sizes, how about this structure:

assets/logo/
├── logo-favicon.png    # Simplified version for small sizes
└── logo-full.png       # Detailed version for larger uses

I can update the generate script to use logo-favicon.png for the small icons (favicon.ico, icon.png) and logo-full.png for the larger ones (apple-icon, icon-192, icon-512). Want me to set that up?

Read2Bash1

2:19 PM

Done. Take a look at both.

Nice pairing - the simplified binary face for small sizes, and the detailed cyborg for larger contexts. Let me update the generate script to use both:

Now using both sources. Here's the 32x32 favicon (from simplified):

And here's the 180x180 apple-icon (from detailed):

The setup is complete:

Small icons (32x32): Simplified binary face
Large icons (180+): Detailed cyborg face

Run bun run generate from tools/favicon whenever you update the source images. Want to test it in the browser?

Read4Bash3Edit1

2:22 PM

Did that. How do I see the larger icon though? Is that used anywhere? No is an OK answer.

Not really, during normal browsing. The larger icons are used for:

apple-icon.png (180x180) - When someone adds the site to their iPhone/iPad home screen
icon-192/512.png - Android home screen, PWA install prompts

You'd only see them if you "Add to Home Screen" on a mobile device or install as a PWA. For day-to-day development, you'll just see the 32x32 favicon in the browser tab.

2:22 PM

Although we could put it on the homepage.

True - that would give the detailed logo some visibility and add branding to the site. Want me to check out the current homepage and see where it might fit?

2:23 PM

Sure. I'd suggest at the top, followed by the title, and move the subtitle to below the title.

Done. Added the logo (120x120) at the top, followed by the title, with the subtitle now below. Check the homepage - it should show the detailed cyborg face logo above "Using and Understanding AI".

Edit2Read1

2:23 PM

Link is broken.

The favicon files are in app/ which Next.js handles specially for favicons, but not for regular <Image> src. Let me fix that by importing it directly:

Fixed - now importing the image directly. Should work now.

Edit2

2:24 PM

OK. Too much space above. Also it looks like this has some background left on it? Can we remove that somehow?

Reduced the top padding. Let me check the logo for background issues:

I see some semi-transparent gray areas in the background. I can add trimming to the generate script to clean that up:

Edit1Read1

2:26 PM

Can you remove it from the original image somehow?

Write1Bash1Read1

2:29 PM

Wait. I just added a new version that uses a blue background which should be easier to trim.

I see the file was updated but it still shows transparency. Did you want me to wait for the blue background version, or is there a different file I should look at?

Bash1Read1

2:32 PM

Try it now.

Now I can work with that. Let me update the script to remove the blue:

Clean background removal and trimmed. Let me replace the original and regenerate:

Clean transparent background now. Check the homepage - it should look much better.

Read3Bash2Edit1

2:41 PM

The problem is that the top of the head is cut off. Any ideas about how to address this?

2:41 PM

Oh wait, I got it!

Let me see what you've got:

2:42 PM

Take a look. It looks smaller but it's not cut off.

Full head now with padding. Let me remove the blue background and regenerate:

Full head, clean background. Check the homepage - should look good now.

Read2Bash1

2:43 PM

Let's reduce the time between quotes disappearing and appearing. Also scoot the image up just a bit more.

2:43 PM

Actually, nevermind. Just reduce the time between quotes. The image is good.

Done - reduced pause from 1-3 seconds to 0.5-1.5 seconds. Quotes should transition more quickly now.

Read1Edit1

2:44 PM

Your task

First, run git status, git diff, and git log --oneline -10 to understand the current state.

<thinking> Let me check the code changes for any debugging statements, then list what we have:

Modified files:

apps/web/app/page.tsx - Added logo to homepage
apps/web/components/floating-quotes.tsx - Reduced quote transition timing
bun.lock - Updated dependencies (sharp)

Untracked files:

apps/web/app/apple-icon.png - Generated favicon
apps/web/app/favicon.ico - Generated favicon
apps/web/app/icon-192.png - Generated favicon
apps/web/app/icon-512.png - Generated favicon
apps/web/app/icon.png - Generated favicon
assets/ - Logo source files
tools/favicon/ - Favicon generation tool

Let me check the code for any debugging statements. </thinking>

<thinking> The code changes look clean - no debugging statements or console.logs. Let me also check the tools/favicon code to make sure there are no debug statements. </thinking>

The code looks clean - no debugging statements. Here's a summary of changes:

Modified files:

apps/web/app/page.tsx - Added logo to homepage, reordered title/subtitle
apps/web/components/floating-quotes.tsx - Reduced pause between quotes (1-3s → 0.5-1.5s)
bun.lock - Updated for sharp dependency

New untracked files:

apps/web/app/*.png, favicon.ico - Generated favicon files
assets/logo/ - Source logo files (logo-favicon.png, logo-full.png)
tools/favicon/ - Favicon generation tool with sharp

Committed:

21a3649 Add course logo and favicon generation tool

13 files changed, 225 insertions(+), 28 deletions(-). Your branch is 2 commits ahead of origin/main.

Bash7AskUserQuestion1

2:48 PM

Another feature that we need is the ability for those with admin privileges to impersonate other site users. Develop a plan for doing this. It must work both in development and in production. When impersonating, the impersonator should retain their privilege level but actions taken should appear to be on behalf of the user being impersonated.

This is a completely different task. Let me explore the auth system and API middleware to understand how to implement impersonation.

Excellent exploration. I now have a clear picture of the auth system. Let me write the impersonation plan.

The plan covers:

Signed cookie for impersonation state (same AUTH_SECRET as sessions)
Auth middleware modification to swap user identity while retaining admin privileges
API endpoints to start/stop/check impersonation
Frontend banner showing who you're impersonating with stop button
Impersonate button in the review page per application

Key security aspects:

Impersonation token is signed and verified
Admin's JWT must be valid AND they must be marked as admin
Token's adminUserId must match the JWT user (can't forge someone else's impersonation)
Audit trail preserved via realUser field

Read1Task1Write1ExitPlanMode1

2:52 PM

Ah, sorry. Complication. It is helpful if impersonation works on a per-tab basis, which usually makes it incompatible with cookies, and instead something that has to be done at the level of the individual fetch requests. Sorry!

Good point! Cookies are shared across all tabs. For per-tab impersonation, we need to use a header-based approach instead.

2:52 PM

Also this is not just a review page feature: it's something I use to be able to see the entire site from a student perspective.

Got it - two important clarifications:

Per-tab: Use headers instead of cookies, store state in sessionStorage/React context
Site-wide: Not just review page - need global UI to start/stop impersonation from anywhere

Let me update the plan:

Updated plan for per-tab, header-based impersonation. Key changes:

sessionStorage instead of cookies (per-tab isolation)
X-Impersonate-User header sent with all API requests via apiFetch wrapper
ImpersonationProvider context manages state site-wide
User picker accessible from anywhere (likely in header/menu)
Amber banner at top when impersonating with stop button

Edit4ExitPlanMode1

Roles, Permissions, and Application Review

Requirements

Database Changes

1. Update packages/db/src/schema/users.ts

2. Update packages/db/src/schema/applications.ts

Config Changes

3. Update packages/types/src/content.ts

4. Update content/spring2026/config.ts

Role Assignment Logic

5. Create packages/auth/src/role-assignment.ts

6. Update auth flow to assign roles

API Routes

7. Create apps/api/src/routes/admin/applications.ts

8. Update apps/api/src/middleware/auth.ts

Frontend

9. Create apps/web/app/review/page.tsx

10. Update apps/web/app/apply/page.tsx

Files to Modify/Create

Implementation Order

Verification

Summary of Changes

Database Schema Changes

Type Changes

Course Config

Role Assignment

Content Loader

API Changes

Frontend Changes

Next Steps

Your task

Your task

Your task

1. Update `packages/db/src/schema/users.ts`

2. Update `packages/db/src/schema/applications.ts`

3. Update `packages/types/src/content.ts`

4. Update `content/spring2026/config.ts`

5. Create `packages/auth/src/role-assignment.ts`

7. Create `apps/api/src/routes/admin/applications.ts`

8. Update `apps/api/src/middleware/auth.ts`

9. Create `apps/web/app/review/page.tsx`

10. Update `apps/web/app/apply/page.tsx`