2024-07-22 21:07:44 +02:00
|
|
|
import * as React from "bloatless-react";
|
|
|
|
|
|
2026-04-06 20:47:49 +00:00
|
|
|
import {
|
|
|
|
|
ChatMessage,
|
|
|
|
|
ChatMessageReaction,
|
2026-04-07 18:39:55 +00:00
|
|
|
ReactionSymbols,
|
2026-04-06 20:47:49 +00:00
|
|
|
} from "../../Model/Chat/chatModel";
|
2024-07-22 21:07:44 +02:00
|
|
|
import ChatMessageViewModel from "../Chat/chatMessageViewModel";
|
|
|
|
|
import ChatViewModel from "../Chat/chatViewModel";
|
2024-07-25 16:02:49 +02:00
|
|
|
import CoreViewModel from "../Global/coreViewModel";
|
2024-07-22 21:07:44 +02:00
|
|
|
|
|
|
|
|
export default class MessagePageViewModel {
|
2026-04-01 08:29:39 +00:00
|
|
|
// state
|
|
|
|
|
chatMessageViewModels: React.MapState<ChatMessageViewModel> =
|
|
|
|
|
new React.MapState();
|
|
|
|
|
composingMessage: React.State<string> = new React.State("");
|
2024-07-22 21:07:44 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
// guards
|
|
|
|
|
cannotSendMessage: React.State<boolean>;
|
2024-07-22 21:07:44 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
// methods
|
|
|
|
|
sendMessage = (): void => {
|
|
|
|
|
if (this.cannotSendMessage.value == true) return;
|
2024-07-22 21:07:44 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
this.sendMessageFromBody(this.composingMessage.value);
|
|
|
|
|
this.composingMessage.value = "";
|
|
|
|
|
};
|
2024-07-22 21:07:44 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
sendMessageFromBody = (body: string): void => {
|
|
|
|
|
this.chatViewModel.chatModel.sendMessage(body);
|
|
|
|
|
};
|
2024-07-22 21:07:44 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
decryptMessage = async (
|
|
|
|
|
messageViewModel: ChatMessageViewModel,
|
|
|
|
|
): Promise<void> => {
|
|
|
|
|
const chatMessage: ChatMessage = messageViewModel.chatMessage;
|
|
|
|
|
await this.chatViewModel.chatModel.decryptMessage(chatMessage);
|
|
|
|
|
this.chatViewModel.chatModel.addMessage(chatMessage);
|
|
|
|
|
messageViewModel.loadData();
|
|
|
|
|
};
|
2024-07-22 21:07:44 +02:00
|
|
|
|
2026-04-08 20:31:25 +00:00
|
|
|
sendReaction = (
|
|
|
|
|
messageId: string,
|
|
|
|
|
content: ReactionSymbols,
|
|
|
|
|
isDeleting: boolean,
|
|
|
|
|
): void => {
|
|
|
|
|
this.chatViewModel.chatModel.sendReaction(
|
|
|
|
|
messageId,
|
|
|
|
|
content,
|
|
|
|
|
isDeleting,
|
|
|
|
|
);
|
2026-04-06 20:47:49 +00:00
|
|
|
};
|
|
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
// view
|
|
|
|
|
showChatMessage = (chatMessage: ChatMessage): void => {
|
|
|
|
|
const chatMessageViewModel = new ChatMessageViewModel(
|
|
|
|
|
this.coreViewModel,
|
|
|
|
|
this,
|
|
|
|
|
chatMessage,
|
|
|
|
|
chatMessage.sender ==
|
|
|
|
|
this.chatViewModel.settingsViewModel.username.value,
|
|
|
|
|
);
|
2024-07-23 00:25:28 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
const existingChatMessageViewModel: ChatMessageViewModel | undefined =
|
|
|
|
|
this.chatMessageViewModels.value.get(chatMessage.id);
|
|
|
|
|
if (existingChatMessageViewModel != undefined) {
|
|
|
|
|
existingChatMessageViewModel.body.value = chatMessage.body;
|
|
|
|
|
existingChatMessageViewModel.status.value = chatMessage.status;
|
|
|
|
|
} else {
|
|
|
|
|
this.chatMessageViewModels.set(
|
|
|
|
|
chatMessage.id,
|
|
|
|
|
chatMessageViewModel,
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
};
|
2024-07-23 00:25:28 +02:00
|
|
|
|
2026-04-07 18:48:01 +00:00
|
|
|
handleReaction = (reaction: ChatMessageReaction): void => {
|
2026-04-06 20:47:49 +00:00
|
|
|
const messageViewModel: ChatMessageViewModel | undefined =
|
|
|
|
|
this.chatMessageViewModels.value.get(reaction.messageId);
|
|
|
|
|
if (messageViewModel == undefined) return;
|
2026-04-07 18:48:01 +00:00
|
|
|
messageViewModel.handleReaction(reaction);
|
2026-04-06 20:47:49 +00:00
|
|
|
};
|
|
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
// load
|
|
|
|
|
loadData = (): void => {
|
|
|
|
|
this.chatMessageViewModels.clear();
|
|
|
|
|
for (const chatMessage of this.chatViewModel.chatModel.messages) {
|
|
|
|
|
this.showChatMessage(chatMessage);
|
|
|
|
|
}
|
2026-04-06 20:47:49 +00:00
|
|
|
for (const reaction of this.chatViewModel.chatModel.reactions) {
|
2026-04-07 18:48:01 +00:00
|
|
|
this.handleReaction(reaction);
|
2026-04-06 20:47:49 +00:00
|
|
|
}
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
2024-07-22 21:07:44 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
// init
|
|
|
|
|
constructor(
|
|
|
|
|
public coreViewModel: CoreViewModel,
|
2026-04-09 16:54:56 +00:00
|
|
|
public chatViewModel: ChatViewModel,
|
2026-04-01 08:29:39 +00:00
|
|
|
) {
|
|
|
|
|
this.cannotSendMessage = React.createProxyState(
|
|
|
|
|
[
|
|
|
|
|
this.chatViewModel.settingsViewModel.username,
|
|
|
|
|
this.composingMessage,
|
|
|
|
|
],
|
|
|
|
|
() =>
|
|
|
|
|
this.chatViewModel.settingsViewModel.username.value == "" ||
|
|
|
|
|
this.composingMessage.value == "",
|
|
|
|
|
);
|
|
|
|
|
}
|
2024-07-22 21:07:44 +02:00
|
|
|
}
|