can_see_process

This commit is contained in:
Pascal 2025-01-06 19:08:17 +01:00
parent 7455b07fbc
commit 65bf38f8bd

View File

@ -37,6 +37,11 @@ export function initChat() {
}
class ChatElement extends HTMLElement {
static get observedAttributes() {
return ['process-id'];
}
private processId: string | null = null;
private selectedMemberId: string | null = null;
private messagesMock: any[] = [];
private dom: Node;
@ -58,6 +63,10 @@ class ChatElement extends HTMLElement {
this.messagesMock = messageStore.getMessages();
this.dom = getCorrectDOM('signature-element');
// 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 = `
<style>
@ -115,6 +124,14 @@ class ChatElement extends HTMLElement {
}) as EventListener);
}
attributeChangedCallback(name: string, oldValue: string, newValue: string) {
console.log(`🔄 Attribute ${name} changed from ${oldValue} to ${newValue}`);
if (name === 'process-id' && newValue) {
console.log('🔍 Loading chat with new process ID:', newValue);
this.loadGroupList(newValue);
}
}
private initMessageEvents() {
// Pour le bouton Send
const sendButton = this.shadowRoot?.querySelector('#send-button');
@ -390,53 +407,34 @@ class ChatElement extends HTMLElement {
}
private loadGroupList(): void {
private loadGroupList(processId: string): void {
console.log('🔍 Loading group list with processId:', processId);
const groupList = this.shadowRoot?.querySelector('#group-list');
if (!groupList) return;
if (!groupList) {
console.error('❌ Group list element not found');
return;
}
groupsMock.forEach(group => {
const li = document.createElement('li');
li.className = 'group-list-item';
// Vider la liste existante
groupList.innerHTML = '';
// Create a flex container for the name and the icon
const container = document.createElement('div');
container.className = 'group-item-container';
// Créer l'élément pour le processus de messaging
const li = document.createElement('li');
li.className = 'group-list-item';
li.setAttribute('data-process-id', processId);
// Span for the process name
const nameSpan = document.createElement('span');
nameSpan.textContent = group.name;
nameSpan.className = 'process-name';
const container = document.createElement('div');
container.className = 'group-item-container';
// Add click event to show roles
nameSpan.addEventListener('click', (event) => {
event.stopPropagation();
this.toggleRoles(group, li);
});
const nameSpan = document.createElement('span');
nameSpan.textContent = `Messaging Process ${processId}`;
nameSpan.className = 'process-name';
// Assemble the elements
container.appendChild(nameSpan);
li.appendChild(container);
container.appendChild(nameSpan);
li.appendChild(container);
groupList.appendChild(li);
// Create and append the role list container
const roleList = document.createElement('ul');
roleList.className = 'role-list';
roleList.style.display = 'none';
// Add roles for this process
group.roles.forEach(role => {
const roleItem = document.createElement('li');
roleItem.className = 'role-item';
roleItem.textContent = role.name;
roleItem.onclick = (event) => {
event.stopPropagation();
this.toggleMembers(role, roleItem);
};
roleList.appendChild(roleItem);
});
li.appendChild(roleList);
groupList.appendChild(li);
});
console.log('✅ Group list item added for process:', processId);
}
@ -555,8 +553,13 @@ class ChatElement extends HTMLElement {
connectedCallback() {
this.updateCurrentUserDisplay();
this.initializeEventListeners();
this.loadGroupList();
if (this.processId) {
console.log('🔍 Loading chat with process ID:', this.processId);
this.loadGroupList(this.processId);
} else {
console.error('❌ No process ID found in element attributes');
}
// Si un membre est sélectionné par défaut, charger ses messages
if (this.selectedMemberId) {
this.loadMemberChat(this.selectedMemberId);