Fix: load users on page reload, show image in avatar

js/main.js

@@ -1,5 +1,8 @@
 document.addEventListener('DOMContentLoaded', () => {
   checkSession();
+  if (getCookie('sessionid')) {
+    loadUsers();
+  }
 });
 
 function getCookie(name) {
@@ -229,8 +232,11 @@ async function loadUsers() {
       data.data.forEach(user => {
         const card = document.createElement('div');
         card.className = 'user-card';
+        const avatarContent = user.image 
+          ? `<img src="${user.image}" alt="${user.username || 'user'}" class="user-avatar-img" />`
+          : `<span class="user-avatar-text">${(user.username || '').charAt(0).toUpperCase()}</span>`;
         card.innerHTML = `
-          <div class="user-avatar">${(user.username || '').charAt(0).toUpperCase()}</div>
+          <div class="user-avatar">${avatarContent}</div>
           <div class="user-info">
             <h4>${user.username || 'N/A'}</h4>
             <p class="user-company">${user.company || ''}</p>