githubnext/chopinPublic

Let's compose rich plans together

Show an @ mention picker in the Chat composer

enhancement
LA

## Summary

Chat only starts a Planner turn when a message contains `@chopin`, but nothing in the composer teaches that. Typing `@` does nothing, so people send a question without the mention, it lands as a room message, and they wait for a reply that never comes. This proposes an **`@` mention picker** in the Chat composer, in the spirit of GitHub's and Slack's: typing `@` opens a compact list with the Planner first and the people in the document after it.

## Who and why

A document member asks the Planner something mid-run, or replies to a colleague. They need to address the right party without remembering the `@chopin` keyword or anyone's exact GitHub login. The picker makes the Planner discoverable at the moment of addressing, and makes mentioning a colleague as easy as it is on GitHub.

## Design

A minimal GitHub-style list anchored to the caret, reusing the existing `#` reference picker's anchoring, keyboard handling, and request-key logic (`chat/reference-picker.tsx`, `anchored-picker.tsx`) rather than adding a new surface.

``` ┌──────────────────────────┐ │ ◆ chopin │ ← always first │ ◉ lavaman131 │ │ ◉ octocat │ └──────────────────────────┘ Ask @ch▍ ```

- **Rows:** a 20px avatar and the login, in the `chrome` type role. Nothing else: no secondary text, no role badges. The Planner row uses the Planner mark instead of an avatar. - **Order:** `chopin` first, then people present in the document (presence roster), then people who have posted in this Chat, deduplicated case-insensitively by login. The current user is excluded. - **Filtering:** prefix match on login as you type after `@`, case-insensitive; the Planner row filters like any other. - **Selecting** inserts `@login ` (with trailing space) and closes the list. Selected people render as a mention token in the composer and the transcript. - **Keyboard:** ↑/↓ move, Enter or Tab select, Esc dismisses and leaves the typed text. IME composition never selects. - **Avatars:** `https://github.com/<login>.png?size=40`, falling back to the login's initial on a neutral `selected` tile if the image fails.

## Behavior that does not change

- Routing stays exactly as it is: only `@chopin` (per `packages/protocol/address.ts`) starts a Planner turn. Mentioning a person is a token only; there are no notifications, unread badges, or server changes. - The `#` reference picker keeps its behavior; only one picker is open at a time.

## States and ranges

- 0 to about 20 people in a document; the list shows at most 8 rows and scrolls. - No matches: the list closes (no empty-state row), so typing an email such as `a@b.com` is never interrupted. The trigger follows the same word-boundary rule as `addressed()`: `@` after a word character does not open the list. - Alone in the document with no Chat history: the list shows only `chopin`. - Narrow Chat panel: the list keeps the composer's width as its maximum and never overflows the panel.

## Accessibility

- `combobox`/`listbox` semantics with `aria-activedescendant`, consistent with the `#` picker. - Visible focus on the active row; selection is reachable by keyboard only. - Avatar images are decorative (`alt=""`); the login is the accessible name.

## Acceptance

- Typing `@` at a word boundary in the Chat composer opens the list with `chopin` first; `@ch` narrows to `chopin`; Enter inserts `@chopin ` and the message, once sent, starts a Planner turn. - People present in the document and recent Chat authors appear after `chopin`, deduplicated, excluding the current user. - Esc dismisses; `a@b.com` never opens the list. - Unit tests cover trigger detection, ordering, filtering, and insertion; a browser check covers the open → filter → select → send path at desktop and narrow Chat widths.

  1. lavaman131added label enhancementlast month on GitHub

  2. lavaman131assigned lavaman131last month on GitHub

  3. lavaman131referenced this in Show an @ mention picker in the Chat composer #240last month on GitHub

  4. MaggieAppletonreferenced ce05576637f4last month on GitHub

  5. MaggieAppletonclosedlast month on GitHub

  6. benjaminkittreferenced bc8a0907c362last month on GitHub

  7. shanehollomanreferenced 3e57e40ea6dalast month on GitHub