Fix composer command view not Themable (#710)

Author: nuno-vieira

CHANGELOG.md

@@ -6,6 +6,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 ### 🐞 Fixed
 - Use bright color for typing indicator animation in dark mode [#702](https://github.com/GetStream/stream-chat-swiftui/pull/702)
 - Refresh quoted message preview when the quoted message is deleted [#705](https://github.com/GetStream/stream-chat-swiftui/pull/705)
+- Fix composer command view not Themable [#710](https://github.com/GetStream/stream-chat-swiftui/pull/710)
 
 # [4.69.0](https://github.com/GetStream/stream-chat-swiftui/releases/tag/4.69.0)
 _December 18, 2024_

Sources/StreamChatSwiftUI/ChatChannel/Composer/MessageComposerView.swift

@@ -345,13 +345,15 @@ public struct ComposerInputView<Factory: ViewFactory>: View, KeyboardReadable {
                    displayInfo.isInstant == true {
                     HStack(spacing: 0) {
                         Image(uiImage: images.smallBolt)
+                            .renderingMode(.template)
+                            .foregroundColor(Color(colors.staticColorText))
                         Text(displayInfo.displayName.uppercased())
                     }
                     .padding(.horizontal, 8)
                     .font(fonts.footnoteBold)
                     .frame(height: 24)
-                    .background(Color.blue)
-                    .foregroundColor(.white)
+                    .background(colors.tintColor)
+                    .foregroundColor(Color(colors.staticColorText))
                     .cornerRadius(16)
                 }
 

StreamChatSwiftUITests/Tests/ChatChannel/MessageComposerView_Tests.swift

@@ -402,4 +402,41 @@ class MessageComposerView_Tests: StreamChatTestCase {
         // Then
         assertSnapshot(matching: view, as: .image(perceptualPrecision: precision))
     }
+
+    func test_composerInputView_command() {
+        let factory = DefaultViewFactory.shared
+        let size = CGSize(width: defaultScreenSize.width, height: 100)
+
+        let view = ComposerInputView(
+            factory: factory,
+            text: .constant(""),
+            selectedRangeLocation: .constant(0),
+            command: .constant(.init(
+                id: .unique,
+                typingSuggestion: .empty,
+                displayInfo: CommandDisplayInfo(
+                    displayName: "Giphy",
+                    icon: Images().commandGiphy,
+                    format: "",
+                    isInstant: true
+                )
+            )),
+            addedAssets: [],
+            addedFileURLs: [],
+            addedCustomAttachments: [],
+            quotedMessage: .constant(nil),
+            cooldownDuration: 0,
+            onCustomAttachmentTap: { _ in },
+            removeAttachmentWithId: { _ in }
+        )
+        .environmentObject(MessageComposerTestUtils.makeComposerViewModel(chatClient: chatClient))
+        .frame(width: size.width, height: size.height)
+
+        AssertSnapshot(view, variants: .onlyUserInterfaceStyles, size: size)
+
+        // Themed
+        streamChat?.appearance.colors.tintColor = .mint
+        streamChat?.appearance.colors.staticColorText = .black
+        AssertSnapshot(view, variants: .onlyUserInterfaceStyles, size: size, suffix: "themed")
+    }
 }