fix main.js - dupe functions

public/js/main.js

@@ -5,7 +5,6 @@
 import { apiCall } from './api.js';
 import { showMessage } from './utils.js';
 import {
-    updateUI,
     renderAuthView,
     renderAdminDashboard,
     renderEmployeeDashboard,
@@ -13,7 +12,7 @@ import {
     renderChangePasswordModal,
     renderResetPasswordModal,
     renderRequestHistoryModal,
-    handleViewNotesClick, // This UI-specific handler is simple enough to live in ui.js
+    handleViewNotesClick,
     renderArchiveView,
     renderTimeOffHistoryView
 } from './ui.js';
@@ -195,19 +194,16 @@ export function attachEmployeeDashboardListeners() {
 }
 
 export function attachAdminDashboardListeners() {
-    // Event delegation for all buttons
+    // This master listener handles most buttons in the admin view via event delegation
     document.getElementById('admin-dashboard').addEventListener('click', handleAdminDashboardClick);
     
-    // Specific form handlers
+    // Listeners for specific forms that need to prevent default submission behavior
     document.getElementById('create-user-form').addEventListener('submit', handleCreateUser);
     document.getElementById('add-punch-form').addEventListener('submit', handleAddPunch);
     document.getElementById('add-note-form').addEventListener('submit', handleAddNote);
     
-    // Other top-level buttons
+    // Call the function to make the new tabs work
-    document.getElementById('archive-btn').addEventListener('click', handleArchive);
+    setupTabbedInterface(); 
-    document.getElementById('view-archives-btn').addEventListener('click', renderArchiveView);
-    document.getElementById('view-time-off-history-btn').addEventListener('click', renderTimeOffHistoryView);
-    document.getElementById('view-notes-btn').addEventListener('click', handleViewNotesClick);
 }
 
 // --- APP INITIALIZER ---
@@ -231,26 +227,28 @@ function initializeApp() {
     }
 }
 
+// --- HELPERS ---
+// This function handles the logic for switching between tabs
 function setupTabbedInterface() {
     const tabsContainer = document.getElementById('admin-tabs-nav');
     const contentContainer = document.getElementById('admin-tabs-content');
 
-    if (!tabsContainer) return;
+    if (!tabsContainer || !contentContainer) return; // Exit if the tab elements aren't on the page
 
+    // Use event delegation on the tab navigation container
     tabsContainer.addEventListener('click', (e) => {
         const clickedTab = e.target.closest('.tab-btn');
-        if (!clickedTab) return;
+        if (!clickedTab) return; // Ignore clicks that aren't on a tab button
 
-        // Get the target tab's identifier
         const tabTarget = clickedTab.dataset.tab;
 
-        // Update the tab buttons' active state
+        // Update the active state on tab buttons
         tabsContainer.querySelectorAll('.tab-btn').forEach(btn => {
             btn.classList.remove('active-tab');
         });
         clickedTab.classList.add('active-tab');
 
-        // Update the visible content panel
+        // Show the correct content panel and hide the others
         contentContainer.querySelectorAll('[id^="tab-content-"]').forEach(panel => {
             panel.classList.add('hidden');
         });
@@ -258,25 +256,8 @@ function setupTabbedInterface() {
     });
 }
 
-// NOW, UPDATE your existing attachAdminDashboardListeners function to call this new function.
-
-export function attachAdminDashboardListeners() {
-    // Event delegation for all buttons
-    document.getElementById('admin-dashboard').addEventListener('click', handleAdminDashboardClick);
-    
-    // Specific form handlers
-    document.getElementById('create-user-form').addEventListener('submit', handleCreateUser);
-    document.getElementById('add-punch-form').addEventListener('submit', handleAddPunch);
-    document.getElementById('add-note-form').addEventListener('submit', handleAddNote);
-    
-    // ... Any other listeners you have here ...
-
-    // ADD THIS LINE at the end of the function:
-    setupTabbedInterface(); 
-}
-
 // --- START THE APP ---
-// Attach global listeners that are always present.
+// Attach global listeners that are always present on the page.
 document.getElementById('sign-out-btn').addEventListener('click', () => handleSignOut('You have been signed out.'));
 document.addEventListener('visibilitychange', () => {
     if (document.visibilityState === 'visible' && localStorage.getItem('user')) {