From 7bdcab2e49cf4fc7865af4b51139c9daf50d5633 Mon Sep 17 00:00:00 2001
From: Aleksandar Apostolov <apostolov.alexandar@gmail.com>
Date: Mon, 30 Oct 2023 12:12:35 +0100
Subject: [PATCH] Additional design updates

---
 .../components/call/renderer/ParticipantVideo.kt   | 14 ++++++++++++--
 .../connection/internal/ConnectionBars.kt          |  9 ---------
 .../src/main/res/values/dimens.xml                 |  2 +-
 3 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/stream-video-android-compose/src/main/kotlin/io/getstream/video/android/compose/ui/components/call/renderer/ParticipantVideo.kt b/stream-video-android-compose/src/main/kotlin/io/getstream/video/android/compose/ui/components/call/renderer/ParticipantVideo.kt
index bf2dd9fb37..5d27fd274a 100644
--- a/stream-video-android-compose/src/main/kotlin/io/getstream/video/android/compose/ui/components/call/renderer/ParticipantVideo.kt
+++ b/stream-video-android-compose/src/main/kotlin/io/getstream/video/android/compose/ui/components/call/renderer/ParticipantVideo.kt
@@ -52,7 +52,9 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.layout.onGloballyPositioned
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.platform.LocalInspectionMode
 import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.painterResource
@@ -294,6 +296,10 @@ public fun BoxScope.ParticipantLabel(
         )
     },
 ) {
+    var componentWidth by remember { mutableStateOf(0.dp) }
+    componentWidth = VideoTheme.dimens.participantLabelTextMaxWidth
+    // get local density from composable
+    val density = LocalDensity.current
     Box(
         modifier = Modifier
             .align(labelPosition)
@@ -302,7 +308,11 @@ public fun BoxScope.ParticipantLabel(
             .background(
                 VideoTheme.colors.participantLabelBackground,
                 shape = VideoTheme.shapes.participantLabelShape,
-            ),
+            ).onGloballyPositioned {
+                componentWidth = with(density) {
+                    it.size.width.toDp()
+                }
+            },
     ) {
         Row(
             modifier = Modifier.align(Center),
@@ -310,7 +320,7 @@ public fun BoxScope.ParticipantLabel(
         ) {
             Text(
                 modifier = Modifier
-                    .widthIn(max = VideoTheme.dimens.participantLabelTextMaxWidth)
+                    .widthIn(max = componentWidth)
                     .padding(start = VideoTheme.dimens.participantLabelTextPaddingStart)
                     .align(CenterVertically),
                 text = nameLabel,
diff --git a/stream-video-android-compose/src/main/kotlin/io/getstream/video/android/compose/ui/components/connection/internal/ConnectionBars.kt b/stream-video-android-compose/src/main/kotlin/io/getstream/video/android/compose/ui/components/connection/internal/ConnectionBars.kt
index af03e0ea7d..7c20da0b88 100644
--- a/stream-video-android-compose/src/main/kotlin/io/getstream/video/android/compose/ui/components/connection/internal/ConnectionBars.kt
+++ b/stream-video-android-compose/src/main/kotlin/io/getstream/video/android/compose/ui/components/connection/internal/ConnectionBars.kt
@@ -27,7 +27,6 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.tooling.preview.Preview
 import io.getstream.video.android.compose.theme.VideoTheme
 import io.getstream.video.android.core.model.NetworkQuality
 
@@ -96,11 +95,3 @@ internal fun ConnectionBars(modifier: Modifier = Modifier, colors: Triple<Color,
         )
     }
 }
-
-@Preview
-@Composable
-private fun BarsPreview() {
-    VideoTheme {
-        ConnectionBars(colors = Triple(Color.Red, Color.Blue, Color.Green))
-    }
-}
diff --git a/stream-video-android-ui-common/src/main/res/values/dimens.xml b/stream-video-android-ui-common/src/main/res/values/dimens.xml
index 3747814bc4..f6ea268a34 100644
--- a/stream-video-android-ui-common/src/main/res/values/dimens.xml
+++ b/stream-video-android-ui-common/src/main/res/values/dimens.xml
@@ -71,7 +71,7 @@
     <dimen name="stream_video_callParticipantSoundIndicatorPaddingStart">8dp</dimen>
     <dimen name="stream_video_participantsGridPadding">4dp</dimen>
     <dimen name="stream_video_callParticipantLabelPadding">8dp</dimen>
-    <dimen name="stream_video_callParticipantLabelTextMaxWidth">64dp</dimen>
+    <dimen name="stream_video_callParticipantLabelTextMaxWidth">120dp</dimen>
     <dimen name="stream_video_callParticipantLabelTextPadding">4dp</dimen>
     <dimen name="stream_video_screenShareParticipantItemSize">110dp</dimen>
     <dimen name="stream_video_screenShareParticipantsListHeight">125dp</dimen>