Show translated text for participant messages

CHANGELOG.md

@@ -7,11 +7,14 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 - Feature rich markdown rendering with AttributedString [#757](https://github.com/GetStream/stream-chat-swiftui/pull/757)
 - Add `Fonts.title2` for supporting markdown headers [#757](https://github.com/GetStream/stream-chat-swiftui/pull/757)
 - Add `resignsFirstResponderOnScrollDown` to `MessageListConfig` [#769](https://github.com/GetStream/stream-chat-swiftui/pull/769)
+- Show auto-translated message translations ([learn more](https://getstream.io/chat/docs/ios-swift/translation/#enabling-automatic-translation)) [#776](https://github.com/GetStream/stream-chat-swiftui/pull/776)
 ### 🔄 Changed
 - Uploading a HEIC photo from the library is now converted to JPEG for better compatibility [#767](https://github.com/GetStream/stream-chat-swiftui/pull/767)
 - Customizing the message avatar view is reflected in all views that use it [#772](https://github.com/GetStream/stream-chat-swiftui/pull/772)
 - Made the sendMessage method in MessageComposerViewModel open [#779](https://github.com/GetStream/stream-chat-swiftui/pull/779)
 - Move `ChangeBarsVisibilityModifier` into `ViewFactory` for better customization [#774](https://github.com/GetStream/stream-chat-swiftui/pull/774)
+### 🎭 New Localizations
+- `message.translatedTo` [#776](https://github.com/GetStream/stream-chat-swiftui/pull/776)
 
 # [4.73.0](https://github.com/GetStream/stream-chat-swiftui/releases/tag/4.73.0)
 _February 28, 2025_

DemoAppSwiftUI/AppConfiguration/AppConfiguration.swift

@@ -0,0 +1,14 @@
+//
+// Copyright © 2025 Stream.io Inc. All rights reserved.
+//
+
+import Foundation
+import StreamChat
+import StreamChatSwiftUI
+
+final class AppConfiguration {
+    static let `default` = AppConfiguration()
+
+    /// The translation language to set on connect.
+    var translationLanguage: TranslationLanguage?
+}

DemoAppSwiftUI/AppConfiguration/AppConfigurationTranslationView.swift

@@ -0,0 +1,47 @@
+//
+// Copyright © 2025 Stream.io Inc. All rights reserved.
+//
+
+import StreamChat
+import SwiftUI
+
+struct AppConfigurationTranslationView: View {
+    @Environment(\.dismiss) var dismiss
+
+    var selection: Binding<TranslationLanguage?> = Binding {
+        AppConfiguration.default.translationLanguage
+    } set: { newValue in
+        AppConfiguration.default.translationLanguage = newValue
+    }
+
+    var body: some View {
+        List {
+            ForEach(TranslationLanguage.all, id: \.languageCode) { language in
+                Button(action: {
+                    selection.wrappedValue = language
+                    dismiss()
+                }) {
+                    HStack {
+                        Text(language.languageCode)
+                        Spacer()
+                        if selection.wrappedValue == language {
+                            Image(systemName: "checkmark")
+                        }
+                    }
+                }
+                .foregroundStyle(.primary)
+            }
+            .navigationTitle("Translation Language")
+        }
+    }
+}
+
+extension TranslationLanguage {
+    static let all = allCases.sorted(by: { $0.languageCode < $1.languageCode })
+}
+
+#Preview {
+    NavigationView {
+        AppConfigurationTranslationView()
+    }
+}

DemoAppSwiftUI/AppConfiguration/AppConfigurationView.swift

@@ -0,0 +1,26 @@
+//
+// Copyright © 2025 Stream.io Inc. All rights reserved.
+//
+
+import Combine
+import SwiftUI
+
+struct AppConfigurationView: View {
+    var body: some View {
+        NavigationView {
+            List {
+                Section("Connect User Configuration") {
+                    NavigationLink("Translation") {
+                        AppConfigurationTranslationView()
+                    }
+                }
+            }
+            .navigationBarTitleDisplayMode(.inline)
+            .navigationTitle("App Configuration")
+        }
+    }
+}
+
+#Preview {
+    AppConfigurationView()
+}

DemoAppSwiftUI/AppDelegate.swift

@@ -81,7 +81,8 @@ class AppDelegate: NSObject, UIApplicationDelegate {
                 userInfo: .init(
                     id: credentials.id,
                     name: credentials.name,
-                    imageURL: credentials.avatarURL
+                    imageURL: credentials.avatarURL,
+                    language: AppConfiguration.default.translationLanguage
                 ),
                 token: token
             )

DemoAppSwiftUI/LoginView.swift

@@ -20,6 +20,11 @@ struct LoginView: View {
             Text("Welcome to Stream Chat")
                 .font(.title)
                 .padding(.all, 8)
+
+            Button("Configuration") {
+                viewModel.showsConfiguration = true
+            }
+            .buttonStyle(.borderedProminent)
 
             Text("Select a user to try the iOS SDK:")
                 .font(.body)
@@ -42,6 +47,9 @@ struct LoginView: View {
         .overlay(
             viewModel.loading ? ProgressView() : nil
         )
+        .sheet(isPresented: $viewModel.showsConfiguration) {
+            AppConfigurationView()
+        }
     }
 }
 

DemoAppSwiftUI/LoginViewModel.swift

@@ -10,6 +10,7 @@ class LoginViewModel: ObservableObject {
 
     @Published var demoUsers = UserCredentials.builtInUsers
     @Published var loading = false
+    @Published var showsConfiguration = false
 
     @Injected(\.chatClient) var chatClient
 
@@ -28,7 +29,12 @@ class LoginViewModel: ObservableObject {
         LogConfig.level = .warning
 
         chatClient.connectUser(
-            userInfo: .init(id: credentials.id, name: credentials.name, imageURL: credentials.avatarURL),
+            userInfo: .init(
+                id: credentials.id,
+                name: credentials.name,
+                imageURL: credentials.avatarURL,
+                language: AppConfiguration.default.translationLanguage
+            ),
             token: token
         ) { [weak self] error in
             if let error = error {

Sources/StreamChatSwiftUI/ChatChannel/ChannelInfo/PinnedMessagesView.swift

@@ -101,6 +101,6 @@ struct PinnedMessageView<Factory: ViewFactory>: View {
             return "📊 \(L10n.Channel.Item.poll)"
         }
         let messageFormatter = InjectedValues[\.utils].messagePreviewFormatter
-        return messageFormatter.formatAttachmentContent(for: message) ?? message.adjustedText
+        return messageFormatter.formatAttachmentContent(for: message, in: channel) ?? message.adjustedText
     }
 }

Sources/StreamChatSwiftUI/ChatChannel/Composer/MessageComposerView.swift

@@ -300,6 +300,7 @@ public struct ComposerInputView<Factory: ViewFactory>: View, KeyboardReadable {
                     isInComposer: true,
                     scrolledId: .constant(nil)
                 )
+                .environment(\.channelTranslationLanguage, viewModel.channelController.channel?.membership?.language)
             }
 
             if !addedAssets.isEmpty {

Sources/StreamChatSwiftUI/ChatChannel/MessageList/MessageContainerView.swift

@@ -7,7 +7,8 @@ import StreamChat
 import SwiftUI
 
 public struct MessageContainerView<Factory: ViewFactory>: View {
-
+    @Environment(\.channelTranslationLanguage) var translationLanguage
+
     @Injected(\.fonts) private var fonts
     @Injected(\.colors) private var colors
     @Injected(\.images) private var images
@@ -225,6 +226,12 @@ public struct MessageContainerView<Factory: ViewFactory>: View {
                         }
                     }
 
+                    if message.textContent(for: translationLanguage) != nil,
+                       let localizedName = translationLanguage?.localizedName {
+                        Text(L10n.Message.translatedTo(localizedName))
+                            .font(fonts.footnote)
+                            .foregroundColor(Color(colors.subtitleText))
+                    }
                     if showsAllInfo && !message.isDeleted {
                         if message.isSentByCurrentUser && channel.config.readEventsEnabled {
                             HStack(spacing: 4) {

Sources/StreamChatSwiftUI/ChatChannel/MessageList/MessageListView.swift

@@ -148,6 +148,7 @@ public struct MessageListView<Factory: ViewFactory>: View, KeyboardReadable {
                                 onLongPress: handleLongPress(messageDisplayInfo:),
                                 isLast: !showsLastInGroupInfo && message == messages.last
                             )
+                            .environment(\.channelTranslationLanguage, channel.membership?.language)
                             .onAppear {
                                 if index == nil {
                                     index = messageListDateUtils.index(for: message, in: messages)
@@ -597,3 +598,18 @@ private class MessageRenderingUtil {
         return skipRendering
     }
 }
+
+private struct ChannelTranslationLanguageKey: EnvironmentKey {
+    static let defaultValue: TranslationLanguage? = nil
+}
+
+extension EnvironmentValues {
+    var channelTranslationLanguage: TranslationLanguage? {
+        get {
+            self[ChannelTranslationLanguageKey.self]
+        }
+        set {
+            self[ChannelTranslationLanguageKey.self] = newValue
+        }
+    }
+}

Sources/StreamChatSwiftUI/ChatChannel/MessageList/MessageView.swift

@@ -251,6 +251,7 @@ struct StreamTextView: View {
 @available(iOS 15, *)
 public struct LinkDetectionTextView: View {
     @Environment(\.layoutDirection) var layoutDirection
+    @Environment(\.channelTranslationLanguage) var translationLanguage
 
     @Injected(\.colors) var colors
     @Injected(\.fonts) var fonts
@@ -292,8 +293,12 @@ public struct LinkDetectionTextView: View {
     }
 
     private func attributedString(for message: ChatMessage) -> AttributedString {
-        let text = message.adjustedText
+        var text = message.adjustedText
 
+        // Translation
+        if let translatedText = message.textContent(for: translationLanguage) {
+            text = translatedText
+        }
         // Markdown
         let attributes = AttributeContainer()
             .foregroundColor(textColor(for: message))

Sources/StreamChatSwiftUI/ChatChannel/MessageList/QuotedMessageView.swift

@@ -56,6 +56,7 @@ struct QuotedMessageViewContainer<Factory: ViewFactory>: View {
 
 /// View for the quoted message.
 public struct QuotedMessageView<Factory: ViewFactory>: View {
+    @Environment(\.channelTranslationLanguage) var translationLanguage
 
     @Injected(\.images) private var images
     @Injected(\.fonts) private var fonts
@@ -178,7 +179,9 @@ public struct QuotedMessageView<Factory: ViewFactory>: View {
     }
 
     private var textForMessage: String {
-        let textContent = quotedMessage.textContent ?? ""
+        let translatedTextContent = quotedMessage.textContent(for: translationLanguage)
+        let textContent = translatedTextContent ?? quotedMessage.textContent ?? ""
+
         if !textContent.isEmpty {
             return textContent
         }

Sources/StreamChatSwiftUI/ChatChannelList/ChatChannelListItem.swift

@@ -286,13 +286,13 @@ extension ChatChannel {
     public var previewMessageText: String? {
         guard let previewMessage else { return nil }
         let messageFormatter = InjectedValues[\.utils].messagePreviewFormatter
-        return messageFormatter.format(previewMessage)
+        return messageFormatter.format(previewMessage, in: self)
     }
 
     public var lastMessageText: String? {
         guard let latestMessage = latestMessages.first else { return nil }
         let messageFormatter = InjectedValues[\.utils].messagePreviewFormatter
-        return messageFormatter.format(latestMessage)
+        return messageFormatter.format(latestMessage, in: self)
     }
 
     public var shouldShowTypingIndicator: Bool {

Sources/StreamChatSwiftUI/ChatChannelList/SearchResultsView.swift

@@ -169,7 +169,7 @@ struct SearchResultItem<Factory: ViewFactory, ChannelDestination: View>: View {
             guard let previewMessage = searchResult.message else {
                 return L10n.Channel.Item.emptyMessages
             }
-            return utils.messagePreviewFormatter.format(previewMessage)
+            return utils.messagePreviewFormatter.format(previewMessage, in: searchResult.channel)
         case .messages:
             return searchResult.message?.text ?? ""
         default:

Sources/StreamChatSwiftUI/ChatThreadList/ChatThreadListItem.swift

@@ -51,7 +51,7 @@ public struct ChatThreadListItemViewModel {
             parentMessageText = threadTitle
         } else {
             let formatter = InjectedValues[\.utils].messagePreviewFormatter
-            parentMessageText = formatter.formatContent(for: thread.parentMessage)
+            parentMessageText = formatter.formatContent(for: thread.parentMessage, in: thread.channel)
         }
         return L10n.Thread.Item.repliedTo(parentMessageText.trimmed)
     }
@@ -67,7 +67,7 @@ public struct ChatThreadListItemViewModel {
         }
 
         let formatter = InjectedValues[\.utils].messagePreviewFormatter
-        return formatter.format(latestReply)
+        return formatter.format(latestReply, in: thread.channel)
     }
 
     /// The formatted latest reply timestamp.

Sources/StreamChatSwiftUI/Generated/L10n.swift

@@ -352,6 +352,10 @@ internal enum L10n {
     internal static var deletedMessagePlaceholder: String { L10n.tr("Localizable", "message.deleted-message-placeholder") }
     /// Only visible to you
     internal static var onlyVisibleToYou: String { L10n.tr("Localizable", "message.only-visible-to-you") }
+    /// Translated to %@
+    internal static func translatedTo(_ p1: Any) -> String {
+      return L10n.tr("Localizable", "message.translatedTo", String(describing: p1))
+    }
     internal enum Actions {
       /// Copy Message
       internal static var copy: String { L10n.tr("Localizable", "message.actions.copy") }

Sources/StreamChatSwiftUI/Resources/en.lproj/Localizable.strings

@@ -89,6 +89,8 @@
 "message.polls.unknown-vote-author" = "Anonymous";
 "message.polls.votes" = "%d votes";
 
+"message.translatedTo" = "Translated to %@";
+
 "alert.actions.cancel" = "Cancel";
 "alert.actions.delete" = "Delete";
 "alert.actions.end" = "End";

Sources/StreamChatSwiftUI/Utils/Common/ChatMessage+Extensions.swift

@@ -46,6 +46,12 @@ public extension ChatMessage {
 
         return isDeleted ? L10n.Message.deletedMessagePlaceholder : adjustedText
     }
+
+    func textContent(for translationLanguage: TranslationLanguage?) -> String? {
+        guard let translationLanguage else { return nil }
+        guard !isSentByCurrentUser, !isDeleted else { return nil }
+        return translatedText(for: translationLanguage)
+    }
 
     /// A boolean value that checks if the message is visible for current user only.
     var isOnlyVisibleForCurrentUser: Bool {
@@ -95,3 +101,9 @@ public extension ChatMessage {
         return isSentByCurrentUser
     }
 }
+
+extension TranslationLanguage {
+    var localizedName: String? {
+        Locale.current.localizedString(forLanguageCode: languageCode)
+    }
+}

Sources/StreamChatSwiftUI/Utils/MessagePreviewFormatter.swift

@@ -13,33 +13,33 @@ struct MessagePreviewFormatter {
     init() {}
 
     /// Formats the message including the author's name.
-    func format(_ previewMessage: ChatMessage) -> String {
+    func format(_ previewMessage: ChatMessage, in channel: ChatChannel) -> String {
         if let poll = previewMessage.poll {
             return formatPoll(poll)
         }
-        return "\(previewMessage.author.name ?? previewMessage.author.id): \(formatContent(for: previewMessage))"
+        return "\(previewMessage.author.name ?? previewMessage.author.id): \(formatContent(for: previewMessage, in: channel))"
     }
 
     /// Formats only the content of the message without the author's name.
-    func formatContent(for previewMessage: ChatMessage) -> String {
-        if let attachmentPreviewText = formatAttachmentContent(for: previewMessage) {
+    func formatContent(for previewMessage: ChatMessage, in channel: ChatChannel) -> String {
+        if let attachmentPreviewText = formatAttachmentContent(for: previewMessage, in: channel) {
             return attachmentPreviewText
         }
-        if let textContent = previewMessage.textContent, !textContent.isEmpty {
+        if let textContent = previewMessage.textContent(for: channel.membership?.language), !textContent.isEmpty {
             return textContent
         }
         return previewMessage.adjustedText
     }
 
     /// Formats only the attachment content of the message in case it contains attachments.
-    func formatAttachmentContent(for previewMessage: ChatMessage) -> String? {
+    func formatAttachmentContent(for previewMessage: ChatMessage, in channel: ChatChannel) -> String? {
         if let poll = previewMessage.poll {
             return "📊 \(poll.name)"
         }
         guard let attachment = previewMessage.allAttachments.first, !previewMessage.isDeleted else {
             return nil
         }
-        let text = previewMessage.textContent ?? previewMessage.text
+        let text = previewMessage.textContent(for: channel.membership?.language) ?? previewMessage.text
         switch attachment.type {
         case .audio:
             let defaultAudioText = L10n.Channel.Item.audio