From bf3d7207deb59e01f0618061fb66c5ee7b786ae6 Mon Sep 17 00:00:00 2001
From: Benoit Marty <benoit@matrix.org>
Date: Mon, 22 May 2023 17:21:16 +0200
Subject: [PATCH] Animate collapse/expand change

---
 .../messages/impl/timeline/TimelineView.kt    | 43 ++++++++++---------
 1 file changed, 23 insertions(+), 20 deletions(-)

diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelineView.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelineView.kt
index 4b8a1b4869..7c607ca8d4 100644
--- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelineView.kt
+++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelineView.kt
@@ -16,6 +16,7 @@
 
 package io.element.android.features.messages.impl.timeline
 
+import androidx.compose.animation.animateContentSize
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
@@ -173,29 +174,31 @@ fun TimelineItemRow(
                 onExpandGroupClick(timelineItem)
             }
 
-            if (timelineItem.expanded) {
-                Column {
-                    timelineItem.events.forEach { subGroupEvent ->
-                        TimelineItemRow(
-                            timelineItem = subGroupEvent,
-                            highlightedItem = highlightedItem,
-                            onClick = onClick,
-                            onLongClick = onLongClick,
-                            onExpandGroupClick = {}
-                        )
+            Column(modifier = Modifier.animateContentSize()) {
+                GroupHeaderView(
+                    text = pluralStringResource(
+                        id = R.plurals.room_timeline_state_changes,
+                        count = timelineItem.events.size,
+                        timelineItem.events.size
+                    ),
+                    isExpanded = timelineItem.expanded,
+                    isHighlighted = !timelineItem.expanded && timelineItem.events.any { it.identifier() == highlightedItem },
+                    onClick = ::onExpandGroupClick,
+                )
+                if (timelineItem.expanded) {
+                    Column {
+                        timelineItem.events.forEach { subGroupEvent ->
+                            TimelineItemRow(
+                                timelineItem = subGroupEvent,
+                                highlightedItem = highlightedItem,
+                                onClick = onClick,
+                                onLongClick = onLongClick,
+                                onExpandGroupClick = {}
+                            )
+                        }
                     }
                 }
             }
-            GroupHeaderView(
-                text = pluralStringResource(
-                    id = R.plurals.room_timeline_state_changes,
-                    count = timelineItem.events.size,
-                    timelineItem.events.size
-                ),
-                isExpanded = timelineItem.expanded,
-                isHighlighted = !timelineItem.expanded && timelineItem.events.any { it.identifier() == highlightedItem },
-                onClick = ::onExpandGroupClick,
-            )
         }
     }
 }