4nk/ihm_client
5
0
Fork 0
Code Issues 6 Pull Requests Actions Packages Projects Releases Wiki Activity

merge_with_load_message_loop

Browse Source
This commit is contained in:
Pascal 2025-01-16 15:14:07 +01:00
parent 769952a5de
commit d1b115e605
2 changed files with 138 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

172
src/pages/chat/chat.ts
View File

@ -7,7 +7,7 @@ declare global {
} }
import { membersMock } from '../../mocks/mock-signature/membersMocks'; import { membersMock } from '../../mocks/mock-signature/membersMocks';
import { ApiReturn, Device, Member } from '../../../pkg/sdk_client'; import { ApiReturn, Device, Member, Process } from '../../../pkg/sdk_client';
import { getCorrectDOM } from '../../utils/document.utils'; import { getCorrectDOM } from '../../utils/document.utils';
import chatStyle from '../../../public/style/chat.css?inline'; import chatStyle from '../../../public/style/chat.css?inline';
import { addressToEmoji } from '../../utils/sp-address.utils'; import { addressToEmoji } from '../../utils/sp-address.utils';
@ -362,6 +362,17 @@ class ChatElement extends HTMLElement {
(container as HTMLElement).scrollTop = (container as HTMLElement).scrollHeight; (container as HTMLElement).scrollTop = (container as HTMLElement).scrollHeight;
} }
// Get the diff by state id
async getDiffByStateId(stateId: string) {
try {
const database = await Database.getInstance();
const diff = await database.requestStoreByIndex('diffs', 'byStateId', stateId);
return diff;
} catch (error) {
console.error('Error getting diff by state id:', error);
}
}
private async loadMemberChat(member: string[]) { private async loadMemberChat(member: string[]) {
if (member.length === 0) { if (member.length === 0) {
console.error('Empty member'); console.error('Empty member');
@ -375,6 +386,7 @@ class ChatElement extends HTMLElement {
return; return;
} }
// Set the selected member
this.selectedMember = member; this.selectedMember = member;
const chatHeader = this.shadowRoot?.querySelector('#chat-header'); const chatHeader = this.shadowRoot?.querySelector('#chat-header');
@ -388,6 +400,10 @@ class ChatElement extends HTMLElement {
messagesContainer.innerHTML = ''; messagesContainer.innerHTML = '';
// Filter processes for the children of current process // Filter processes for the children of current process
if (!this.processId) {
console.error('No process id');
return;
}
const children: string[] = await service.getChildrenOfProcess(this.processId); const children: string[] = await service.getChildrenOfProcess(this.processId);
let messagesProcess: Process | null = null; let messagesProcess: Process | null = null;
@ -415,10 +431,14 @@ class ChatElement extends HTMLElement {
// We need to create a new process // We need to create a new process
let newProcess; let newProcess;
try { try {
if (this.processId) {
const res = await service.createDmProcess(member, this.processId); const res = await service.createDmProcess(member, this.processId);
// We catch the new process here // We catch the new process here
messagesProcess = res.updated_process.current_process; messagesProcess = res.updated_process?.current_process ?? null;
await service.handleApiReturn(res); await service.handleApiReturn(res);
} else {
console.error('No process id');
}
} catch (e) { } catch (e) {
console.error(e); console.error(e);
return; return;
@ -427,94 +447,102 @@ class ChatElement extends HTMLElement {
console.log('Found child process', messagesProcess); console.log('Found child process', messagesProcess);
} }
// Get the diffs from the database // --- GET THE STATE ID ---
const messagesProcessStateId = messagesProcess?.states?.[0]?.state_id;
console.log("Je suis messagesProcessStateId", messagesProcessStateId);
// --- GET THE DIFF FROM THE STATE ID ---
if (messagesProcessStateId) {
const diffFromStateId = await this.getDiffByStateId(messagesProcessStateId);
console.log("Je suis diffFromStateId", diffFromStateId);
}
// Récupérer les messages depuis les états du processus
const allMessages: any[] = [];
if (messagesProcess?.states) {
for (const state of messagesProcess.states) { for (const state of messagesProcess.states) {
const pcd_commitment = state.pcd_commitment; const pcd_commitment = state.pcd_commitment;
if (pcd_commitment) { if (pcd_commitment) {
const message_hash = pcd_commitment.message; const message_hash = pcd_commitment.message;
if (message_hash) { if (message_hash) {
const diff = await service.getDiffByValue(message_hash); const diff = await service.getDiffByValue(message_hash);
const message = diff.new_value; const message = diff?.new_value;
console.log(message); console.log('message', message);
allMessages.push(message);
}
} }
} }
} }
// if (record.description === 'message_content' && allMessages.sort((a, b) => a.metadata.createdAt - b.metadata.createdAt);
// record.metadata && if (allMessages.length === 0) {
// record.metadata.roleName === this.selectedRole && console.log('No messages found');
// ((record.metadata.sender === myAddresses[0] && record.metadata.recipient === memberId) || return;
// (record.metadata.sender === memberId && record.metadata.recipient === myAddresses[0]))) { } else if (allMessages.length > 1 && allMessages[0].metadata.sender === myAddresses[0] && allMessages[0].metadata.recipient === this.selectedMember[0]) {
console.log('Messages found:', allMessages);
for (const message of allMessages) {
const messageElement = document.createElement('div');
messageElement.className = 'message-container';
// messages.push(record); const isCurrentUser = message.metadata.sender === myAddresses[0];
// } messageElement.style.justifyContent = isCurrentUser ? 'flex-end' : 'flex-start';
// cursor.continue();
// } else {
// messages.sort((a, b) => a.metadata.timestamp - b.metadata.timestamp);
// for (const message of messages) { const messageContent = document.createElement('div');
// const messageElement = document.createElement('div'); messageContent.className = `message ${isCurrentUser ? 'user' : ''}`;
// messageElement.className = 'message-container';
// const isCurrentUser = message.metadata.sender === myAddresses[0]; const senderEmoji = await addressToEmoji(message.metadata.sender);
// messageElement.style.justifyContent = isCurrentUser ? 'flex-end' : 'flex-start';
// const messageContent = document.createElement('div'); if (message.type === 'file') {
// messageContent.className = `message ${isCurrentUser ? 'user' : ''}`; let fileContent = '';
if (message.content.type.startsWith('image/')) {
fileContent = `
<div class="file-preview">
<img src="${message.content.data}" alt="Image" style="max-width: 200px; max-height: 200px;"/>
</div>
`;
} else {
const blob = this.base64ToBlob(message.content.data, message.content.type);
const url = URL.createObjectURL(blob);
fileContent = `
<div class="file-download">
<a href="${url}" download="${message.content.name}">
📎 ${message.content.name}
</a>
</div>
`;
}
// const senderEmoji = await addressToEmoji(message.metadata.sender); messageContent.innerHTML = `
<div class="message-content">
<strong>${senderEmoji}</strong>: ${fileContent}
</div>
<div class="message-time">
${new Date(message.metadata.createdAt).toLocaleString('fr-FR')}
</div>
`;
} else {
messageContent.innerHTML = `
<div class="message-content">
<strong>${senderEmoji}</strong>: ${message.content}
</div>
<div class="message-time">
${new Date(message.metadata.createdAt).toLocaleString('fr-FR')}
</div>
`;
}
// if (message.metadata.type === 'file') { messageElement.appendChild(messageContent);
// let fileContent = ''; messagesContainer.appendChild(messageElement);
// if (message.metadata.fileType.startsWith('image/')) { }
// fileContent = `
// <div class="file-preview">
// <img src="${message.metadata.fileData}" alt="${message.metadata.fileName}" style="max-width: 200px; max-height: 200px;"/>
// </div>
// `;
// } else {
// const blob = this.base64ToBlob(message.metadata.fileData, message.metadata.fileType);
// const url = URL.createObjectURL(blob);
// fileContent = `
// <div class="file-download">
// <a href="${url}" download="${message.metadata.fileName}">
// 📎 ${message.metadata.fileName}
// </a>
// </div>
// `;
// }
// messageContent.innerHTML = `
// <div class="message-content">
// <strong>${senderEmoji}</strong>: ${fileContent}
// </div>
// <div class="message-time">
// ${new Date(message.metadata.timestamp).toLocaleString('fr-FR')}
// </div>
// `;
// } else {
// // Message texte normal
// messageContent.innerHTML = `
// <div class="message-content">
// <strong>${senderEmoji}</strong>: ${message.metadata.text}
// </div>
// <div class="message-time">
// ${new Date(message.metadata.timestamp).toLocaleString('fr-FR')}
// </div>
// `;
// }
// messageElement.appendChild(messageContent);
// messagesContainer.appendChild(messageElement);
// }
// this.scrollToBottom(messagesContainer);
// }
// };
// };
this.scrollToBottom(messagesContainer);
} else {
console.log('No messages found');
}
this.scrollToBottom(messagesContainer);
} catch (error) { } catch (error) {
console.error('Error loading chat:', error); console.error('❌ Error in loadMemberChat:', error);
} }
} }

22
src/services/database.service.ts
View File

@ -267,6 +267,28 @@ class Database {
throw e; throw e;
} }
} }
// Request a store by index
public async requestStoreByIndex(storeName: string, indexName: string, request: string): Promise<any[]> {
const db = await this.getDb();
const tx = db.transaction(storeName, 'readonly');
const store = tx.objectStore(storeName);
const index = store.index(indexName);
try {
return new Promise((resolve, reject) => {
const getAllRequest = index.getAll(request);
getAllRequest.onsuccess = () => {
const allItems = getAllRequest.result;
const filtered = allItems.filter(item => item.state_id === request);
resolve(filtered);
};
getAllRequest.onerror = () => reject(getAllRequest.error);
});
} catch (e) {
throw e;
}
}
} }
export default Database; export default Database;