Swipe-to-reveal actions on channel list items by aleksandar-apostolov · Pull Request #6188 · GetStream/stream-chat-android

aleksandar-apostolov · 2026-02-25T10:04:32Z

Goal

Add swipe-to-reveal actions on channel list items, matching the Figma spec. DM channels get More + Archive/Unarchive, group channels get More + Mute/Unmute. Provides a slot-based styling system and full customization support via ChatComponentFactory.

Implementation

Swipe Mechanism

SwipeableChannelItem wraps channel items with AnchoredDraggableState-based swipe gesture
SwipeRevealCoordinator ensures only one item is open at a time
Default positional threshold: 50% of actions width; velocity threshold: 125dp

Default Actions

Channel Type	Left (Secondary)	Right (Primary)
DM	More (gray)	Archive/Unarchive (blue)
Group	More (gray)	Mute/Unmute (blue)

Fallback priority when preferred action is unavailable:
- DM: Archive → Mute → Pin
- Group: Mute → Archive → Pin
"More" opens the channel options bottom sheet (same as long-press)

Slot-Based Styling (`SwipeActionStyle`)

Style	Background	Content
Primary	`accentPrimary` (blue)	White
Secondary	`accentNeutral` (gray)	White
Destructive	`accentError` (red)	White

ChannelAction Refactor

ChannelAction is now a self-describing interface with icon, label, confirmationPopup
Each action (Archive, Mute, Pin, Delete, etc.) carries its own metadata for rendering in swipe actions, bottom sheets, and dialogs

Customization

Two tiers via ChatComponentFactory:

ChannelSwipeActions() — replace which actions appear (keeps swipe mechanism)
ChannelListItemContent() — full control over swipe wrapper + item

Configuration

ChatTheme(
    config = ChatConfig(
        channelList = ChannelListConfig(swipeActionsEnabled = false), // kill switch
    ),
)

New Files

File	Purpose
`SwipeableChannelItem.kt`	`AnchoredDraggableState`-based swipe wrapper
`SwipeRevealCoordinator.kt`	Single-open coordination + CompositionLocals
`SwipeRevealValue.kt`	`Closed` / `Open` enum
`SwipeActionItem.kt`	Individual action button (icon + label)
`SwipeActionStyle.kt`	Slot-based color resolution
`DefaultChannelSwipeActions.kt`	Default DM/Group action logic with fallback

Testing

On-device tested across DM and group channels
Verified swipe gestures, single-open coordination, action execution, auto-close
Verified fallback priority when capabilities are restricted
Sample app's CustomChatComponentFactory updated to include swipe wrapper

Add Pin/Unpin, Mute/Unmute, and Delete swipe actions behind channel list items using AnchoredDraggable from Compose Foundation 1.9.0. - SwipeableChannelItem wrapper with RTL support - SwipeRevealCoordinator for single-open-at-a-time behavior - DefaultChannelSwipeActions respecting channel capabilities - Overridable via ChatComponentFactory.ChannelSwipeActions() - Configurable via ChannelListConfig.swipeActionsEnabled - isPinned added to ChannelItemState

DM channels show Archive + More, group channels show Mute + More. Primary action resolved via fallback priority (DM: Archive→Mute→Pin, Group: Mute→Archive→Pin). "More" opens the channel options bottom sheet via selectChannel. Add SwipeActionStyle enum (Primary/Secondary/Destructive) for slot-based coloring. Fix missing background() on SwipeActionItem.

SideEffect does not track state reads for recomposition, so when onSizeChanged updated actionsWidthPx during layout, the anchor setup block never re-ran — leaving AnchoredDraggableState with no anchors and making the swipe gesture a no-op. Switch to LaunchedEffect(actionsWidthPx) so the key is tracked during composition and anchors are set after layout measurement. Also add height(IntrinsicSize.Min) to the outer Box so the background action Row can fillMaxHeight() properly inside LazyColumn's unbounded height context.

CustomChatComponentFactory overrode ChannelListItemContent without the SwipeableChannelItem wrapper, making swipe a no-op in the sample. - Add SwipeableChannelItem wrapper to the sample's override - Make LocalSwipeRevealCoordinator public so consumers who override ChannelListItemContent can check swipe availability

AnchoredDraggableState.offset returns Float.NaN when no anchors exist yet. roundToInt() throws on NaN in Kotlin. Guard with isNaN check, defaulting to 0 offset.

The ChannelItem's 4dp card inset left the action Row visible through the transparent margins. Add a backgroundColor param to SwipeableChannelItem that paints the foreground layer opaque, covering the actions when the item is in the closed position.

background() must be after offset() so the opaque layer moves with the channel item, covering actions when closed but revealing them when swiped open.

