async function getLoggedInUserFullName() {
  try {
    const response = await fetch('/api/current-user', { credentials: 'include' });
    if (!response.ok) throw new Error('Failed to fetch current user');
    const user = await response.json();
    console.log('Current user fetched:', user);
    return user.fullName || null;
  } catch (error) {
    console.error('Error fetching logged-in user full name:', error);
    return null;
  }
}

window.addEventListener('DOMContentLoaded', async () => {
  const fullName = await getLoggedInUserFullName();

  if (fullName) {
    loadUserContact(fullName);
  } else {
    console.warn('User full name not found, skipping contact load.');
  }

  const contactSection = document.getElementById('contactSection');
  const contactForm = document.getElementById('contactForm');
  const contactMessage = document.getElementById('contactMessage');

  if (!contactSection || !contactForm) {
    console.warn('Contact section or form not found in DOM.');
    return;
  }

  contactForm.addEventListener('submit', async (e) => {
    e.preventDefault();

    const contactData = {
      name: e.target.contactName.value,
      organization: e.target.contactOrganization.value,
      telephone: e.target.contactTelephone.value,
      secondTelephone: e.target.contactSecondTelephone.value,
      email: e.target.contactEmail.value,
    };

    try {
      const response = await fetch('/api/contacts', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        credentials: 'include',
        body: JSON.stringify(contactData),
      });

      if (!response.ok) throw new Error('Failed to update contact');

      if (contactMessage) {
        contactMessage.textContent = 'Contact saved successfully!';
        contactMessage.classList.remove('error');
      }
    } catch (error) {
      console.error(error);
      if (contactMessage) {
        contactMessage.textContent = 'Failed to save contact.';
        contactMessage.classList.add('error');
      }
    }
  });
});

// Function to fetch and load user contact info into the form
async function fetchUserContact(fullName) {
  try {
    const response = await fetch('/api/contacts', { credentials: 'include' });
    if (!response.ok) throw new Error('Failed to fetch contacts');

    const contacts = await response.json();
    return contacts.find(c => c.name === fullName) || null;
  } catch (err) {
    console.error(err);
    return null;
  }
}

async function loadUserContact(fullName) {
  const contact = await fetchUserContact(fullName);
  const contactSection = document.getElementById('contactSection');
  const contactForm = document.getElementById('contactForm');

  if (!contactSection || !contactForm) return;

  if (contact) {
    contactSection.style.display = 'block';
    contactForm.contactName.value = contact.name;
    contactForm.contactOrganization.value = contact.organization || '';
    contactForm.contactTelephone.value = contact.telephone || '';
    contactForm.contactSecondTelephone.value = contact.secondTelephone || '';
    contactForm.contactEmail.value = contact.email || '';
  } else {
    // Optionally show the section with empty fields to add a new contact
    contactSection.style.display = 'block';
    contactForm.contactName.value = fullName; // pre-fill full name for new contact
    contactForm.contactOrganization.value = '';
    contactForm.contactTelephone.value = '';
    contactForm.contactSecondTelephone.value = '';
    contactForm.contactEmail.value = '';
  }
}


document.addEventListener("DOMContentLoaded", () => {
  const tabs = document.querySelectorAll(".tab-button");
  const tabContents = document.querySelectorAll(".tab-content");

  tabs.forEach((tab) => {
    tab.addEventListener("click", () => {
      const target = tab.dataset.tab;

      // Toggle active classes on buttons
      tabs.forEach((t) => t.classList.remove("active"));
      tab.classList.add("active");

      // Toggle tab content
      tabContents.forEach((content) => {
        content.classList.toggle("active", content.id === target);
      });
    });
  });

  // Show admin tab if the user is an admin
  fetch('/api/current-user', { credentials: 'include' })
    .then(res => res.json())
    .then(user => {
      if (user?.role === 'admin') {
        document.getElementById('adminTabButton').style.display = 'inline-block';
      }
    })
    .catch(err => console.error("Failed to fetch user role:", err));
});


// Add this to your DOMContentLoaded or similar setup
document.querySelector('.tab-button[data-tab="readmeTab"]').addEventListener('click', loadReadme);

async function loadReadme() {
  const readmeContainer = document.getElementById('readmeContent');
  if (!readmeContainer) return;

  try {
    const response = await fetch('/README.md');
    if (!response.ok) throw new Error('Failed to load README.md');

    const markdown = await response.text();

    // Option 1: Display raw markdown
    // readmeContainer.textContent = markdown;

    // ✅ Option 2: Convert markdown to HTML using a library like marked.js
    readmeContainer.innerHTML = marked.parse(markdown);  // You need to include marked.js

  } catch (error) {
    console.error('Error loading README:', error);
    readmeContainer.textContent = 'Failed to load README.';
  }
}