You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
Commit 656a66e
Browse filesBrowse the repository at this point in the historyBrowse files
fix(chat): polish the quick reaction strip and add double-tap tapback (#1605)
* fix(chat): polish the quick reaction strip and add double-tap tapback
The strip's fades were fixed gradients, its emoji sat off-center, and it
opened below bubbles near the top of the list. This matches the iOS spec:
- Fades follow the scroll position: 20dp on the leading edge, and a
trailing fade that ends at the "+", mirrored in RTL.
- Emoji line height equals the font size, trimmed and without font
padding, so glyphs center in their circles. "+" is 40dp.
- End padding is Inset + AddSize + ItemSpacing (52dp).
- The strip always opens above the bubble, except for a bubble taller
than the viewport. Focusing a reactable message scrolls an extra
55 + 16 + 8dp to make room.
- Double-tap presents the strip alone, with no selection bar or
actions, on any bubble that can take reactions. Cash bubbles, link
cards and reply quotes take double-tap too, so their single tap now
waits out the double-tap timeout. Buttons inside cards stay instant.
While a message is raised, the composer, the $ button and the items
above the oldest message (info/invite card, date) now dim and blur with
the transcript; before, they drew over the backdrop.
Half sheets now keep the expanded detent once their content has
overflowed. The reactors sheet overflowed at half height but fit when
expanded, so it lost the detent on expanding and snapped back to half.
* fix(chat): play one haptic on a message long-press
combinedClickable plays its own long-press haptic by default, and the
row's select also calls vibrator.tick(), so each long-press buzzed
twice. Turn off the platform haptic on every combinedClickable that
reports select: the row, cash bubbles, reply quotes and link cards.
* fix(chat): frost the strip's "+" over the emoji scrolling under it
The emoji now scroll on under the "+", which blurs them with Haze
instead of cutting them off at its edge. The trailing fade runs from the
middle of the "+" to 14dp past it, where the 40dp circle is last as
tall as a 28dp emoji, and hides everything from there to the strip's
end; ending it later let the emoji poke out around the circle's curve.
Long-presses that do nothing (the strip's emoji and "+", and the pill
row's "N more" and "+") no longer play the platform haptic. A pill's
own long-press opens the reactors sheet and keeps it.
Copy file name to clipboardExpand all lines: apps/flipcash/features/messenger/src/main/kotlin/com/flipcash/app/messenger/internal/screens/MessengerScreen.kt
Copy file name to clipboardExpand all lines: apps/flipcash/features/messenger/src/main/kotlin/com/flipcash/app/messenger/internal/screens/components/ChatTopBar.kt
+2-1Lines changed: 2 additions & 1 deletion
Original file line number
Diff line number
Diff line change
@@ -90,7 +90,8 @@ internal fun ChatTopBar(
90
90
// would offer the profile and leave back as the only way out.
Copy file name to clipboardExpand all lines: apps/flipcash/features/messenger/src/main/kotlin/com/flipcash/app/messenger/internal/screens/components/MessageList.kt
Copy file name to clipboardExpand all lines: apps/flipcash/features/messenger/src/main/kotlin/com/flipcash/app/messenger/internal/screens/components/MessageRow.kt
+17-1Lines changed: 17 additions & 1 deletion
Original file line number
Diff line number
Diff line change
@@ -163,6 +163,16 @@ internal fun MessageRow(
163
163
onAction(ChatAction.ToggleSelection(target))
164
164
}
165
165
}
166
+
// A double tap presents the strip alone, as iMessage's tapback does. Hoisted like select: a
167
+
// bubble with a tap target of its own -- a cash bubble, a link card, a quote -- reports it too,
168
+
// and holds its single tap for the double-tap timeout to tell the two apart. A button inside a
169
+
// card is not given it, so it stays instant.
170
+
val presentStrip = bubble?.takeIf { it.canReact }?.let { target ->
171
+
{
172
+
vibrator.tick()
173
+
onAction(ChatAction.PresentReactionStrip(target))
174
+
}
175
+
}
166
176
167
177
val dimAlpha by animateFloatAsState(
168
178
targetValue =if (focused) 1felse0.4f,
@@ -241,6 +251,10 @@ internal fun MessageRow(
241
251
interactionSource = interactionSource,
242
252
indication =null,
243
253
onLongClick = select,
254
+
onDoubleClick = presentStrip,
255
+
// select plays the tick; the platform's own long-press haptic on top of
256
+
// it is felt as a second buzz.
257
+
hapticFeedbackEnabled =false,
244
258
// Only reachable with the backdrop down, so the tap has nothing to
245
259
// dismiss but the keyboard.
246
260
onClick = { keyboard.hide() },
@@ -357,6 +371,7 @@ internal fun MessageRow(
357
371
// so the row's long-press never reaches it. Handing it the
358
372
// same gesture is what makes a cash bubble selectable.
359
373
onLongClick = select,
374
+
onDoubleClick = presentStrip,
360
375
position = bubblePositionOf(
361
376
index,
362
377
item,
@@ -561,7 +576,8 @@ private fun senderNameInset(showsGutter: Boolean): Dp =
561
576
CodeTheme.dimens.grid.x1
562
577
}
563
578
564
-
privatevalSTRIP_BAR_GAP=8.dp
579
+
/** Between the top bar and the highest the quick strip goes. */
Copy file name to clipboardExpand all lines: apps/flipcash/features/messenger/src/test/kotlin/com/flipcash/app/messenger/internal/ChatReactionsReducerTest.kt
0 commit comments