diff --git a/src/pages/chat/chat.ts b/src/pages/chat/chat.ts index 383732d..217127d 100755 --- a/src/pages/chat/chat.ts +++ b/src/pages/chat/chat.ts @@ -30,11 +30,6 @@ interface LocalNotification { time: string; } -interface Process { - encrypted_pcd: { - roles: Record; - }; -} export function initChat() { const chatElement = document.createElement('chat-element'); @@ -70,9 +65,9 @@ class ChatElement extends HTMLElement { this.attachShadow({ mode: 'open' }); this.messagesMock = messageStore.getMessages(); this.dom = getCorrectDOM('signature-element'); + this.processId = this.getAttribute('process-id'); // Récupérer le processId depuis l'attribut du composant - this.processId = this.getAttribute('process-id'); console.log('🔍 Constructor - Process ID from element:', this.processId); this.shadowRoot!.innerHTML = ` @@ -124,7 +119,6 @@ class ChatElement extends HTMLElement { } }); this.initMessageEvents(); - this.initFileUpload(); document.addEventListener('newMessagingProcess', ((event: CustomEvent) => { console.log('🎯 Received newMessagingProcess event:', event.detail); @@ -141,26 +135,22 @@ class ChatElement extends HTMLElement { } private initMessageEvents() { - // Pour le bouton Send const sendButton = this.shadowRoot?.querySelector('#send-button'); if (sendButton) { sendButton.addEventListener('click', () => this.sendMessage()); } - // Pour la touche Entrée const messageInput = this.shadowRoot?.querySelector('#message-input'); if (messageInput) { messageInput.addEventListener('keypress', (event: Event) => { - const keyEvent = event as KeyboardEvent; // Cast en KeyboardEvent + const keyEvent = event as KeyboardEvent; if (keyEvent.key === 'Enter' && !keyEvent.shiftKey) { event.preventDefault(); this.sendMessage(); } }); } - } - private initFileUpload() { const fileInput = this.shadowRoot?.querySelector('#file-input') as HTMLInputElement; if (fileInput) { fileInput.addEventListener('change', (event: Event) => { @@ -562,68 +552,38 @@ class ChatElement extends HTMLElement { // Send a file private sendFile(file: File) { - console.log('SendFile called with file:', file); + if (!this.selectedMemberId) return; + + const MAX_FILE_SIZE = 5 * 1024 * 1024; + if (file.size > MAX_FILE_SIZE) { + alert('File is too large. Maximum size is 5MB'); + return; + } + const reader = new FileReader(); - reader.onloadend = () => { - const fileData = reader.result; - const fileName = file.name; - console.log('File loaded:', fileName); - - if (this.selectedMemberId) { - messageStore.addMessage(this.selectedMemberId, { - id: Date.now(), - sender: "4NK", - fileName: fileName, - fileData: fileData, - time: new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }), - type: 'file' - }); - console.log('Message added to store'); - - this.messagesMock = messageStore.getMessages(); - this.loadMemberChat(this.selectedMemberId); - } - }; reader.readAsDataURL(file); + + reader.onload = () => { + const fileMessage = { + id: Date.now(), + sender: "4NK", + fileName: file.name, + fileData: reader.result, + time: new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }), + type: 'file' as const + }; + + messageStore.addMessage(this.selectedMemberId!, fileMessage); + this.messagesMock = messageStore.getMessages(); + this.loadMemberChat(this.selectedMemberId!); + + const fileInput = this.shadowRoot?.querySelector('#file-input') as HTMLInputElement; + if (fileInput) fileInput.value = ''; + }; } - private initializeEventListeners() { - document.addEventListener('DOMContentLoaded', (): void => { - }); - - // Gestionnaire d'événements pour le chat - const sendBtn = this.shadowRoot?.querySelector('#send-button'); - if (sendBtn) { - sendBtn.addEventListener('click', this.sendMessage.bind(this)); - } - - const messageInput = this.shadowRoot?.querySelector('#message-input'); - if (messageInput) { - messageInput.addEventListener('keypress', (event: Event) => { - if ((event as KeyboardEvent).key === 'Enter') { - event.preventDefault(); - this.sendMessage(); - } - }); - } - - // Gestionnaire pour l'envoi de fichiers - const fileInput = this.shadowRoot?.querySelector('#file-input'); - if (fileInput) { - fileInput.addEventListener('change', (event: Event) => { - const file = (event.target as HTMLInputElement).files?.[0]; - if (file) { - this.sendFile(file); - } - }); - } - } - - - connectedCallback() { this.updateCurrentUserDisplay(); - this.initializeEventListeners(); if (this.processId) { console.log('🔍 Loading chat with process ID:', this.processId);