Michael Chihlas
cbb4b25671
CI surfaced react-hooks/set-state-in-effect on the synchronous setState(computeState(token)) inside the useEffect body. The earlier shape mirrored token -> state via an effect, which is exactly the "you might not need an effect" pattern React 19's eslint rule now flags. Switch to derived state: compute during render, use a useReducer tick to force re-render on the 30s cadence (so relative timestamps stay current even when token props don't change). Same observable behavior, no cascading renders. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2.4 KiB
Session Closure from History Page — Design
Date: 2026-03-11
Problem
Active sessions on the Session History page only have "View Details" and "Resume" buttons. Engineers have no way to close out sessions that were abandoned, resolved externally, or otherwise no longer needed — without resuming the entire flow.
Design Decisions
- Outcome model: Hybrid — reuse existing 4 outcomes (resolved, escalated, workaround, unresolved) + add 2 early-closure outcomes (cancelled, resolved_externally)
- UX: Inline popover anchored to a "Close" button on the session card — no modal, no slide panel
- Scope: Active sessions only (started but not completed). No bulk close. No AI summary generation.
- Backend: No new endpoints or migrations. Expand
SessionOutcomeliteral type; existingPOST /sessions/{id}/completehandles everything.
Data Model
No new columns. Expand SessionOutcome in backend/app/schemas/session.py:
SessionOutcome = Literal["resolved", "escalated", "workaround", "unresolved", "cancelled", "resolved_externally"]
VARCHAR(20) on session.outcome fits both new values (max 19 chars for resolved_externally).
UI
Close Button
Appears on active session cards (started_at is set, completed_at is null), between "View Details" and "Resume":
[View Details] [Close] [Resume]
Secondary button styling (border, muted text). Not shown on prepared or completed sessions.
Close Popover
Anchored below the "Close" button:
- Outcome selector:
<select>with 6 options — Resolved, Escalated, Workaround, Unresolved, Cancelled, Resolved Externally - Notes: Optional textarea (2 rows)
- Confirm:
bg-gradient-brand, disabled until outcome selected - Cancel / click outside: Closes popover
- Glass card styling (
glass-card-staticpattern)
On confirm: calls POST /sessions/{id}/complete with { outcome, outcome_notes }, updates local state, shows toast.
Implementation Scope
Backend (2 files)
backend/app/schemas/session.py— add new outcome values toSessionOutcome- Update frontend outcome type to match
Frontend (2-3 files)
frontend/src/types/— updateSessionOutcomeTypeScript typefrontend/src/pages/SessionHistoryPage.tsx— add Close button, popover, outcome label formatting for new values
No new components, endpoints, or migrations.