---
estimated_steps: 4
estimated_files: 3
skills_used:
  - react-best-practices
  - test
---

# T02: Make the follow-up workspace show thread-grounded draft state without autonomous sending

**Slice:** S03 — Reply and follow-up drafting from real thread context
**Milestone:** M001

## Description

Turn the Follow-up tab into a clearer workspace that shows why the draft was generated now, what thread/package context informed it, and what will happen when the user manually sends/logs it.

## Steps

1. Align frontend types with any stronger follow-up draft contract exposed by T01.
2. Refine the Follow-up tab in `JobDetailsDialog.tsx` so it surfaces thread/package grounding, editable draft state, and the manual-send boundary clearly.
3. Add a focused React test that proves generation, editability, and manual send/log behavior for the follow-up loop.
4. Verify the focused follow-up workspace test and make sure it covers the saved-context/thread-aware behavior instead of generic form rendering.

## Must-Haves

- [ ] The Follow-up tab shows why the follow-up is due and what job/thread/package context informed the draft.
- [ ] The draft remains editable before sending and the send action stays explicitly manual.
- [ ] The focused React test proves generate/edit/send-log behavior for the follow-up loop.

## Verification

- `CI=true npm --prefix job-tracker-ui test -- --watch=false --runTestsByPath src/job-details-followup-drafts.test.tsx`
- Confirm the test proves thread-aware draft context plus manual send/log behavior in `job-tracker-ui/src/components/JobDetailsDialog.tsx`.

## Observability Impact

- Signals added/changed: clearer Follow-up tab state around draft reason, informing context, and sent/logged outcome.
- How a future agent inspects this: open the Follow-up tab in `job-tracker-ui/src/components/JobDetailsDialog.tsx` and read `job-tracker-ui/src/job-details-followup-drafts.test.tsx`.
- Failure state exposed: the UI should distinguish draft-generation failure, editable draft state, and sent/logged follow-up state.

## Inputs

- `job-tracker-ui/src/components/JobDetailsDialog.tsx` — current follow-up UI.
- `job-tracker-ui/src/types.ts` — current frontend contracts.
- `JobTrackerApi/Controllers/JobApplicationsController.cs` — stronger follow-up draft contract from T01.

## Expected Output

- `job-tracker-ui/src/components/JobDetailsDialog.tsx` — follow-up workspace grounded in saved/job/thread context.
- `job-tracker-ui/src/types.ts` — aligned follow-up DTO shape if T01 adds context fields.
- `job-tracker-ui/src/job-details-followup-drafts.test.tsx` — focused frontend proof for the follow-up loop.