fe861cfafa
Complete Android client for encrypted chat platform. 78+ Kotlin files: crypto (X3DH, Double Ratchet, AES-GCM, Ed25519, X25519, RSA-PSS), network (TCP/TLS, 50 endpoints), Hilt DI, Room+SQLCipher DB, Jetpack Compose UI with Catppuccin Mocha theme. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
3.6 KiB
3.6 KiB
Agent K: Reactions, Pins, Search, Forward
Phase: 4 (Feature Completion)
Depends on: Agent F (Chat Screen with MessageBubble)
Context
These features enhance the chat experience. Reactions use 6 predefined emoji. Pins allow highlighting important messages. Search is client-side through cached messages. Forward sends messages to other conversations with attribution.
Task
Create reaction picker, pin UI, search overlay, forward dialog, and @mention autocomplete.
Files to Create
1. ui/chat/ReactionPicker.kt
Emoji reaction picker composable:
- Layout: Horizontal row of 6 emoji buttons in a rounded Surface1 card
- Emoji: thumbsup, heart, laugh, surprised, sad, thumbsdown
- Display: Use emoji characters (not images)
- Behavior:
- Shown as popup/overlay near the long-pressed message
- Tap emoji: add reaction (or remove if already reacted)
- Dismiss on outside tap
- Animation: Scale-in animation when appearing
2. ui/chat/ReactionBadge.kt
Reaction display below messages:
- Layout: FlowRow of reaction chips
- Each chip: emoji + count in a small pill shape
- Background: Surface1 (or Lavender alpha if user reacted)
- Border: Surface2 (or Lavender if user reacted)
- Text: emoji (14sp) + count (12sp)
- Behavior: Tap to toggle own reaction
3. ui/chat/PinnedMessagesSheet.kt
Bottom sheet showing pinned messages:
- Header: "Pinned Messages" title + close button
- List: LazyColumn of pinned messages
- Each item: sender name + message text preview + pin date
- Tap: scroll to message in chat (dismiss sheet)
- Empty state: "No pinned messages"
4. ui/chat/SearchOverlay.kt
Search bar overlay at top of chat screen:
- Layout: Row with:
- Search TextField (weight 1f, with search icon)
- Match count text ("3 of 12")
- Up arrow button (previous result)
- Down arrow button (next result)
- Close button (X)
- Behavior:
- Activated by search icon in top bar
- Results update as user types (debounced 300ms)
- Current match highlighted differently from other matches
- Up/Down cycle through results
- Escape or X closes search
- Match highlighting in messages: Yellow background on matching text
5. ui/chat/ForwardPickerDialog.kt
Dialog for selecting forwarding target:
- Title: "Forward to..."
- Conversation list: LazyColumn of all user's conversations
- Each item: avatar + conversation name
- Tap: forward to that conversation and dismiss
- Search field: Filter conversations by name
- Cancel button
6. ui/chat/MentionAutocomplete.kt
@mention autocomplete popup:
- Trigger: Typing "@" in message input
- Layout: Popup above the text input
- LazyColumn of matching member names
- Each item: avatar (24dp) + username
- Behavior:
- Filters as user types after "@"
- Tap: inserts "@username " into text field
- Dismiss on escape, backspace past "@", or clicking outside
- Styling: Surface1 background, elevated (shadow)
Reaction Emoji Mapping
"thumbsup" -> 👍
"heart" -> ❤️
"laugh" -> 😂
"surprised" -> 😮
"sad" -> 😢
"thumbsdown" -> 👎
Constraints
- Reaction picker uses emoji characters (Unicode), not custom images
- Search is debounced (300ms) to avoid excessive computation
- Forward dialog loads conversation list from local cache
- @mention autocomplete only shows members of current conversation
- All animations should be subtle and fast (200-300ms)
DO NOT
- Implement actual server calls for reactions/pins
- Handle message encryption for forwarding
- Implement full-text search indexing (just LIKE query on cached text)