Place the secondary More action first (leftmost) and the primary action (Archive/Mute) second (rightmost) to match the Figma spec.

Rewrite ChannelAction from sealed class to interface carrying icon, label, capability, confirmation popup, and execution handler. This eliminates scattered when-switches, removes ChannelOptionState, and enables custom channel actions across Compose and XML surfaces. - ChannelAction: sealed class → interface with icon/label/onAction - Add ConfirmationPopup data class for deferred destructive actions - Copy 10 icon drawables to ui-common for cross-module access - Remove Cancel object (dismissal via onDismiss callbacks) - ViewModel: performChannelAction → executeOrConfirm/confirmPendingAction - Compose: delete ChannelOptionState, buildDefaultChannelActions returns List<ChannelAction> with ViewModel handlers bound - ChannelsScreen: generic confirmation dialog from action.confirmationPopup - ChatComponentFactory: ChannelOptionState refs → ChannelAction - Swipe actions: build ChannelAction objects directly - XML: factory returns List<ChannelAction>, delete ChannelOptionItem - Update tests, sample app, docs snippets, API dump

github-actions · 2026-02-25T10:04:45Z

PR checklist ✅

All required conditions are satisfied:

Title length is OK (or ignored by label).
At least one pr: label exists.
Sections ### Goal, ### Implementation, and ### Testing are filled.

🎉 Great job! This PR is ready for review.

github-actions · 2026-02-25T10:12:07Z

SDK Size Comparison 📏

SDK	Before	After	Difference	Status
stream-chat-android-client	5.25 MB	5.69 MB	0.44 MB	🟡
stream-chat-android-ui-components	10.60 MB	10.97 MB	0.37 MB	🟡
stream-chat-android-compose	12.81 MB	11.94 MB	-0.87 MB	🚀

Remove dead `isOneToOne` extension (Detekt UnusedPrivateMember) and re-record ChannelItemTest Paparazzi snapshots.

…-actions

Resolve conflicts from channel-list merge (which included v7/AND-1089 design system migration). Update legacy token references: - footnoteBold → captionEmphasis (SwipeActionItem) - errorAccent → accentError (ChatComponentFactory) - overlay → backgroundCoreScrim (SelectedChannelMenu) - highlight → backgroundCoreHighlight (CustomChatComponentFactory) - appBackground → backgroundCoreApp (CustomChatComponentFactory)

…com/GetStream/stream-chat-android into redesign/channel-list-swipe-actions

Replace legacy Material-style icons with filled variants from Stream Foundations. All icons now use 16x16 viewport with filled paths for consistent rendering. Mute/unmute switched from speaker to bell icons.

Mute/unmute: use IconMute (speaker) and IconVolumeFull instead of bell icons. Add: use IconPlusLarge (plus) instead of IconEditBigSolid (pen).

Reorder channel actions: ViewInfo, Mute, Pin, Archive, Leave, Delete. Destructive actions (Leave, Delete) are now grouped last. Mark LeaveGroup as isDestructive = true.

Replace horizontal member list with compact header: channel avatar (left) + channel name + member count/status (right). Matches Figma Channel Detail Sheet design.

…ions Channel list title: bodyDefault → headingSmall (semi-bold) to match Figma. Swipe actions: remove text label, show icon only in a centered Box.

Light gray background with dark icon instead of dark slate500 with white icon. Matches Figma swipe action design.

Item height 56dp → 48dp, icon container 56dp → 48dp with 12dp padding (24dp icon). More compact to match Figma design.

Icon: spacingXl (24dp) with spacingSm (12dp) horizontal padding. Replaces hardcoded 48dp/12dp values with design system tokens.

No dividers between channel options per Figma design.

Row height 48dp → 44dp, horizontal padding spacing2xs (4dp), icon 24dp with 8dp end gap. Matches Mobile / List Item Figma component.

…ngMd spacing2xs (4dp) → spacingMd (16dp) to match visible Figma padding.

spacingXs (8dp) bottom content padding for breathing room below last action item.

aleksandar-apostolov · 2026-02-25T14:10:54Z

Consolidated into #6181 — combined the channel list redesign and swipe actions into a single PR since most changes here (icons, bottom sheet, ChannelAction refactor) belong to the broader redesign scope.

aleksandar-apostolov added 9 commits February 24, 2026 12:41

fix(compose): guard against NaN offset before anchors are set

ff1ec5e

AnchoredDraggableState.offset returns Float.NaN when no anchors exist yet. roundToInt() throws on NaN in Kotlin. Guard with isNaN check, defaulting to 0 offset.

fix(compose): correct modifier order so background slides with content

938c9c4

background() must be after offset() so the opaque layer moves with the channel item, covering actions when closed but revealing them when swiped open.

fix(compose): swap swipe action order — More left, primary right

ac1fa4d

