diff --git a/src/pages/chat/chat.ts b/src/pages/chat/chat.ts
index acf98ef..4d14fa7 100755
--- a/src/pages/chat/chat.ts
+++ b/src/pages/chat/chat.ts
@@ -230,12 +230,10 @@ class ChatElement extends HTMLElement {
// Send a messsage
private sendMessage() {
const messageInput = this.shadowRoot?.querySelector('#message-input') as HTMLInputElement;
- if (!messageInput) return;
+ if (!messageInput || !this.selectedMemberId) return;
+
const messageText = messageInput.value.trim();
-
- if (messageText === '' || this.selectedMemberId === null) {
- return;
- }
+ if (messageText === '') return;
const newMessage: Message = {
id: Date.now(),
@@ -255,7 +253,13 @@ class ChatElement extends HTMLElement {
// Automatic response after 2 seconds
setTimeout(() => {
if (this.selectedMemberId) {
- const autoReply = this.generateAutoReply(`Member ${this.selectedMemberId}`);
+ const autoReply = {
+ id: Date.now(),
+ sender: "Member",
+ text: "OK...",
+ time: new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }),
+ type: 'text' as const
+ };
messageStore.addMessage(this.selectedMemberId, autoReply);
this.messagesMock = messageStore.getMessages();
this.loadMemberChat(this.selectedMemberId);
@@ -271,45 +275,34 @@ class ChatElement extends HTMLElement {
// Load the list of members
- private loadMemberChat(memberId: string | number) {
+ private async loadMemberChat(memberId: string | number) {
this.selectedMemberId = String(memberId);
const memberMessages = this.messagesMock.find(m => String(m.memberId) === String(memberId));
- // Find the process and the role of the member
- let memberInfo = { processName: '', roleName: '', memberName: '' };
- groupsMock.forEach(process => {
- process.roles.forEach(role => {
- const member = role.members.find(m => String(m.id) === String(memberId));
- if (member) {
- memberInfo = {
- processName: process.name,
- roleName: role.name,
- memberName: member.name
- };
- }
- });
- });
-
const chatHeader = this.shadowRoot?.querySelector('#chat-header');
const messagesContainer = this.shadowRoot?.querySelector('#messages');
if (!chatHeader || !messagesContainer) return;
- chatHeader.textContent = `Chat with ${memberInfo.roleName} ${memberInfo.memberName} from ${memberInfo.processName}`;
+ const memberAddress = String(memberId);
+ const emojis = await addressToEmoji(memberAddress);
+ chatHeader.textContent = `Chat with ${emojis}`;
messagesContainer.innerHTML = '';
if (memberMessages) {
- memberMessages.messages.forEach((message: Message) => {
+ for (const message of memberMessages.messages) {
const messageElement = document.createElement('div');
messageElement.className = 'message-container';
const messageContent = document.createElement('div');
messageContent.className = 'message';
+
if (message.type === 'file') {
messageContent.innerHTML = `${message.fileName}`;
messageContent.classList.add('user');
} else {
- messageContent.innerHTML = `${message.sender}: ${message.text} ${message.time}`;
+ const senderEmojis = await addressToEmoji(memberAddress);
+ messageContent.innerHTML = `${senderEmojis}: ${message.text} ${message.time}`;
if (message.sender === "4NK") {
messageContent.classList.add('user');
}
@@ -317,10 +310,9 @@ class ChatElement extends HTMLElement {
messageElement.appendChild(messageContent);
messagesContainer.appendChild(messageElement);
- });
+ }
}
-
this.scrollToBottom(messagesContainer);
}
@@ -344,12 +336,7 @@ class ChatElement extends HTMLElement {
const memberContainer = document.createElement('div');
memberContainer.className = 'member-container';
- // Afficher l'adresse SP
- const addressSpan = document.createElement('span');
- addressSpan.className = 'member-address';
- addressSpan.textContent = member.sp_addresses?.[0] || 'No address';
-
- // Ajouter les emojis pour l'adresse
+
const emojiSpan = document.createElement('span');
emojiSpan.className = 'member-emoji';
if (member.sp_addresses?.[0]) {
@@ -357,7 +344,6 @@ class ChatElement extends HTMLElement {
emojiSpan.textContent = emojis;
}
- memberContainer.appendChild(addressSpan);
memberContainer.appendChild(emojiSpan);
memberItem.appendChild(memberContainer);
@@ -483,10 +469,8 @@ class ChatElement extends HTMLElement {
nameSpan.textContent = `Process : `;
nameSpan.className = 'process-name';
- // Ajouter d'abord le nom
container.appendChild(nameSpan);
- // Puis ajouter les emojis
await addressToEmoji(processId).then(emojis => {
const emojiSpan = document.createElement('span');
emojiSpan.className = 'process-emoji';
@@ -496,7 +480,6 @@ class ChatElement extends HTMLElement {
li.appendChild(container);
- // Créer et ajouter la liste des rôles
const roleList = document.createElement('ul');
roleList.className = 'role-list';
@@ -511,7 +494,6 @@ class ChatElement extends HTMLElement {
roleNameSpan.className = 'role-name';
roleNameSpan.textContent = roleName;
- // Ajouter l'événement de clic
roleContainer.addEventListener('click', (event) => {
event.stopPropagation();
this.toggleMembers(roles[roleName], roleItem);