Remove ComposerLinkPreviewTheme and ComposerCancelIconStyle

Author: gpunto

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/components/ComposerCancelIcon.kt

@@ -20,9 +20,11 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.border
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material3.Icon
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
@@ -41,29 +43,18 @@ public fun ComposerCancelIcon(
     modifier: Modifier = Modifier,
     onClick: () -> Unit,
 ) {
-    val style = ChatTheme.messageComposerTheme.attachmentCancelIcon
+    val colors = ChatTheme.colors
+
     Icon(
         modifier = modifier
-            .then(
-                if (style.border != null) {
-                    Modifier.border(style.border, style.backgroundShape)
-                } else {
-                    Modifier
-                },
-            )
+            .border(2.dp, colors.controlRemoveBorder, CircleShape)
             .padding(2.dp)
-            .background(
-                shape = style.backgroundShape,
-                color = style.backgroundColor,
-            )
+            .background(color = colors.controlRemoveBg, shape = CircleShape)
             .size(20.dp)
-            .clickable(
-                bounded = false,
-                onClick = onClick,
-            ),
-        painter = style.painter,
-        contentDescription = stringResource(id = R.string.stream_compose_cancel),
-        tint = style.tint,
+            .clickable(bounded = false, onClick = onClick),
+        painter = painterResource(R.drawable.stream_compose_ic_cross),
+        contentDescription = stringResource(R.string.stream_compose_cancel),
+        tint = colors.controlRemoveIcon,
     )
 }
 

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/components/composer/ComposerLinkPreview.kt

@@ -30,11 +30,10 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
@@ -51,6 +50,8 @@ import androidx.compose.ui.graphics.toArgb
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.testTag
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.core.net.toUri
@@ -59,7 +60,7 @@ import coil3.compose.LocalAsyncImagePreviewHandler
 import io.getstream.chat.android.compose.R
 import io.getstream.chat.android.compose.ui.components.ComposerCancelIcon
 import io.getstream.chat.android.compose.ui.theme.ChatTheme
-import io.getstream.chat.android.compose.ui.theme.TextComponentStyle
+import io.getstream.chat.android.compose.ui.theme.StreamColors
 import io.getstream.chat.android.compose.ui.util.AsyncImagePreviewHandler
 import io.getstream.chat.android.compose.ui.util.StreamAsyncImage
 import io.getstream.chat.android.models.Attachment