Place the secondary More action first (leftmost) and the primary action (Archive/Mute) second (rightmost) to match the Figma spec.

aleksandar-apostolov changed the title ~~feat(compose): swipe-to-reveal actions on channel list items~~ Swipe-to-reveal actions on channel list items Feb 25, 2026

aleksandar-apostolov added the pr:breaking-change Breaking change label Feb 25, 2026

aleksandar-apostolov added 16 commits February 25, 2026 11:13

fix(compose): remove unused isOneToOne and re-record snapshots

06537ca

Remove dead `isOneToOne` extension (Detekt UnusedPrivateMember) and re-record ChannelItemTest Paparazzi snapshots.

Merge branch 'redesign/channel-list' into redesign/channel-list-swipe…

6359d79

…-actions

Merge branch 'redesign/channel-list-swipe-actions' of https://github.…

fff42ed

…com/GetStream/stream-chat-android into redesign/channel-list-swipe-actions

feat(icons): update channel action and list icons to Figma design system

e7ed181

Replace legacy Material-style icons with filled variants from Stream Foundations. All icons now use 16x16 viewport with filled paths for consistent rendering. Mute/unmute switched from speaker to bell icons.

fix(icons): correct mute/unmute and add icon mappings

7133df2

Mute/unmute: use IconMute (speaker) and IconVolumeFull instead of bell icons. Add: use IconPlusLarge (plus) instead of IconEditBigSolid (pen).

fix(channels): move Leave to end as destructive action

c4e96f1

Reorder channel actions: ViewInfo, Mute, Pin, Archive, Leave, Delete. Destructive actions (Leave, Delete) are now grouped last. Mark LeaveGroup as isDestructive = true.

feat(channels): redesign bottom sheet header with group avatar

d4500dd

Replace horizontal member list with compact header: channel avatar (left) + channel name + member count/status (right). Matches Figma Channel Detail Sheet design.

fix(channels): use headingSmall for channel name, icon-only swipe act…

d329a4d

…ions Channel list title: bodyDefault → headingSmall (semi-bold) to match Figma. Swipe actions: remove text label, show icon only in a centered Box.

fix(swipe): use backgroundCoreSurface for secondary action

6ebb8a0

Light gray background with dark icon instead of dark slate500 with white icon. Matches Figma swipe action design.

fix(channels): reduce bottom sheet action item size

8982919

Item height 56dp → 48dp, icon container 56dp → 48dp with 12dp padding (24dp icon). More compact to match Figma design.

fix(channels): use StreamTokens for bottom sheet action dimensions

a82053e

Icon: spacingXl (24dp) with spacingSm (12dp) horizontal padding. Replaces hardcoded 48dp/12dp values with design system tokens.

fix(channels): remove dividers between bottom sheet action items

18dd86e

No dividers between channel options per Figma design.

fix(channels): align bottom sheet items with Figma List Item spec

6b69f27

Row height 48dp → 44dp, horizontal padding spacing2xs (4dp), icon 24dp with 8dp end gap. Matches Mobile / List Item Figma component.

fix(channels): increase bottom sheet item horizontal padding to spaci…

e042ebb

…ngMd spacing2xs (4dp) → spacingMd (16dp) to match visible Figma padding.

fix(channels): add bottom padding to channel options list

aec1cb4

spacingXs (8dp) bottom content padding for breathing room below last action item.

aleksandar-apostolov merged commit aec1cb4 into redesign/channel-list Feb 25, 2026
10 of 14 checks passed

aleksandar-apostolov deleted the redesign/channel-list-swipe-actions branch February 25, 2026 14:10

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Swipe-to-reveal actions on channel list items#6188

Swipe-to-reveal actions on channel list items#6188
aleksandar-apostolov merged 25 commits intoredesign/channel-listfrom
redesign/channel-list-swipe-actions

aleksandar-apostolov commented Feb 25, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Feb 25, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Feb 25, 2026 •

edited

Loading

Uh oh!

Uh oh!

aleksandar-apostolov commented Feb 25, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

aleksandar-apostolov commented Feb 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Goal

Implementation

Swipe Mechanism

Default Actions

Slot-Based Styling (SwipeActionStyle)

ChannelAction Refactor

Customization

Configuration

New Files

Testing

Uh oh!

github-actions bot commented Feb 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

PR checklist ✅

Uh oh!

github-actions bot commented Feb 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

SDK Size Comparison 📏

Uh oh!

Uh oh!

aleksandar-apostolov commented Feb 25, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

aleksandar-apostolov commented Feb 25, 2026 •

edited

Loading

Slot-Based Styling (`SwipeActionStyle`)

github-actions bot commented Feb 25, 2026 •

edited

Loading

github-actions bot commented Feb 25, 2026 •

edited

Loading