Hamza/saqel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Enhance safe DOM rendering for teacher conversations list and auto-selection of active chat

Browse Source
This commit is contained in:
Hamza-Ayed
2026-08-27 03:55:34 +03:00
parent dd06cafa87
commit e1a75e71ab
1 changed files with 38 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/app/Views/TeacherPortal.php
+38 -11
View File
@@ -677,22 +677,38 @@ class TeacherPortal
} }
} }
function escapeHtml(str) {
if (!str) return '';
const div = document.createElement('div');
div.textContent = str;
return div.innerHTML;
}
function renderConversations(convs) { function renderConversations(convs) {
const container = document.getElementById('conv_list_container'); const container = document.getElementById('conv_list_container');
if (!container) return;
if (!convs || convs.length === 0) { if (!convs || convs.length === 0) {
container.innerHTML = '<div style="padding: 20px; text-align: center; color: var(--text-muted); font-size: 12px;">لا يوجد طلاب مسجلون حالياً. سيظهر الطلاب هنا فور تسجيلهم.</div>'; container.innerHTML = '<div style="padding: 20px; text-align: center; color: var(--text-muted); font-size: 12px;">لا يوجد طلاب مسجلون حالياً. سيظهر الطلاب هنا فور تسجيلهم.</div>';
return; return;
} }
container.innerHTML = convs.map(c => ` container.innerHTML = '';
<div class="conv-item ${c.user_id === activeRecipientId ? 'active' : ''}" onclick="selectConversation(${c.user_id}, '${c.full_name}')"> convs.forEach(c => {
const item = document.createElement('div');
item.className = 'conv-item' + (c.user_id === activeRecipientId ? ' active' : '');
item.dataset.userId = c.user_id;
item.onclick = function() {
selectConversation(c.user_id, c.full_name);
};
item.innerHTML = `
<div class="conv-name"> <div class="conv-name">
<span>${c.full_name}</span> <span>${escapeHtml(c.full_name)}</span>
${c.unread_count > 0 ? `<span class="unread-badge">${c.unread_count}</span>` : ''} ${c.unread_count > 0 ? `<span class="unread-badge">${c.unread_count}</span>` : ''}
</div> </div>
<div class="conv-preview">${c.last_message || 'محادثة جديدة'}</div> <div class="conv-preview">${escapeHtml(c.last_message || 'محادثة جديدة')}</div>
</div> `;
`).join(''); container.appendChild(item);
});
// Auto-select first conversation if none is selected // Auto-select first conversation if none is selected
if (!activeRecipientId && convs.length > 0) { if (!activeRecipientId && convs.length > 0) {
@@ -702,22 +718,33 @@ class TeacherPortal
async function selectConversation(userId, name) { async function selectConversation(userId, name) {
activeRecipientId = userId; activeRecipientId = userId;
document.getElementById('active_chat_user_name').textContent = name; const nameEl = document.getElementById('active_chat_user_name');
if (nameEl) nameEl.textContent = name;
const items = document.querySelectorAll('.conv-item'); const items = document.querySelectorAll('.conv-item');
items.forEach(el => {
if (parseInt(el.dataset.userId) === userId) {
el.classList.add('active');
} else {
el.classList.remove('active');
}
});
const token = localStorage.getItem('saqel_teacher_jwt'); const token = localStorage.getItem('saqel_teacher_jwt');
if (!token) return;
try { try {
const res = await fetch(`/api/chat/messages?other_user_id=${userId}`, { const res = await fetch(`/api/chat/messages?other_user_id=${userId}`, {
headers: { 'Authorization': 'Bearer ' + token } headers: { 'Authorization': 'Bearer ' + token }
}); });
const data = await res.json(); const data = await res.json();
if (res.ok && data.status === 'success') { if (res.ok && data.status === 'success' && data.data) {
const messagesArea = document.getElementById('chat_messages_area'); const messagesArea = document.getElementById('chat_messages_area');
messagesArea.innerHTML = ''; messagesArea.innerHTML = '';
if (data.data.messages.length === 0) { const msgs = data.data.messages || [];
messagesArea.innerHTML = '<div style="text-align: center; color: var(--text-muted); font-size: 13px; margin-top: 60px;">بدء المحادثة مع الطالب ' + name + ' — اكتب رسالتك بالأسفل.</div>'; if (msgs.length === 0) {
messagesArea.innerHTML = '<div style="text-align: center; color: var(--text-muted); font-size: 13px; margin-top: 60px;">بدء المحادثة مع الطالب ' + escapeHtml(name) + ' — اكتب ردك بالأسفل.</div>';
} else { } else {
data.data.messages.forEach(msg => appendChatMessage(msg)); msgs.forEach(msg => appendChatMessage(msg));
} }
} }
} catch (e) { } catch (e) {