feat(composer): emoji picker button (LC-316) #335

Merged

longjacksonle merged 1 commit from feat/lc-316-composer-emoji-picker into main

2026-06-15 04:44:56 +02:00

longjacksonle commented

2026-06-15 04:44:25 +02:00

Owner

Summary

An emoji button on the composer toolbar opens a browse-and-click grid of popular Unicode emojis + the room's custom emojis; clicking one inserts the glyph (or :shortcode: for custom) at the textarea cursor.

Changes

server/src/routes/emoji_complete.rs: popular_unicode() (curated set via emojis::get_by_shortcode, unknown shortcodes skipped) + get_picker (GET /rooms/{id}/emoji-picker, access-gated), popular + custom -> EmojiPickerFragment.
server/src/views/emoji_complete.rs: EmojiPickerFragment.
server/templates/partials/emoji_picker.html (new): root id picker-composer so the LC-274 reaction-picker filter narrows it client-side; buttons carry data-lc-emoji-insert + data-lc-emoji-name.
server/templates/room/composer.html: toolbar emoji button (hx-get into a relative slot).
server/templates/layout.html: permanent delegated handler inserts data-lc-emoji-insert at the composer cursor + fires input; closes on Escape / outside click (panel stays open after insert).
server/src/routes/mod.rs: register the route. locales/{en,es}/room.ftl: room-composer-emoji.

Full-unicode search-by-typing remains the :shortcode: autocomplete's job (LC-296); this is the click surface, so it ships only the popular set.

Testing

just check, just fmt, just test, just test-saas all pass.
routes_emoji_complete.rs: picker lists popular unicode (tada glyph) + the seeded custom emoji with data-lc-emoji-insert + filter input; non-member 403.
No LC-77 fixture change (message.html untouched).

Not operator-visible (no env/config/contract change).

## Summary An emoji button on the composer toolbar opens a browse-and-click grid of popular Unicode emojis + the room's custom emojis; clicking one inserts the glyph (or `:shortcode:` for custom) at the textarea cursor. ## Changes - `server/src/routes/emoji_complete.rs`: `popular_unicode()` (curated set via `emojis::get_by_shortcode`, unknown shortcodes skipped) + `get_picker` (`GET /rooms/{id}/emoji-picker`, access-gated), popular + custom -> `EmojiPickerFragment`. - `server/src/views/emoji_complete.rs`: `EmojiPickerFragment`. - `server/templates/partials/emoji_picker.html` (new): root id `picker-composer` so the LC-274 reaction-picker filter narrows it client-side; buttons carry `data-lc-emoji-insert` + `data-lc-emoji-name`. - `server/templates/room/composer.html`: toolbar emoji button (hx-get into a relative slot). - `server/templates/layout.html`: permanent delegated handler inserts `data-lc-emoji-insert` at the composer cursor + fires `input`; closes on Escape / outside click (panel stays open after insert). - `server/src/routes/mod.rs`: register the route. `locales/{en,es}/room.ftl`: `room-composer-emoji`. Full-unicode search-by-typing remains the `:shortcode:` autocomplete's job (LC-296); this is the click surface, so it ships only the popular set. ## Testing - `just check`, `just fmt`, `just test`, `just test-saas` all pass. - `routes_emoji_complete.rs`: picker lists popular unicode (tada glyph) + the seeded custom emoji with `data-lc-emoji-insert` + filter input; non-member 403. - No LC-77 fixture change (message.html untouched). Not operator-visible (no env/config/contract change).

longjacksonle added 1 commit

2026-06-15 04:44:25 +02:00

feat(composer): emoji picker button (LC-316)

check-secrets / TruffleHog (push) Successful in 4s

Details

check-secrets / Nosey parker (push) Successful in 5s

Details

check-secrets / Kingfisher (push) Successful in 5s

Details

check-secrets / TruffleHog (pull_request) Successful in 4s

Details

check-secrets / Kingfisher (pull_request) Successful in 5s

Details

check-secrets / Nosey parker (pull_request) Successful in 5s

Details

Create release / Create release from merged PR (pull_request) Has been skipped

Details

Check / clippy + fmt + tests (pull_request) Successful in 3m14s

Details

a548784dd6

Add an emoji button to the composer toolbar that opens a browse-and-click grid of popular Unicode emojis plus the room's custom emojis; clicking one inserts the glyph (or :shortcode: for a custom emoji) at the textarea cursor.

The picker (GET /rooms/{id}/emoji-picker, access-gated like the autocomplete) reuses EmojiSuggestion + the LC-274 client-side filter (its root id starts with "picker-" and it carries data-lc-emoji-filter / data-lc-emoji-grid) and a curated popular-unicode set resolved through the emojis crate by shortcode (unknown shortcodes silently skipped). A permanent delegated handler in layout.html splices the chosen emoji at the cursor and fires input (auto-resize / draft-save / send-enable), closing the panel on Escape or an outside click. Full-unicode search-by-typing remains the :shortcode: autocomplete's job (LC-296); this panel is the click surface.

#LC-316
#LC-317

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>