@@ -95,7 +96,9 @@ public fun ComposerLinkPreview(
 
     val context = LocalContext.current
     val attachment = linkPreview.attachment
-    val theme = ChatTheme.messageComposerTheme.linkPreview
+    val colors = ChatTheme.colors
+    val typography = ChatTheme.typography
+    val textColor = colors.textHighEmphasis
 
     Box {
         Row(
@@ -105,31 +108,30 @@ public fun ComposerLinkPreview(
                     interactionSource = remember { MutableInteractionSource() },
                     onClick = { handleLinkPreviewClick(onClick, context, linkPreview) },
                 )
-                .background(theme.background, theme.shape)
+                .background(colors.chatBgOutgoing, ChatTheme.shapes.attachment)
+                // TODO [G.] point to spacings
                 .padding(start = 8.dp, end = 16.dp, top = 8.dp, bottom = 8.dp),
             horizontalArrangement = Arrangement.spacedBy(8.dp),
         ) {
-            ComposerLinkImagePreview(attachment)
+            ComposerLinkImagePreview(attachment, colors)
             Column(
                 modifier = Modifier
                     .weight(1f)
                     .align(Alignment.CenterVertically),
             ) {
                 ComposerLinkPreviewText(
                     text = attachment.title,
-                    style = theme.title,
+                    style = typography.footnoteBold.copy(color = textColor),
                     testTag = "Stream_LinkPreviewTitle",
                 )
-                Spacer(modifier = Modifier.height(theme.titleToSubtitle))
-
                 ComposerLinkPreviewText(
                     text = attachment.text,
-                    style = theme.subtitle,
+                    style = typography.footnote.copy(color = textColor),
                     testTag = "Stream_LinkPreviewDescription",
                 )
                 ComposerLinkPreviewText(
                     text = linkPreview.resolveUrl(),
-                    style = theme.url,
+                    style = typography.footnote.copy(color = textColor),
                     testTag = "Stream_LinkPreviewUrl",
                 )
             }
@@ -143,31 +145,31 @@ public fun ComposerLinkPreview(
 }
 
 @Composable
-private fun ComposerLinkImagePreview(attachment: Attachment) {
+private fun ComposerLinkImagePreview(attachment: Attachment, colors: StreamColors) {
     val imagePreviewUrl = attachment.imagePreviewUrl ?: return
-    val theme = ChatTheme.messageComposerTheme.linkPreview
+    // TODO [G.] point to radii
+    val shape = RoundedCornerShape(8.dp)
     StreamAsyncImage(
         data = imagePreviewUrl,
         modifier = Modifier
-            .size(width = theme.imageSize.width, height = theme.imageSize.height)
-            .clip(theme.imageShape)
-            .border(theme.imageBorder, theme.imageShape)
+            .size(width = 40.dp, height = 40.dp)
+            .clip(shape)
+            .border(1.dp, colors.borderCoreImage, shape)
             .testTag("Stream_LinkPreviewImage"),
         contentDescription = null,
         contentScale = ContentScale.Crop,
     )
 }
 
 @Composable
-private fun ComposerLinkPreviewText(text: String?, style: TextComponentStyle, testTag: String) {
+private fun ComposerLinkPreviewText(text: String?, style: TextStyle, testTag: String) {
     text ?: return
     Text(
         modifier = Modifier.testTag(testTag),
         text = text,
-        style = style.style,
-        color = style.color,
-        maxLines = style.maxLines,
-        overflow = style.overflow,
+        style = style,
+        maxLines = 1,
+        overflow = TextOverflow.Ellipsis,
     )
 }
 

stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/theme/MessageComposerTheme.kt

@@ -16,21 +16,15 @@
 
 package io.getstream.chat.android.compose.ui.theme
 
-import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.isSystemInDarkTheme
-import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.Immutable
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
-import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.SpanStyle
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.style.TextDirection
-import androidx.compose.ui.text.style.TextOverflow
-import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import io.getstream.chat.android.compose.R
 import io.getstream.chat.android.compose.ui.theme.messages.composer.AudioRecordingTheme
@@ -39,16 +33,12 @@ import io.getstream.chat.android.ui.common.feature.messages.composer.mention.Men
 
 /**
  * Represents the theming for the message composer.
- * @param attachmentCancelIcon The theming for the cancel icon used in the message composer.
- * @param linkPreview The theming for the link preview in the message composer.
  * @param inputField The theming for the input field in the message composer.
  * @param actionsTheme The theming for the different composer actions.
  * @param audioRecording The theming for the audio recording in the message composer.
  * @param attachmentsPreview The theming for the attachments preview in the message composer.
  */
 public data class MessageComposerTheme(
-    val attachmentCancelIcon: ComposerCancelIconStyle,
-    val linkPreview: ComposerLinkPreviewTheme,
     val inputField: ComposerInputFieldTheme,
     val actionsTheme: ComposerActionsTheme,
     val audioRecording: AudioRecordingTheme,
@@ -73,8 +63,6 @@ public data class MessageComposerTheme(
             },
         ): MessageComposerTheme {
             return MessageComposerTheme(
-                attachmentCancelIcon = ComposerCancelIconStyle.defaultStyle(colors),
-                linkPreview = ComposerLinkPreviewTheme.defaultTheme(typography, shapes, colors),
                 inputField = ComposerInputFieldTheme.defaultTheme(typography, shapes, colors),
                 actionsTheme = ComposerActionsTheme.defaultTheme(colors),
                 audioRecording = AudioRecordingTheme.defaultTheme(isInDarkMode, typography, colors),
@@ -84,119 +72,6 @@ public data class MessageComposerTheme(
     }
 }
 
-/**
- * Represents the theming for the cancel icon used in the message composer.
- *
- * @param backgroundShape The shape of the background for the cancel icon.
- * @param backgroundColor The background color for the cancel icon.
- * @param border The border for the cancel icon.
- * @param painter The painter for the cancel icon.
- * @param tint The tint color for the cancel icon.
- */
-public data class ComposerCancelIconStyle(
-    val backgroundShape: Shape,
-    val backgroundColor: Color,
-    val border: BorderStroke?,
-    val painter: Painter,
-    val tint: Color,
-) {
-    public companion object {
-
-        /**
-         * Builds the default cancel icon style.
-         *
-         * @return A [ComposerCancelIconStyle] instance holding the default theming.
-         */
-        @Composable
-        public fun defaultStyle(
-            colors: StreamColors = when (isSystemInDarkTheme()) {
-                true -> StreamColors.defaultDarkColors()
-                else -> StreamColors.defaultColors()
-            },
-        ): ComposerCancelIconStyle {
-            return ComposerCancelIconStyle(
-                backgroundShape = CircleShape,
-                backgroundColor = colors.controlRemoveBg,
-                border = BorderStroke(width = 2.dp, color = colors.controlRemoveBorder),
-                painter = painterResource(R.drawable.stream_compose_ic_cross),
-                tint = colors.controlRemoveIcon,
-            )
-        }
-    }
-}
-
-/**
- * Represents the theming for the link preview in the message composer.
- *
- * @param background The background color for the link preview.
- * @param shape The shape of the link preview.
- * @param imageSize The size of the image in the link preview.
- * @param imageShape The shape of the image in the link preview.
- * @param imageBorder The border for the image in the link preview.
- * @param imagePadding The padding for the image in the link preview.
- * @param title The theming for the title in the link preview.
- * @param titleToSubtitle The vertical space between the title and the subtitle in the link preview.
- * @param subtitle The theming for the subtitle in the link preview.
- * @param url The theming for the URL in the link preview.
- * @param cancelIcon The theming for the cancel icon in the link preview.
- */
-public data class ComposerLinkPreviewTheme(
-    val background: Color,
-    val shape: Shape,
-    val imageSize: ComponentSize,
-    val imageShape: Shape,
-    val imageBorder: BorderStroke,
-    val imagePadding: Dp,
-    val title: TextComponentStyle,
-    val titleToSubtitle: Dp,
-    val subtitle: TextComponentStyle,
-    val url: TextComponentStyle,
-    val cancelIcon: ComposerCancelIconStyle,
-) {
-    public companion object {
-
-        @Suppress("DEPRECATION_ERROR")
-        @Composable
-        public fun defaultTheme(
-            typography: StreamTypography = StreamTypography.defaultTypography(),
-            shapes: StreamShapes = StreamShapes.defaultShapes(),
-            colors: StreamColors = when (isSystemInDarkTheme()) {
-                true -> StreamColors.defaultDarkColors()
-                else -> StreamColors.defaultColors()
-            },
-        ): ComposerLinkPreviewTheme {
-            return ComposerLinkPreviewTheme(
-                background = colors.chatBgOutgoing,
-                shape = shapes.attachment,
-                imageSize = ComponentSize(width = 40.dp, height = 40.dp),
-                imageShape = RoundedCornerShape(8.dp),
-                imageBorder = BorderStroke(1.dp, colors.borderCoreImage),
-                imagePadding = 4.dp,
-                title = TextComponentStyle(
-                    color = colors.textHighEmphasis,
-                    style = typography.footnoteBold,
-                    maxLines = 1,
-                    overflow = TextOverflow.Ellipsis,
-                ),
-                titleToSubtitle = 0.dp,
-                subtitle = TextComponentStyle(
-                    color = colors.textHighEmphasis,
-                    style = typography.footnote,
-                    maxLines = 1,
-                    overflow = TextOverflow.Ellipsis,
-                ),
-                url = TextComponentStyle(
-                    color = colors.textHighEmphasis,
-                    style = typography.footnote,
-                    maxLines = 1,
-                    overflow = TextOverflow.Ellipsis,
-                ),
-                cancelIcon = ComposerCancelIconStyle.defaultStyle(colors),
-            )
-        }
-    }
-}
-
 /**
  * Represents the theming for the input field in the message composer.
  *

…at/android/compose/ui/theme/TextStyle.kt …d/compose/ui/theme/TextContainerStyle.ktstream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/theme/TextStyle.kt renamed to stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/theme/TextContainerStyle.kt stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/theme/TextStyle.kt renamed to stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/theme/TextContainerStyle.kt

@@ -18,22 +18,6 @@ package io.getstream.chat.android.compose.ui.theme
 
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.text.style.TextOverflow
-
-/**
- * Represents the styling for the text component.
- *
- * @param color The color of the component.
- * @param style The style of the component.
- * @param maxLines The maximum number of lines the component can have.
- * @param overflow The overflow behavior of the component.
- */
-public data class TextComponentStyle(
-    val color: Color,
-    val style: TextStyle,
-    val maxLines: Int = Int.MAX_VALUE,
-    val overflow: TextOverflow = TextOverflow.Clip,
-)
 
 /**
  * Represents the styling for the text component.