Align video attachments' bubble corner radius and corner shape with image attachments (#1260)

Author: testableapple

CHANGELOG.md

@@ -6,6 +6,9 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 ### ✅ Added
 - `AddedAsset` now has `originalWidth`, `originalHeight`, and `duration` (videos), set at selection time and passed into image/video attachment payloads for custom CDN uploads [#1255](https://github.com/GetStream/stream-chat-swiftui/pull/1255)
 
+### 🐞 Fixed
+- Align video attachments' bubble corner radius and corner shape with image attachments [#1260](https://github.com/GetStream/stream-chat-swiftui/pull/1260)
+
 # [4.98.0](https://github.com/GetStream/stream-chat-swiftui/releases/tag/4.98.0)
 _February 26, 2026_
 

Sources/StreamChatSwiftUI/ChatChannel/MessageList/VideoAttachmentView.swift

@@ -10,44 +10,37 @@ public struct VideoAttachmentsContainer<Factory: ViewFactory>: View {
     var factory: Factory
     let message: ChatMessage
     let width: CGFloat
+    let isFirst: Bool
     @Binding var scrolledId: String?
 
     public init(
         factory: Factory,
         message: ChatMessage,
         width: CGFloat,
+        isFirst: Bool = true,
         scrolledId: Binding<String?>
     ) {
         self.factory = factory
         self.message = message
         self.width = width
+        self.isFirst = isFirst
         _scrolledId = scrolledId
     }
 
     public var body: some View {
         VStack(spacing: 0) {
             if let quotedMessage = message.quotedMessage {
-                VStack {
-                    factory.makeQuotedMessageView(
-                        quotedMessage: quotedMessage,
-                        fillAvailableSpace: !message.attachmentCounts.isEmpty,
-                        isInComposer: false,
-                        scrolledId: $scrolledId
-                    )
-
-                    VideoAttachmentsList(
-                        factory: factory,
-                        message: message,
-                        width: width
-                    )
-                }
-                .modifier(
-                    factory.makeMessageViewModifier(
-                        for: MessageModifierInfo(
-                            message: message,
-                            isFirst: false
-                        )
-                    )
+                factory.makeQuotedMessageView(
+                    quotedMessage: quotedMessage,
+                    fillAvailableSpace: !message.attachmentCounts.isEmpty,
+                    isInComposer: false,
+                    scrolledId: $scrolledId
+                )
+
+                VideoAttachmentsList(
+                    factory: factory,
+                    message: message,
+                    width: width
                 )
             } else {
                 VideoAttachmentsList(
@@ -62,17 +55,14 @@ public struct VideoAttachmentsContainer<Factory: ViewFactory>: View {
                     .frame(width: width)
             }
         }
-        .if(!message.text.isEmpty, transform: { view in
-            view.modifier(
-                factory.makeMessageViewModifier(
-                    for: MessageModifierInfo(
-                        message: message,
-                        isFirst: true,
-                        cornerRadius: 24
-                    )
+        .modifier(
+            factory.makeMessageViewModifier(
+                for: MessageModifierInfo(
+                    message: message,
+                    isFirst: isFirst
                 )
             )
-        })
+        )
         .accessibilityIdentifier("VideoAttachmentsContainer")
     }
 }
@@ -116,15 +106,15 @@ public struct VideoAttachmentView<Factory: ViewFactory>: View {
     let message: ChatMessage
     let width: CGFloat
     var ratio: CGFloat = 0.75
-    var cornerRadius: CGFloat = 24
+    var cornerRadius: CGFloat = 18
 
     public init(
         factory: Factory = DefaultViewFactory.shared,
         attachment: ChatMessageVideoAttachment,
         message: ChatMessage,
         width: CGFloat,
         ratio: CGFloat = 0.75,
-        cornerRadius: CGFloat = 24
+        cornerRadius: CGFloat = 18
     ) {
         self.factory = factory
         self.attachment = attachment
@@ -164,7 +154,7 @@ struct VideoAttachmentContentView<Factory: ViewFactory>: View {
     let message: ChatMessage
     let width: CGFloat
     var ratio: CGFloat = 0.75
-    var cornerRadius: CGFloat = 24
+    var cornerRadius: CGFloat = 18
 
     @State var previewImage: UIImage?
     @State var error: Error?
@@ -176,6 +166,7 @@ struct VideoAttachmentContentView<Factory: ViewFactory>: View {
                 Image(uiImage: previewImage)
                     .resizable()
                     .scaledToFill()
+                    .frame(width: width, height: width * ratio)
                     .clipped()
                     .allowsHitTesting(false)
                     .accessibilityHidden(true)
@@ -204,7 +195,6 @@ struct VideoAttachmentContentView<Factory: ViewFactory>: View {
             }
         }
         .frame(width: width, height: width * ratio)
-        .cornerRadius(cornerRadius)
         .fullScreenCover(isPresented: $fullScreenShown) {
             factory.makeVideoPlayerView(
                 attachment: attachment,

Sources/StreamChatSwiftUI/DefaultViewFactory.swift

@@ -451,6 +451,7 @@ extension ViewFactory {
             factory: self,
             message: message,
             width: availableWidth,
+            isFirst: isFirst,
             scrolledId: scrolledId
         )
     }

StreamChatSwiftUITests/Tests/ChatChannel/MessageContainerView_Tests.swift

@@ -196,21 +196,24 @@ class MessageContainerView_Tests: StreamChatTestCase {
 
     func test_videoAttachment_snapshotNoText() {
         // Given
-        let attachment = ChatChannelTestHelpers.videoAttachment
         let message = ChatMessage.mock(
             id: .unique,
             cid: .unique,
             text: "",
-            author: .mock(id: .unique)
+            author: .mock(id: .unique),
+            attachments: ChatChannelTestHelpers.videoAttachments
         )
 
         // When
-        let view = VideoAttachmentView(
-            attachment: attachment,
+        let view = VideoAttachmentsContainer(
+            factory: DefaultViewFactory.shared,
             message: message,
-            width: 2 * defaultScreenSize.width / 3
+            width: 2 * defaultScreenSize.width / 3,
+            isFirst: true,
+            scrolledId: .constant(nil)
         )
-        .applyDefaultSize()
+        .frame(width: 200)
+        .padding()
 
         // Then
         assertSnapshot(matching: view, as: .image(perceptualPrecision: precision))
@@ -231,6 +234,57 @@ class MessageContainerView_Tests: StreamChatTestCase {
             factory: DefaultViewFactory.shared,
             message: message,
             width: 2 * defaultScreenSize.width / 3,
+            isFirst: true,
+            scrolledId: .constant(nil)
+        )
+        .frame(width: 200)
+        .padding()
+
+        // Then
+        assertSnapshot(matching: view, as: .image(perceptualPrecision: precision))
+    }
+
+    func test_videoAttachmentsContainer_isFirstFalse_snapshot() {
+        // Given
+        let message = ChatMessage.mock(
+            id: .unique,
+            cid: .unique,
+            text: "Test message",
+            author: .mock(id: .unique),
+            attachments: ChatChannelTestHelpers.videoAttachments
+        )
+
+        // When
+        let view = VideoAttachmentsContainer(
+            factory: DefaultViewFactory.shared,
+            message: message,
+            width: 2 * defaultScreenSize.width / 3,
+            isFirst: false,
+            scrolledId: .constant(nil)
+        )
+        .frame(width: 200)
+        .padding()
+
+        // Then
+        assertSnapshot(matching: view, as: .image(perceptualPrecision: precision))
+    }
+
+    func test_videoAttachment_noText_isFirstFalse_snapshot() {
+        // Given
+        let message = ChatMessage.mock(
+            id: .unique,
+            cid: .unique,
+            text: "",
+            author: .mock(id: .unique),
+            attachments: ChatChannelTestHelpers.videoAttachments
+        )
+
+        // When
+        let view = VideoAttachmentsContainer(
+            factory: DefaultViewFactory.shared,
+            message: message,
+            width: 2 * defaultScreenSize.width / 3,
+            isFirst: false,
             scrolledId: .constant(nil)
         )
         .frame(width: 200)
@@ -625,20 +679,22 @@ class MessageContainerView_Tests: StreamChatTestCase {
         message: ChatMessage,
         channel: ChatChannel? = nil,
         messageViewModel: MessageViewModel? = nil,
-        highlightedMessageId: String? = nil
+        highlightedMessageId: String? = nil,
+        showsAllInfo: Bool = true
     ) -> some View {
-        MessageContainerView(
+        let channelOrMock = channel ?? .mockDMChannel()
+        return MessageContainerView(
             factory: DefaultViewFactory.shared,
-            channel: channel ?? .mockDMChannel(),
+            channel: channelOrMock,
             message: message,
             width: defaultScreenSize.width,
-            showsAllInfo: true,
+            showsAllInfo: showsAllInfo,
             isInThread: false,
             isLast: false,
             scrolledId: .constant(nil),
             quotedMessage: .constant(nil),
             onLongPress: { _ in },
-            viewModel: messageViewModel ?? MessageViewModel(message: message, channel: channel)
+            viewModel: messageViewModel ?? MessageViewModel(message: message, channel: channelOrMock)
         )
         .environment(\.highlightedMessageId, highlightedMessageId)
         .frame(width: 375, height: 200)