ChatMessage: improve delivery status, hover states, and time display#5628
Open
jamesacklin wants to merge 11 commits intodevelopfrom
Open
ChatMessage: improve delivery status, hover states, and time display#5628jamesacklin wants to merge 11 commits intodevelopfrom
jamesacklin wants to merge 11 commits intodevelopfrom
Conversation
…relocate click-to-retry action; ChatMessageDeliveryStatus: invert arrow fill direction
…meText: add; ChatMessage: add sent time to subsequent messages in a series; ChatMessage: add hover background color + reposition ... menu
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
… background color, include rounded corners
…stray expression - ChatMessageReplySummary: stopPropagation on retry press to prevent bubbling to outer reply-navigation Pressable on web - ChatMessage: add separate showHiddenContent state so "Show anyway" for hidden posts actually reveals the content - ChatMessageDeliveryStatus: remove stray `3;` expression Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
jamesacklin
commented
Mar 25, 2026
packages/app/ui/components/ChatMessage/ChatMessageHighlight.tsx
Outdated
Show resolved
Hide resolved
…or both react-native-reanimated works on web, so the separate CSS transition path was unnecessary. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…or both Use withSequence to express the full opacity timeline in a single assignment, fixing the fade-out on web where back-to-back shared value assignments were not triggering the delayed animation. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Improves chat message UX with hover highlights on desktop, relocates the delivery retry action inline, fixes the message highlight fade-out on web, and extracts a shared
SentTimeTextcomponent to deduplicate time formatting. Also allows users to unhide a previously-hidden message.Fixes TLON-5498
Fixes TLON-4120
Fixes TLON-5460
Changes
$secondaryBackgroundwith$mborder radius), desktop-onlyChatMessageReplySummaryinstead of a standalone absolute-positioned retry buttonshowHiddenContentstate3;expressionpositiveBackgroundcolordeliveryFailedandonPressRetryprops; render retry indicator with redo icon inline;stopPropagationon retry press to prevent bubbling to outer reply-navigation Pressable on webtimeDisplaymemo logic with sharedSentTimeTextHow did I test?
Visual inspection via local dev server (
pnpm run dev:web).Risks and impact
Rollback plan
Revert the PR; all changes are cosmetic/UI-only with no data model or API changes.
Screenshots / videos
New location for failure indicator / retry action:
Hover background / timestamps in action:
Screen.Recording.2026-03-23.at.11.59.54.AM.mov