Skip to content

Commit 48a3804

Browse files
added docs for message threads
1 parent be308eb commit 48a3804

File tree

2 files changed

+98
-1
lines changed

2 files changed

+98
-1
lines changed
Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
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+

docusaurus/sidebars-ios.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,8 @@
6262
"swiftui/components/channel-header",
6363
"swiftui/components/attachments",
6464
"swiftui/components/message-composer",
65-
"swiftui/components/message-reactions"
65+
"swiftui/components/message-reactions",
66+
"swiftui/components/message-threads"
6667
]
6768
}
6869
]

0 commit comments

Comments
 (0)