# Task 05 — Vihar Share Sheet

Final step of the captain's create flow: show the prefilled WhatsApp message
and let them share it with one tap.

## File to create

```
apps/web/src/app/captain/vihars/[id]/share/page.tsx
```

## Data source

```
GET /api/vihars/{id}/whatsapp-message
```

Returns:
```json
{
  "message": "🙏 Jai Jinendra 🙏\n\n*Vihar Update — ...",
  "waUrl": "https://wa.me/?text=...",
  "deepLink": "https://vsg.kreonsolutions.in/v/123"
}
```

## Layout

- Header: "Share Vihar" + small saffron rule
- Message preview: a Card with the message rendered as preformatted text
  (use `whitespace-pre-wrap font-mono text-sm`). Scroll if long.
- Primary action button: green WhatsApp button — full width, large, with
  the WhatsApp icon (use `lucide-react` MessageCircle or import the SVG).
  ```tsx
  <a
    href={data.waUrl}
    target="_blank"
    rel="noopener"
    className="block w-full bg-[#25D366] text-white text-center py-4 rounded-md font-medium"
  >
    Share on WhatsApp
  </a>
  ```
- Secondary actions:
  - "Copy message" button (clipboard API + toast confirmation)
  - "Share via..." (Web Share API if `navigator.share` is available)
- Footer: "Done" button — returns to `/captain/vihars/{id}` (the detail page).

## Behavior

- The vihar is already saved by the time this page loads. Sharing is
  optional; user can leave at any time.
- Tapping "Share on WhatsApp" opens the WhatsApp picker (mobile app or web).
  The captain selects which group/person — that's WhatsApp's UI, not ours.
- Show a small note: "WhatsApp will open. Pick the group or contact to share with."

## Acceptance

1. After submitting allocation, land on share page.
2. See the message preview correctly substituted with date, head saint,
   route, distance, volunteer names.
3. Tap "Share on WhatsApp" — WhatsApp opens with the message prefilled.
4. Tap "Copy" — toast confirms "Message copied".
5. Tap "Done" — go to vihar detail.

## Gotchas

- `wa.me` URL has a soft length limit around 4096 chars. Default template
  is well under, but if remarks are very long the URL might get cut. The
  API service should already truncate or warn — verify in testing.
- On iOS Safari, `target="_blank"` may not work for `wa.me`. Use a regular
  `<a>` link without target so it opens in WhatsApp directly.
- If user re-shares later from the vihar detail page, hit the same endpoint —
  message will reflect any volunteer reassignments since.

## Out of scope

- Tracking who clicked share / when — WhatsApp doesn't expose this
- WhatsApp Business API templates — Phase 3
- SMS fallback — Phase 2 (mention in note for now)