|
| 1 | +--- |
| 2 | +title: Message threads |
| 3 | +--- |
| 4 | + |
| 5 | +## Threads Overview |
| 6 | + |
| 7 | +The SwiftUI SDK supports replying to messages in threads. The default "reply in thread" action opens a new screen, where the message and its replies are shown, in a user interface similar to the message list. Additionally, the composer in this view has a possibility to also send the message in the main channel or group. |
| 8 | + |
| 9 | +## View Customizations |
| 10 | + |
| 11 | +### Changing the Thread Header |
| 12 | + |
| 13 | +The default header shows a static text, implying that you are in a thread. You can easily swap this header with your own implementation. To do this, you need to implement the `makeMessageThreadHeaderViewModifier` method in the `ViewFactory`. Here's how the default implementation looks like: |
| 14 | + |
| 15 | +```swift |
| 16 | +class CustomViewFactory: ViewFactory { |
| 17 | + |
| 18 | + func makeMessageThreadHeaderViewModifier() -> some MessageThreadHeaderViewModifier { |
| 19 | + DefaultMessageThreadHeaderModifier() |
| 20 | + } |
| 21 | + |
| 22 | +} |
| 23 | + |
| 24 | +/// The default message thread header. |
| 25 | +public struct DefaultMessageThreadHeader: ToolbarContent { |
| 26 | + @Injected(\.fonts) private var fonts |
| 27 | + @Injected(\.colors) private var colors |
| 28 | + |
| 29 | + public var body: some ToolbarContent { |
| 30 | + ToolbarItem(placement: .principal) { |
| 31 | + VStack { |
| 32 | + Text(L10n.Message.Actions.threadReply) |
| 33 | + .font(fonts.bodyBold) |
| 34 | + Text(L10n.Message.Threads.subtitle) |
| 35 | + .font(fonts.footnote) |
| 36 | + .foregroundColor(Color(colors.textLowEmphasis)) |
| 37 | + } |
| 38 | + } |
| 39 | + } |
| 40 | +} |
| 41 | + |
| 42 | +/// The default message thread header modifier. |
| 43 | +public struct DefaultMessageThreadHeaderModifier: MessageThreadHeaderViewModifier { |
| 44 | + |
| 45 | + public func body(content: Content) -> some View { |
| 46 | + content.toolbar { |
| 47 | + DefaultMessageThreadHeader() |
| 48 | + } |
| 49 | + } |
| 50 | +} |
| 51 | +``` |
| 52 | + |
| 53 | +### Swapping the SendInChannelView |
| 54 | + |
| 55 | +The default `SendInChannelView` has a checkmark and a text describing the view's action. If needed, you can replace this with your own implementation. To do this, you would need to implement the `makeSendInChannelView`, where you receive the binding of the boolean property indicating whether the checkmark is ticked. Additionally, you receive information whether the message is in a direct message channel or a group. |
| 56 | + |
| 57 | +```swift |
| 58 | +class CustomViewFactory: ViewFactory { |
| 59 | + func makeSendInChannelView( |
| 60 | + showReplyInChannel: Binding<Bool>, |
| 61 | + isDirectMessage: Bool |
| 62 | + ) -> some View { |
| 63 | + CustomSendInChannelView( |
| 64 | + sendInChannel: showReplyInChannel, |
| 65 | + isDirectMessage: isDirectMessage |
| 66 | + ) |
| 67 | + } |
| 68 | +} |
| 69 | +``` |
| 70 | + |
| 71 | +### Swapping the Message Threads View |
| 72 | + |
| 73 | +If you don't prefer the message threads to look similarly to the message list, you can completely swap the message thread destination. In order to do this, you would need to implement the `makeMessageThreadDestination` method in the `ViewFactory`. In this method, you will need to return a closure that makes the thread destination. In the closure, the chat channel and message are provided, to identify the correct message thread. |
| 74 | + |
| 75 | +```swift |
| 76 | +class CustomViewFactory: ViewFactory { |
| 77 | + public func makeMessageThreadDestination() -> (ChatChannel, ChatMessage) -> ChatChannelView<Self> { |
| 78 | + { [unowned self] channel, message in |
| 79 | + let channelController = chatClient.channelController( |
| 80 | + for: channel.cid, |
| 81 | + messageOrdering: .topToBottom |
| 82 | + ) |
| 83 | + let messageController = chatClient.messageController( |
| 84 | + cid: channel.cid, |
| 85 | + messageId: message.id |
| 86 | + ) |
| 87 | + return CustomChatChannelView( |
| 88 | + viewFactory: self, |
| 89 | + channelController: channelController, |
| 90 | + messageController: messageController |
| 91 | + ) |
| 92 | + } |
| 93 | + } |
| 94 | +} |
| 95 | +``` |
| 96 | + |
0 commit comments