diff --git a/routes/__pycache__/conversations.cpython-313.pyc b/routes/__pycache__/conversations.cpython-313.pyc index 4a7805f..c049c16 100644 Binary files a/routes/__pycache__/conversations.cpython-313.pyc and b/routes/__pycache__/conversations.cpython-313.pyc differ diff --git a/routes/__pycache__/main.cpython-313.pyc b/routes/__pycache__/main.cpython-313.pyc index eeb0d92..277727a 100644 Binary files a/routes/__pycache__/main.cpython-313.pyc and b/routes/__pycache__/main.cpython-313.pyc differ diff --git a/routes/main.py b/routes/main.py index fbcc644..e539d9d 100644 --- a/routes/main.py +++ b/routes/main.py @@ -491,6 +491,24 @@ def init_routes(main_bp): # Get paginated notifications notifications = query.order_by(Notif.timestamp.desc()).paginate(page=page, per_page=per_page) + # Check if this is an AJAX request + if request.headers.get('X-Requested-With') == 'XMLHttpRequest': + return jsonify({ + 'notifications': [{ + 'id': notif.id, + 'notif_type': notif.notif_type, + 'timestamp': notif.timestamp.strftime('%Y-%m-%d %H:%M:%S'), + 'read': notif.read, + 'details': notif.details, + 'sender': { + 'username': notif.sender.username, + 'last_name': notif.sender.last_name + } if notif.sender else None + } for notif in notifications.items], + 'total_pages': total_pages, + 'current_page': page + }) + return render_template('notifications/notifications.html', notifications=notifications.items, total_pages=total_pages, diff --git a/static/js/notifications.js b/static/js/notifications.js index 428f339..bb7ac9a 100644 --- a/static/js/notifications.js +++ b/static/js/notifications.js @@ -66,14 +66,68 @@ document.addEventListener('DOMContentLoaded', function() { } const data = await response.json(); - updateNotificationsTable(data.notifications); - updatePagination(data.total_pages, data.current_page); - // Reinitialize tooltips after updating the table + // Update the table with the notifications + if (data.notifications && data.notifications.length > 0) { + notifsTableBody.innerHTML = data.notifications.map(notif => ` + + ${notif.timestamp} + ${getNotifTypeBadge(notif.notif_type)} + ${notif.sender ? `${notif.sender.username} ${notif.sender.last_name}` : 'System'} + + ${notif.read ? + 'Read' : + 'Unread'} + + +
+ ${getActionButtons(notif)} + + ${!notif.read ? ` + + ` : ''} + +
+ + + `).join(''); + } else { + notifsTableBody.innerHTML = 'No notifications found'; + } + + // Update pagination + totalPages = data.total_pages; + currentPage = data.current_page; + currentPageSpan.textContent = currentPage; + totalPagesSpan.textContent = totalPages; + prevPageBtn.disabled = currentPage <= 1; + nextPageBtn.disabled = currentPage >= totalPages; + + // Reinitialize tooltips const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')); tooltipTriggerList.map(function (tooltipTriggerEl) { return new bootstrap.Tooltip(tooltipTriggerEl); }); + + // Reattach event listeners + attachEventListeners(); } catch (error) { console.error('Error fetching notifications:', error); notifsTableBody.innerHTML = 'Error loading notifications'; @@ -330,4 +384,34 @@ document.addEventListener('DOMContentLoaded', function() { updateURL(); } }); -}); \ No newline at end of file +}); + +// Function to get action buttons based on notification type +function getActionButtons(notif) { + if (notif.notif_type === 'room_invite' || notif.notif_type === 'room_invite_removed') { + if (notif.details && notif.details.room_id) { + return ` + + + + `; + } + } else if (notif.notif_type === 'conversation_invite' || + notif.notif_type === 'conversation_invite_removed' || + notif.notif_type === 'conversation_message') { + if (notif.details && notif.details.conversation_id) { + return ` + + + + `; + } + } + return ''; +} \ No newline at end of file