Add message bubbles

This commit is contained in:
Benoit Martins 2024-02-22 17:46:35 +01:00
parent 3d6888b8ba
commit 4196fed865
9 changed files with 323 additions and 51 deletions

View file

@ -349,9 +349,6 @@
},
"Headphones" : {
},
"Hello, World!" : {
},
"History has been deleted" : {

View file

@ -90,7 +90,7 @@ struct ContentView: View {
Button(action: {
self.index = 0
historyViewModel.displayedCall = nil
conversationsListViewModel.displayedConversation = nil
conversationViewModel.displayedConversation = nil
}, label: {
VStack {
Image("address-book")
@ -134,7 +134,7 @@ struct ContentView: View {
Button(action: {
self.index = 1
contactViewModel.indexDisplayedFriend = nil
conversationsListViewModel.displayedConversation = nil
conversationViewModel.displayedConversation = nil
if historyListViewModel.missedCallsCount > 0 {
historyListViewModel.resetMissedCallsCount()
}
@ -451,7 +451,7 @@ struct ContentView: View {
isShowEditContactFragment: $isShowEditContactFragment
)
} else if self.index == 2 {
ConversationsView(conversationsListViewModel: conversationsListViewModel)
ConversationsView(conversationViewModel: conversationViewModel, conversationsListViewModel: conversationsListViewModel)
}
}
.frame(maxWidth:
@ -483,7 +483,7 @@ struct ContentView: View {
Button(action: {
self.index = 0
historyViewModel.displayedCall = nil
conversationsListViewModel.displayedConversation = nil
conversationViewModel.displayedConversation = nil
}, label: {
VStack {
Image("address-book")
@ -529,7 +529,7 @@ struct ContentView: View {
Button(action: {
self.index = 1
contactViewModel.indexDisplayedFriend = nil
conversationsListViewModel.displayedConversation = nil
conversationViewModel.displayedConversation = nil
if historyListViewModel.missedCallsCount > 0 {
historyListViewModel.resetMissedCallsCount()
}
@ -613,7 +613,7 @@ struct ContentView: View {
}
}
if contactViewModel.indexDisplayedFriend != nil || historyViewModel.displayedCall != nil || conversationsListViewModel.displayedConversation != nil {
if contactViewModel.indexDisplayedFriend != nil || historyViewModel.displayedCall != nil || conversationViewModel.displayedConversation != nil {
HStack(spacing: 0) {
Spacer()
.frame(maxWidth:
@ -878,7 +878,7 @@ struct ContentView: View {
}
}
.onRotate { newOrientation in
if (contactViewModel.indexDisplayedFriend != nil || historyViewModel.displayedCall != nil || conversationsListViewModel.displayedConversation != nil) && searchIsActive {
if (contactViewModel.indexDisplayedFriend != nil || historyViewModel.displayedCall != nil || conversationViewModel.displayedConversation != nil) && searchIsActive {
self.focusedField = false
} else if searchIsActive {
self.focusedField = true

View file

@ -21,12 +21,13 @@ import SwiftUI
struct ConversationsView: View {
@ObservedObject var conversationViewModel: ConversationViewModel
@ObservedObject var conversationsListViewModel: ConversationsListViewModel
var body: some View {
NavigationView {
ZStack(alignment: .bottomTrailing) {
ConversationsFragment(conversationsListViewModel: conversationsListViewModel)
ConversationsFragment(conversationViewModel: conversationViewModel, conversationsListViewModel: conversationsListViewModel)
Button {
} label: {
@ -47,5 +48,9 @@ struct ConversationsView: View {
}
#Preview {
ConversationsListFragment(conversationsListViewModel: ConversationsListViewModel(), showingSheet: .constant(false))
ConversationsListFragment(
conversationViewModel: ConversationViewModel(),
conversationsListViewModel: ConversationsListViewModel(),
showingSheet: .constant(false)
)
}

View file

@ -26,7 +26,29 @@ struct ChatBubbleView: View {
let index: Int
var body: some View {
Text(conversationViewModel.getMessage(index: index))
if index < conversationViewModel.conversationMessagesList.count
&& conversationViewModel.conversationMessagesList[index].eventLog.chatMessage != nil {
HStack {
if conversationViewModel.conversationMessagesList[index].eventLog.chatMessage!.isOutgoing {
Spacer()
}
VStack {
Text(conversationViewModel.conversationMessagesList[index].eventLog.chatMessage!.utf8Text ?? "")
.foregroundStyle(Color.grayMain2c700)
.default_text_style(styleSize: 16)
}
.padding(.all, 15)
.background(conversationViewModel.conversationMessagesList[index].eventLog.chatMessage!.isOutgoing ? Color.orangeMain100 : Color.grayMain2c100)
.clipShape(RoundedRectangle(cornerRadius: 16))
if !conversationViewModel.conversationMessagesList[index].eventLog.chatMessage!.isOutgoing {
Spacer()
}
}
.padding(.leading, conversationViewModel.conversationMessagesList[index].eventLog.chatMessage!.isOutgoing ? 40 : 0)
.padding(.trailing, !conversationViewModel.conversationMessagesList[index].eventLog.chatMessage!.isOutgoing ? 40 : 0)
}
}
}

View file

@ -55,14 +55,14 @@ struct ConversationFragment: View {
.padding(.leading, -10)
.onTapGesture {
withAnimation {
conversationsListViewModel.displayedConversation = nil
conversationViewModel.displayedConversation = nil
}
}
}
let addressFriend =
(conversationsListViewModel.displayedConversation!.participants.first != nil && conversationsListViewModel.displayedConversation!.participants.first!.address != nil)
? contactsManager.getFriendWithAddress(address: conversationsListViewModel.displayedConversation!.participants.first!.address!)
(conversationViewModel.displayedConversation!.participants.first != nil && conversationViewModel.displayedConversation!.participants.first!.address != nil)
? contactsManager.getFriendWithAddress(address: conversationViewModel.displayedConversation!.participants.first!.address!)
: nil
let contactAvatarModel = addressFriend != nil
@ -73,11 +73,11 @@ struct ConversationFragment: View {
})
: ContactAvatarModel(friend: nil, withPresence: false)
if LinphoneUtils.isChatRoomAGroup(chatRoom: conversationsListViewModel.displayedConversation!) {
if LinphoneUtils.isChatRoomAGroup(chatRoom: conversationViewModel.displayedConversation!) {
Image(uiImage: contactsManager.textToImage(
firstName: conversationsListViewModel.displayedConversation!.subject!,
lastName: conversationsListViewModel.displayedConversation!.subject!.components(separatedBy: " ").count > 1
? conversationsListViewModel.displayedConversation!.subject!.components(separatedBy: " ")[1]
firstName: conversationViewModel.displayedConversation!.subject!,
lastName: conversationViewModel.displayedConversation!.subject!.components(separatedBy: " ").count > 1
? conversationViewModel.displayedConversation!.subject!.components(separatedBy: " ")[1]
: ""))
.resizable()
.frame(width: 50, height: 50)
@ -95,13 +95,13 @@ struct ConversationFragment: View {
.padding(.top, 4)
}
} else {
if conversationsListViewModel.displayedConversation!.participants.first != nil
&& conversationsListViewModel.displayedConversation!.participants.first!.address != nil {
if conversationsListViewModel.displayedConversation!.participants.first!.address!.displayName != nil {
if conversationViewModel.displayedConversation!.participants.first != nil
&& conversationViewModel.displayedConversation!.participants.first!.address != nil {
if conversationViewModel.displayedConversation!.participants.first!.address!.displayName != nil {
Image(uiImage: contactsManager.textToImage(
firstName: conversationsListViewModel.displayedConversation!.participants.first!.address!.displayName!,
lastName: conversationsListViewModel.displayedConversation!.participants.first!.address!.displayName!.components(separatedBy: " ").count > 1
? conversationsListViewModel.displayedConversation!.participants.first!.address!.displayName!.components(separatedBy: " ")[1]
firstName: conversationViewModel.displayedConversation!.participants.first!.address!.displayName!,
lastName: conversationViewModel.displayedConversation!.participants.first!.address!.displayName!.components(separatedBy: " ").count > 1
? conversationViewModel.displayedConversation!.participants.first!.address!.displayName!.components(separatedBy: " ")[1]
: ""))
.resizable()
.frame(width: 50, height: 50)
@ -110,9 +110,9 @@ struct ConversationFragment: View {
} else {
Image(uiImage: contactsManager.textToImage(
firstName: conversationsListViewModel.displayedConversation!.participants.first!.address!.username ?? "Username Error",
lastName: conversationsListViewModel.displayedConversation!.participants.first!.address!.username!.components(separatedBy: " ").count > 1
? conversationsListViewModel.displayedConversation!.participants.first!.address!.username!.components(separatedBy: " ")[1]
firstName: conversationViewModel.displayedConversation!.participants.first!.address!.username ?? "Username Error",
lastName: conversationViewModel.displayedConversation!.participants.first!.address!.username!.components(separatedBy: " ").count > 1
? conversationViewModel.displayedConversation!.participants.first!.address!.username!.components(separatedBy: " ")[1]
: ""))
.resizable()
.frame(width: 50, height: 50)
@ -129,8 +129,8 @@ struct ConversationFragment: View {
}
}
if LinphoneUtils.isChatRoomAGroup(chatRoom: conversationsListViewModel.displayedConversation!) {
Text(conversationsListViewModel.displayedConversation!.subject ?? "No Subject")
if LinphoneUtils.isChatRoomAGroup(chatRoom: conversationViewModel.displayedConversation!) {
Text(conversationViewModel.displayedConversation!.subject ?? "No Subject")
.default_text_style(styleSize: 16)
.frame(maxWidth: .infinity, alignment: .leading)
.padding(.top, 4)
@ -142,11 +142,11 @@ struct ConversationFragment: View {
.padding(.top, 4)
.lineLimit(1)
} else {
if conversationsListViewModel.displayedConversation!.participants.first != nil
&& conversationsListViewModel.displayedConversation!.participants.first!.address != nil {
Text(conversationsListViewModel.displayedConversation!.participants.first!.address!.displayName != nil
? conversationsListViewModel.displayedConversation!.participants.first!.address!.displayName!
: conversationsListViewModel.displayedConversation!.participants.first!.address!.username!)
if conversationViewModel.displayedConversation!.participants.first != nil
&& conversationViewModel.displayedConversation!.participants.first!.address != nil {
Text(conversationViewModel.displayedConversation!.participants.first!.address!.displayName != nil
? conversationViewModel.displayedConversation!.participants.first!.address!.displayName!
: conversationViewModel.displayedConversation!.participants.first!.address!.username!)
.default_text_style(styleSize: 16)
.frame(maxWidth: .infinity, alignment: .leading)
.padding(.top, 4)
@ -225,17 +225,118 @@ struct ConversationFragment: View {
.padding(.bottom, 4)
.background(.white)
List {
if conversationsListViewModel.displayedConversation != nil {
ForEach(0..<conversationsListViewModel.displayedConversation!.historyEventsSize, id: \.self) { index in
ChatBubbleView(index: index)
}
ForEach(0..<conversationViewModel.conversationMessagesList.count, id: \.self) { index in
ChatBubbleView(conversationViewModel: conversationViewModel, index: index)
.id(conversationViewModel.conversationMessagesList[index])
.scaleEffect(x: 1, y: -1, anchor: .center)
.listRowInsets(EdgeInsets(top: 2, leading: 10, bottom: 2, trailing: 10))
.listRowSeparator(.hidden)
.transition(.move(edge: .top))
}
}
.scaleEffect(x: 1, y: -1, anchor: .center)
.listStyle(.plain)
.frame(maxWidth: .infinity)
.background(.white)
.onTapGesture {
UIApplication.shared.endEditing()
}
.onDisappear {
conversationViewModel.resetMessage()
}
/*
ScrollViewReader { proxy in
ScrollView {
LazyVStack {
ForEach(0..<conversationViewModel.conversationMessagesList.count, id: \.self) { index in
ChatBubbleView(conversationViewModel: conversationViewModel, index: index)
.id(conversationViewModel.conversationMessagesList[index])
}
}
.frame(maxWidth: .infinity)
.background(.white)
.onTapGesture {
UIApplication.shared.endEditing()
}
.onAppear {
if conversationViewModel.conversationMessagesList.last != nil {
proxy.scrollTo(conversationViewModel.conversationMessagesList.last!, anchor: .bottom)
}
}
.onDisappear {
conversationViewModel.resetMessage()
}
}
}
*/
/*
ScrollViewReader { proxy in
if #available(iOS 17.0, *) {
ScrollView {
LazyVStack {
ForEach(0..<conversationViewModel.conversationMessagesList.count, id: \.self) { index in
ChatBubbleView(conversationViewModel: conversationViewModel, index: index)
.id(conversationViewModel.conversationMessagesList[index])
}
}
.frame(maxWidth: .infinity)
.background(.white)
.onTapGesture {
UIApplication.shared.endEditing()
}
.onAppear {
conversationViewModel.getMessage()
}
.onDisappear {
conversationViewModel.resetMessage()
}
}
.defaultScrollAnchor(.bottom)
} else {
ScrollView {
LazyVStack {
ForEach(0..<conversationViewModel.conversationMessagesList.count, id: \.self) { index in
ChatBubbleView(conversationViewModel: conversationViewModel, index: index)
.id(conversationViewModel.conversationMessagesList[index])
}
}
.frame(maxWidth: .infinity)
.background(.white)
.onTapGesture {
UIApplication.shared.endEditing()
}
.onAppear {
conversationViewModel.getMessage()
if conversationViewModel.conversationMessagesList.last != nil {
DispatchQueue.main.asyncAfter(deadline: .now() + 0.5) {
proxy.scrollTo(conversationViewModel.conversationMessagesList.last!, anchor: .bottom)
}
}
}
.onDisappear {
conversationViewModel.resetMessage()
}
}
}
}
*/
HStack(spacing: 0) {
Button {
@ -315,6 +416,7 @@ struct ConversationFragment: View {
}
} else {
Button {
conversationViewModel.sendMessage()
} label: {
Image("paper-plane-tilt")
.renderingMode(.template)
@ -353,6 +455,12 @@ struct ConversationFragment: View {
.onRotate { newOrientation in
orientation = newOrientation
}
.onAppear {
conversationViewModel.addConversationDelegate()
}
.onDisappear {
conversationViewModel.removeConversationDelegate()
}
}
}
.navigationViewStyle(.stack)

View file

@ -21,6 +21,7 @@ import SwiftUI
struct ConversationsFragment: View {
@ObservedObject var conversationViewModel: ConversationViewModel
@ObservedObject var conversationsListViewModel: ConversationsListViewModel
private var idiom: UIUserInterfaceIdiom { UIDevice.current.userInterfaceIdiom }
@ -30,7 +31,7 @@ struct ConversationsFragment: View {
var body: some View {
ZStack {
if #available(iOS 16.0, *), idiom != .pad {
ConversationsListFragment(conversationsListViewModel: conversationsListViewModel, showingSheet: $showingSheet)
ConversationsListFragment(conversationViewModel: conversationViewModel, conversationsListViewModel: conversationsListViewModel, showingSheet: $showingSheet)
.sheet(isPresented: $showingSheet) {
ConversationsListBottomSheet(
conversationsListViewModel: conversationsListViewModel,
@ -39,7 +40,7 @@ struct ConversationsFragment: View {
.presentationDetents([.fraction(0.4)])
}
} else {
ConversationsListFragment(conversationsListViewModel: conversationsListViewModel, showingSheet: $showingSheet)
ConversationsListFragment(conversationViewModel: conversationViewModel, conversationsListViewModel: conversationsListViewModel, showingSheet: $showingSheet)
.halfSheet(showSheet: $showingSheet) {
ConversationsListBottomSheet(
conversationsListViewModel: conversationsListViewModel,
@ -52,5 +53,5 @@ struct ConversationsFragment: View {
}
#Preview {
ConversationsFragment(conversationsListViewModel: ConversationsListViewModel())
ConversationsFragment(conversationViewModel: ConversationViewModel(), conversationsListViewModel: ConversationsListViewModel())
}

View file

@ -24,6 +24,7 @@ struct ConversationsListFragment: View {
@ObservedObject var contactsManager = ContactsManager.shared
@ObservedObject var conversationViewModel: ConversationViewModel
@ObservedObject var conversationsListViewModel: ConversationsListViewModel
@Binding var showingSheet: Bool
@ -227,7 +228,8 @@ struct ConversationsListFragment: View {
.background(.white)
.onTapGesture {
withAnimation {
conversationsListViewModel.displayedConversation = conversationsListViewModel.conversationsList[index]
conversationViewModel.displayedConversation = conversationsListViewModel.conversationsList[index]
conversationViewModel.getMessage()
}
}
.onLongPressGesture(minimumDuration: 0.2) {
@ -261,5 +263,9 @@ struct ConversationsListFragment: View {
}
#Preview {
ConversationsListFragment(conversationsListViewModel: ConversationsListViewModel(), showingSheet: .constant(false))
ConversationsListFragment(
conversationViewModel: ConversationViewModel(),
conversationsListViewModel: ConversationsListViewModel(),
showingSheet: .constant(false)
)
}

View file

@ -19,21 +19,153 @@
import Foundation
import linphonesw
import Combine
import SwiftUI
class ConversationViewModel: ObservableObject {
private var coreContext = CoreContext.shared
@Published var displayedConversation: ChatRoom?
@Published var messageText: String = ""
private var chatRoomSuscriptions = Set<AnyCancellable?>()
@Published var conversationMessagesList: [LinphoneCustomEventLog] = []
init() {}
func getMessage(index: Int) -> String {
if self.displayedConversation != nil {
return displayedConversation!.getHistoryRangeEvents(begin: index, end: index+1).first?.chatMessage?.utf8Text ?? ""
}
else {
return ""
func addConversationDelegate() {
if displayedConversation != nil {
self.chatRoomSuscriptions.insert(displayedConversation!.publisher?.onChatMessageSent?.postOnMainQueue { (cbValue: (chatRoom: ChatRoom, eventLog: EventLog)) in
self.getNewMessages(eventLogs: [cbValue.eventLog])
})
self.chatRoomSuscriptions.insert(displayedConversation!.publisher?.onChatMessagesReceived?.postOnMainQueue { (cbValue: (chatRoom: ChatRoom, eventLogs: [EventLog])) in
self.getNewMessages(eventLogs: cbValue.eventLogs)
})
}
}
func removeConversationDelegate() {
self.chatRoomSuscriptions.removeAll()
}
func getMessage() {
if self.displayedConversation != nil {
let historyEvents = displayedConversation!.getHistoryRangeEvents(begin: conversationMessagesList.count, end: conversationMessagesList.count + 30)
historyEvents.reversed().forEach { eventLog in
conversationMessagesList.append(LinphoneCustomEventLog(eventLog: eventLog))
}
}
}
func getNewMessages(eventLogs: [EventLog]) {
withAnimation {
eventLogs.forEach { eventLog in
conversationMessagesList.insert(LinphoneCustomEventLog(eventLog: eventLog), at: 0)
//conversationMessagesList.append(LinphoneCustomEventLog(eventLog: eventLog))
}
}
}
func resetMessage() {
conversationMessagesList = []
}
func sendMessage() {
//val messageToReplyTo = chatMessageToReplyTo
//val message = if (messageToReplyTo != null) {
//Log.i("$TAG Sending message as reply to [${messageToReplyTo.messageId}]")
//chatRoom.createReplyMessage(messageToReplyTo)
//} else {
let message = try? self.displayedConversation!.createEmptyMessage()
//}
let toSend = self.messageText.trimmingCharacters(in: .whitespacesAndNewlines)
if !toSend.isEmpty {
if message != nil {
message!.addUtf8TextContent(text: toSend)
}
}
/*
if (isVoiceRecording.value == true && voiceMessageRecorder.file != null) {
stopVoiceRecorder()
val content = voiceMessageRecorder.createContent()
if (content != null) {
Log.i(
"$TAG Voice recording content created, file name is ${content.name} and duration is ${content.fileDuration}"
)
message.addContent(content)
} else {
Log.e("$TAG Voice recording content couldn't be created!")
}
} else {
for (attachment in attachments.value.orEmpty()) {
val content = Factory.instance().createContent()
content.type = when (attachment.mimeType) {
FileUtils.MimeType.Image -> "image"
FileUtils.MimeType.Audio -> "audio"
FileUtils.MimeType.Video -> "video"
FileUtils.MimeType.Pdf -> "application"
FileUtils.MimeType.PlainText -> "text"
else -> "file"
}
content.subtype = if (attachment.mimeType == FileUtils.MimeType.PlainText) {
"plain"
} else {
FileUtils.getExtensionFromFileName(attachment.fileName)
}
content.name = attachment.fileName
// Let the file body handler take care of the upload
content.filePath = attachment.file
message.addFileContent(content)
}
}
*/
if message != nil && !message!.contents.isEmpty {
Log.info("[ConversationViewModel] Sending message")
message!.send()
}
Log.info("[ConversationViewModel] Message sent, re-setting defaults")
self.messageText = ""
/*
isReplying.postValue(false)
isFileAttachmentsListOpen.postValue(false)
isParticipantsListOpen.postValue(false)
isEmojiPickerOpen.postValue(false)
if (::voiceMessageRecorder.isInitialized) {
stopVoiceRecorder()
}
isVoiceRecording.postValue(false)
// Warning: do not delete files
val attachmentsList = arrayListOf<FileModel>()
attachments.postValue(attachmentsList)
chatMessageToReplyTo = null
*/
}
}
struct LinphoneCustomEventLog: Hashable {
var id = UUID()
var eventLog: EventLog
func hash(into hasher: inout Hasher) {
hasher.combine(id)
}
}
extension LinphoneCustomEventLog {
static func ==(lhs: LinphoneCustomEventLog, rhs: LinphoneCustomEventLog) -> Bool {
return lhs.id == rhs.id
}
}

View file

@ -109,6 +109,7 @@ class ConversationsListViewModel: ObservableObject {
self.mCoreSuscriptions.insert(core.publisher?.onMessagesReceived?.postOnMainQueue { _ in
self.computeChatRoomsList(filter: "")
})
}
}