insyaallah revisi done

resources/views/layouts/app.blade.php

@@ -54,7 +54,7 @@
                                 </div>
                                 <div id="notification-list"></div>
                                 <div class="dropdown-divider"></div>
-                                <form action="{{ route('dashboard.mark_read') }}" method="POST">
+                                <form action="{{ route('dashboard.mark_all_read') }}" method="POST">
                                     @csrf
                                     @include('backend.layouts.partials.messages')
                                     <button type="submit" class="dropdown-item dropdown-footer" id="notification_mark">Mark all as read</button>
@@ -184,6 +184,7 @@
         loadingBar.style.display = 'block';
         notificationList.classList.add('d-none');
 
+        
         fetch('/api/notifications')
             .then(response => response.json())
             .then(data => {
@@ -193,6 +194,9 @@
                     const item = document.createElement('a');
                     item.href = notification.link || '#';
                     item.classList.add('dropdown-item');
+                    item.dataset.notificationId = notification.id; // Store notification ID for later use
+
+                    const notifLink = `/forms/${notification.expense_type}/view/${notification.expense_id}`;
                     item.innerHTML = `
                         <div style="display: flex; justify-content: space-between; align-items: center;">
                             <div style="display: flex; align-items: center;">
@@ -211,6 +215,27 @@
                         </div>
                         <span class="text-muted text-sm" style="font-size: 12px !important;">${notification.content || ''}</span>
                     `;
+
+                    // Add click event listener
+                    item.addEventListener('click', (e) => {
+                        e.preventDefault(); // Prevent default navigation
+                        
+                        // Call the mark_read API
+                        fetch(`/api/mark_read/${notification.id}`)
+                            .then(markReadResponse => {
+                                if (!markReadResponse.ok) {
+                                    throw new Error('Failed to mark notification as read');
+                                }
+                                // Optionally handle UI changes here (e.g., mark notification visually as read)
+                                console.log(`Notification ${notification.id} marked as read`);
+                                // Redirect to the notification link
+                                window.location.href = notifLink;
+                            })
+                            .catch(error => {
+                                console.error('Error marking notification as read:', error);
+                            });
+                    });
+
                     notificationList.appendChild(item);
                 });
 
@@ -224,6 +249,7 @@
                 notificationList.innerHTML = '<span class="dropdown-item text-danger">Failed to load notifications.</span>';
                 notificationList.classList.remove('d-none');
             });
+
     });
 
     fetch('/api/notifications')