From 667b32cdeede0ca3df82de96e2139191d9fd757e Mon Sep 17 00:00:00 2001
From: Benoit Marty <benoit@matrix.org>
Date: Wed, 5 Jul 2023 16:42:46 +0200
Subject: [PATCH] Prefer using `graphicsLayer` for better performance issue
 (limit number of recompositions)

---
 .../components/ReplySwipeIndicator.kt         | 19 ++++++++++---------
 .../components/TimelineItemEventRow.kt        |  2 +-
 2 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/ReplySwipeIndicator.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/ReplySwipeIndicator.kt
index 9bab4f28ab..de40ae8dc1 100644
--- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/ReplySwipeIndicator.kt
+++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/ReplySwipeIndicator.kt
@@ -20,11 +20,10 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.draw.alpha
+import androidx.compose.ui.graphics.graphicsLayer
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.VectorIcons
@@ -40,14 +39,16 @@ import io.element.android.libraries.designsystem.theme.components.Icon
  */
 @Composable
 fun RowScope.ReplySwipeIndicator(
-    swipeProgress: Float,
+    swipeProgress: () -> Float,
     modifier: Modifier = Modifier,
 ) {
     Icon(
         modifier = modifier
             .align(Alignment.CenterVertically)
-            .padding(start = 36.dp * swipeProgress.coerceAtMost(1f))
-            .alpha(swipeProgress),
+            .graphicsLayer {
+                translationX = 36.dp.toPx() * swipeProgress().coerceAtMost(1f)
+                alpha = swipeProgress()
+            },
         contentDescription = null,
         resourceId = VectorIcons.Reply,
     )
@@ -67,10 +68,10 @@ internal fun ReplySwipeIndicatorDarkPreview() =
 private fun ContentToPreview() {
     Column(modifier = Modifier.fillMaxWidth()) {
         for (i in 0..8) {
-            Row { ReplySwipeIndicator(swipeProgress = i / 8f) }
+            Row { ReplySwipeIndicator(swipeProgress = { i / 8f }) }
         }
-        Row { ReplySwipeIndicator(swipeProgress = 1.5f) }
-        Row { ReplySwipeIndicator(swipeProgress = 2f) }
-        Row { ReplySwipeIndicator(swipeProgress = 3f) }
+        Row { ReplySwipeIndicator(swipeProgress = { 1.5f }) }
+        Row { ReplySwipeIndicator(swipeProgress = { 2f }) }
+        Row { ReplySwipeIndicator(swipeProgress = { 3f }) }
     }
 }
diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemEventRow.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemEventRow.kt
index e64e753e98..b46fb93e9c 100644
--- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemEventRow.kt
+++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemEventRow.kt
@@ -131,7 +131,7 @@ fun TimelineItemEventRow(
         SwipeToDismiss(
             state = dismissState,
             background = {
-                ReplySwipeIndicator(dismissState.toSwipeProgress())
+                ReplySwipeIndicator({ dismissState.toSwipeProgress() })
             },
             directions = setOf(DismissDirection.StartToEnd),
             dismissContent = {