feat(ui): add shift management UI with list, detail, and sign-up

Implements Task 20: Shift Sign-Up UI - List + Detail + Create Pages

New components:
- useShifts hook: TanStack Query hooks (useShifts, useShift, useCreateShift, useSignUpShift, useCancelSignUp)
- Shift list page: Card-based UI (NOT table) with capacity bars and Past badges
- Shift detail page: Full info with sign-up/cancel buttons, member list
- New shift form: Create shifts with title, description, location, times, capacity
- ShiftCard component: Reusable card with capacity Progress bar

Key features:
- Card-based UI pattern (shadcn Card, NOT Table - more visual for schedules)
- Capacity calculation: (currentSignups / capacity) * 100 for Progress bar
- Past shift detection: new Date(startTime) < new Date() → shows 'Past' badge
- Sign-up button visibility: !isPast && !isFull && !isSignedUp
- Cancel button visibility: !isPast && isSignedUp
- Role-based 'New Shift' button: Manager/Admin only
- TanStack Query with automatic cache invalidation on mutations
- Navigation includes Shifts link in sidebar

New shadcn components:
- Progress: Radix UI progress bar with transform-based fill
- Textarea: Styled textarea for shift descriptions

TDD:
- 3 shift card tests (capacity display, full capacity, past shifts)
- 3 shift detail tests (sign-up button, cancel button, mutation calls)

All tests pass (37/37: 31 existing + 6 new). Build succeeds.

.sisyphus/notepads/club-work-manager/learnings.md

@@ -1561,3 +1561,14 @@ frontend/
 - **UI Component Usage**: Leveraged shadcn `Table` for the list and `Card` for details and new task forms, alongside raw inputs for simplified creation without needing heavy forms libraries.
 
 
+
+
+## Task 20: Shift Sign-Up UI (2026-03-03)
+
+### Key Learnings
+
+- Card-based UI pattern for shifts: Used shadcn Card component instead of tables for a more visual schedule representation
+- Capacity calculation and Progress component: Calculated percentage and used shadcn Progress bar to visually indicate filled spots
+- Past shift detection and button visibility: Checked if shift startTime is in the past to conditionally show 'Past' badge and hide sign-up buttons
+- Sign-up/cancel mutation patterns: Added mutations using useSignUpShift and useCancelSignUp hooks that invalidate the 'shifts' query on success
+- Tests: Vitest tests need to wrap Suspense inside act when dealing with asynchronous loading in Next.js 15+

.sisyphus/plans/club-work-manager.md

@@ -1854,7 +1854,7 @@ Max Concurrent: 6 (Wave 1)
   - Files: `frontend/src/app/(protected)/tasks/**/*.tsx`, `frontend/src/hooks/useTasks.ts`
   - Pre-commit: `bun run build && bun run test`
 
-- [ ] 20. Shift List + Shift Detail + Sign-Up UI
+- [x] 20. Shift List + Shift Detail + Sign-Up UI
 
   **What to do**:
   - Create `/frontend/src/app/(protected)/shifts/page.tsx`: