-
-
-
-
- Register Organization
-
-
-
-
-
-
-
-
Recruit Verify
-
-
- Volun -teer
-
-
-
for Your Events
-
-
- Create and manage volunteers, connect with verified volunteers,
- track attendance, and reward effort with certificates — all in one
- platform designed to maximize your community impact.
-
-
-
- Register Organization
- Learn More
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/Admin/certificates/certificate-preview.css b/Admin/certificates/certificate-preview.css
new file mode 100644
index 0000000..59e84b6
--- /dev/null
+++ b/Admin/certificates/certificate-preview.css
@@ -0,0 +1,170 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.overlay {
+ min-height: 100vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1.5rem;
+}
+
+.modal {
+ width: 100%;
+ max-width: 34rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.8rem;
+ position: relative;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.12);
+}
+
+.close-btn {
+ position: absolute;
+ top: 1rem;
+ right: 1rem;
+ width: 2rem;
+ height: 2rem;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 1rem;
+ cursor: pointer;
+}
+
+.close-btn:hover {
+ color: #172033;
+}
+
+.modal h1 {
+ font-size: 1.6rem;
+ font-weight: 700;
+ color: #172033;
+ margin-bottom: 1.5rem;
+}
+
+.details-grid {
+ display: grid;
+ grid-template-columns: 8rem 1fr;
+ gap: 0.9rem 1rem;
+ margin-bottom: 1.5rem;
+}
+
+.label {
+ font-size: 0.9rem;
+ font-weight: 600;
+ color: #223f6b;
+}
+
+.value {
+ font-size: 0.9rem;
+ color: #374151;
+ word-break: break-word;
+}
+
+.certificate-card {
+ margin-top: 1rem;
+ border: 0.0625rem solid #d9dde3;
+ border-radius: 0.8rem;
+ padding: 1.4rem 1rem;
+ text-align: center;
+ background: #f9fbfd;
+}
+
+.certificate-icon {
+ position: relative;
+ width: 4rem;
+ height: 4rem;
+ margin: 0 auto 0.8rem;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #1d7de2;
+ font-size: 2rem;
+}
+
+.badge-icon {
+ position: absolute;
+ bottom: -0.2rem;
+ right: -0.2rem;
+ color: #f2a10d;
+ font-size: 1.2rem;
+}
+
+.certificate-card p {
+ font-size: 0.92rem;
+ font-weight: 700;
+ color: #16a34a;
+ letter-spacing: 0.04em;
+}
+
+.feedback {
+ min-height: 1.2rem;
+ font-size: 0.85rem;
+ margin-top: 1rem;
+ text-align: center;
+}
+
+.feedback.success {
+ color: #16a34a;
+}
+
+.feedback.error {
+ color: #dc2626;
+}
+
+.action-row {
+ margin-top: 1rem;
+ display: flex;
+ justify-content: center;
+}
+
+.action-btn {
+ border: none;
+ padding: 0.9rem 1.2rem;
+ border-radius: 0.5rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+}
+
+.secondary-btn {
+ background: #223f6b;
+ color: #ffffff;
+}
+
+.secondary-btn:hover {
+ opacity: 0.94;
+}
+
+.secondary-btn:disabled {
+ opacity: 0.7;
+ cursor: not-allowed;
+}
+
+@media (max-width: 36rem) {
+ .modal {
+ padding: 1.2rem;
+ }
+
+ .details-grid {
+ grid-template-columns: 1fr;
+ gap: 0.4rem;
+ }
+
+ .label {
+ margin-top: 0.4rem;
+ }
+
+ .action-btn {
+ width: 100%;
+ }
+}
\ No newline at end of file
diff --git a/Admin/certificates/certificate-preview.html b/Admin/certificates/certificate-preview.html
new file mode 100644
index 0000000..a6a53b8
--- /dev/null
+++ b/Admin/certificates/certificate-preview.html
@@ -0,0 +1,60 @@
+
+
+
+ Certificate Preview
+
+
+
+
+
+
Certificate Preview
+
+
+
Volunteer Name:
+
Loading...
+
+
Event Name:
+
Loading...
+
+
Phone No:
+
—
+
+
Org. Name:
+
—
+
+
Events Date:
+
—
+
+
+
+
+
+
+
+
+ Download Certificate
+
+
+
+
AIDLoop - Certificates
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Status: All
+ Issued
+ Not Issued
+
+
+
+
+
+
+ VOLUNTEER NAME
+ EVENT NAME
+ ORGANIZER
+ DATE ISSUED
+ ACTIONS
+
+
+
+
+
+ Loading certificates...
+
+
+
+
+
+
+
+
No certificates found
+
No certificate records match the current filter.
+
+
+
+
+
+
+ ×
+
+
+
+
+
+
Log out?
+
You are about to end your current admin session.
+
+
+ Cancel
+ Yes, Log out
+
+
+
+ ${getVolunteerName(item)}
+ ${getEventName(item)}
+ ${getOrganizerName(item)}
+ ${formatDate(item.issuedAt || item.createdAt || item.date)}
+
+
+ View Certificate
+
+
+
+ `;
+ }).join("");
+}
+
+async function loadAdminProfile() {
+ try {
+ let profile;
+ try {
+ profile = await apiRequest("/users/me");
+ } catch {
+ profile = await apiRequest("/user/me");
+ }
+
+ els.adminName.textContent =
+ profile.fullName ||
+ profile.name ||
+ "Admin User";
+
+ els.adminRole.textContent =
+ profile.role
+ ? profile.role.charAt(0).toUpperCase() + profile.role.slice(1)
+ : "Admin";
+
+ if (profile.profileImage) {
+ els.adminAvatar.src = profile.profileImage;
+ }
+ } catch (error) {
+ console.error("Failed to load admin profile:", error.message);
+ window.location.href = "../profile/admin-profile.html";
+ }
+}
+
+async function loadCertificates() {
+ try {
+ const payload = await apiRequest("/certificates/my-certificates");
+ certificateRowsCache = normalizeCertificates(payload);
+ renderCertificates();
+ } catch (error) {
+ console.error("Failed to load certificates:", error.message);
+ certificateRowsCache = [];
+ renderCertificates();
+ }
+}
+
+function bindFilters() {
+ els.filterButtons.forEach((button) => {
+ button.addEventListener("click", () => {
+ els.filterButtons.forEach((btn) => btn.classList.remove("active"));
+ button.classList.add("active");
+ currentFilter = button.dataset.filter;
+ renderCertificates();
+ });
+ });
+}
+
+function bindUI() {
+ els.searchInput.addEventListener("input", renderCertificates);
+
+ bindFilters();
+
+ els.logoutBtn.addEventListener("click", openLogoutModal);
+ els.closeLogoutModal.addEventListener("click", closeLogoutModal);
+ els.cancelLogout.addEventListener("click", closeLogoutModal);
+ els.confirmLogout.addEventListener("click", handleLogout);
+
+ els.logoutModal.addEventListener("click", (event) => {
+ if (event.target === els.logoutModal) {
+ closeLogoutModal();
+ }
+ });
+
+ document.addEventListener("keydown", (event) => {
+ if (event.key === "Escape" && !els.logoutModal.classList.contains("hidden")) {
+ closeLogoutModal();
+ }
+ });
+}
+
+document.addEventListener("DOMContentLoaded", async () => {
+ bindUI();
+ await loadAdminProfile();
+ await loadCertificates();
+});
\ No newline at end of file
diff --git a/Admin/dashboard/admin-dashboard.css b/Admin/dashboard/admin-dashboard.css
new file mode 100644
index 0000000..e5a23e6
--- /dev/null
+++ b/Admin/dashboard/admin-dashboard.css
@@ -0,0 +1,520 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.dashboard-layout {
+ display: flex;
+ min-height: 100vh;
+}
+
+/* Sidebar */
+.sidebar {
+ width: 15rem;
+ background: #223f6b;
+ color: #ffffff;
+ padding: 1.8rem 0.9rem;
+}
+
+.sidebar-logo {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 0.35rem;
+ margin-bottom: 2.4rem;
+}
+
+.sidebar-logo img {
+ width: 3.1rem;
+ height: 3.1rem;
+ object-fit: contain;
+}
+
+.sidebar-logo h2 {
+ font-size: 1.25rem;
+ font-weight: 700;
+ color: #1d7de2;
+}
+
+.sidebar-logo h2 span {
+ color: #27a657;
+}
+
+.sidebar-menu {
+ list-style: none;
+}
+
+.sidebar-menu li {
+ margin-bottom: 0.8rem;
+}
+
+.sidebar-menu li a {
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ text-decoration: none;
+ color: #ffffff;
+ padding: 0.9rem 0.85rem;
+ border-radius: 0.45rem;
+ font-size: 0.95rem;
+ transition: background 0.2s ease;
+}
+
+.sidebar-menu li a i {
+ width: 1rem;
+ text-align: center;
+}
+
+.sidebar-menu li.active a,
+.sidebar-menu li a:hover {
+ background: #1d7de2;
+}
+
+/* Logout Button */
+.logout-btn {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ border: none;
+ background: transparent;
+ color: #ffffff;
+ padding: 0.9rem 0.85rem;
+ border-radius: 0.45rem;
+ font-size: 0.95rem;
+ cursor: pointer;
+ transition: background 0.2s ease;
+}
+
+.logout-btn i {
+ width: 1rem;
+ text-align: center;
+}
+
+.logout-btn:hover {
+ background: #ef2f2f;
+}
+
+/* Main */
+.main-content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+/* Topbar */
+.topbar {
+ height: 5.8rem;
+ background: #ffffff;
+ border-bottom: 0.0625rem solid #e6e8eb;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 1.8rem;
+}
+
+.search-box {
+ width: 21rem;
+ height: 2.9rem;
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ border: 0.0625rem solid #d9dde3;
+ border-radius: 0.35rem;
+ padding: 0 0.9rem;
+ background: #ffffff;
+}
+
+.search-box i {
+ color: #6b7280;
+ font-size: 0.95rem;
+}
+
+.search-box input {
+ width: 100%;
+ border: none;
+ outline: none;
+ background: transparent;
+ font-size: 0.95rem;
+ color: #374151;
+}
+
+.topbar-right {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.notification {
+ position: relative;
+ color: #111827;
+ font-size: 1.2rem;
+}
+
+.notification-dot {
+ position: absolute;
+ top: 0.08rem;
+ right: -0.12rem;
+ width: 0.45rem;
+ height: 0.45rem;
+ background: #ef2f2f;
+ border-radius: 50%;
+}
+
+.admin-profile {
+ display: flex;
+ align-items: center;
+ gap: 0.7rem;
+}
+
+.user-avatar {
+ width: 2.45rem;
+ height: 2.45rem;
+ border-radius: 50%;
+ object-fit: cover;
+}
+
+.admin-text h4 {
+ font-size: 0.82rem;
+ font-weight: 600;
+ color: #172033;
+ line-height: 1.2;
+}
+
+.admin-text p {
+ font-size: 0.72rem;
+ color: #6b7280;
+ line-height: 1.2;
+}
+
+.admin-chevron {
+ color: #6b7280;
+ font-size: 0.7rem;
+}
+
+/* Content */
+.page-content {
+ padding: 4rem 1.4rem 2rem;
+}
+
+.page-header {
+ margin-bottom: 2rem;
+}
+
+.page-header h1 {
+ font-size: 2.1rem;
+ font-weight: 700;
+ margin-bottom: 0.3rem;
+}
+
+.page-header p {
+ font-size: 0.78rem;
+ color: #6b7280;
+}
+
+/* Stats */
+.stats-grid {
+ display: grid;
+ grid-template-columns: repeat(4, minmax(0, 1fr));
+ gap: 1.4rem;
+ margin-bottom: 2.8rem;
+ max-width: 40rem;
+}
+
+.stat-card {
+ background: #ffffff;
+ border: 0.0625rem solid #7f8ea5;
+ border-radius: 0.6rem;
+ overflow: hidden;
+ min-height: 5.8rem;
+}
+
+.stat-value {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 3rem;
+ font-size: 1.8rem;
+ font-weight: 700;
+ color: #111827;
+}
+
+.stat-footer {
+ height: 2.8rem;
+ border-top: 0.0625rem solid #b8c1cd;
+ display: flex;
+ align-items: center;
+ gap: 0.7rem;
+ padding: 0 1.1rem;
+ font-size: 0.65rem;
+ color: #172033;
+}
+
+.stat-footer i {
+ color: #1d7de2;
+ font-size: 1rem;
+}
+
+/* Section titles */
+.quick-actions-section h2,
+.recent-activity-section h2 {
+ font-size: 1.05rem;
+ font-weight: 700;
+ margin-bottom: 1.15rem;
+}
+
+/* Quick actions */
+.quick-actions-section {
+ margin-bottom: 3rem;
+ max-width: 42rem;
+}
+
+.quick-actions {
+ display: grid;
+ grid-template-columns: repeat(3, 1fr);
+ gap: 2rem;
+}
+
+.quick-btn {
+ border: none;
+ background: #1d7de2;
+ color: #ffffff;
+ padding: 0.85rem 1rem;
+ border-radius: 0.2rem;
+ font-size: 0.65rem;
+ cursor: pointer;
+ transition: opacity 0.2s ease, transform 0.15s ease;
+}
+
+.quick-btn:hover {
+ opacity: 0.92;
+}
+
+.quick-btn:active {
+ transform: scale(0.98);
+}
+
+/* Recent activity */
+.recent-activity-section {
+ max-width: 42rem;
+}
+
+.table-wrapper {
+ background: #ffffff;
+ overflow: hidden;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+thead {
+ background: #f4f6f8;
+}
+
+th,
+td {
+ text-align: left;
+ padding: 1rem 1.4rem;
+}
+
+th {
+ font-size: 0.62rem;
+ letter-spacing: 0.08em;
+ color: #7b8492;
+ font-weight: 700;
+}
+
+td {
+ font-size: 0.68rem;
+ color: #172033;
+ border-top: 0.0625rem solid #eef1f3;
+}
+
+.status-badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 4.7rem;
+ padding: 0.35rem 0.7rem;
+ border-radius: 0.45rem;
+ background: #f2a10d;
+ color: #ffffff;
+ font-size: 0.58rem;
+ font-weight: 700;
+}
+
+.status-badge.pending {
+ background: #f2a10d;
+ color: #fff;
+}
+
+.status-badge.published {
+ background: #16a34a;
+ color: #fff;
+}
+
+.status-badge.completed {
+ background: #2563eb;
+ color: #fff;
+}
+
+/* Logout Modal */
+.hidden {
+ display: none !important;
+}
+
+.modal-overlay {
+ position: fixed;
+ inset: 0;
+ background: rgba(15, 23, 42, 0.45);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1rem;
+ z-index: 999;
+}
+
+.modal-card {
+ width: 100%;
+ max-width: 25rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.5rem;
+ position: relative;
+ text-align: center;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.15);
+}
+
+.modal-close-btn {
+ position: absolute;
+ top: 0.7rem;
+ right: 0.9rem;
+ border: none;
+ background: transparent;
+ font-size: 1.5rem;
+ color: #6b7280;
+ cursor: pointer;
+}
+
+.modal-icon-wrap {
+ width: 3.5rem;
+ height: 3.5rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #fee2e2;
+ color: #dc2626;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.25rem;
+}
+
+.modal-card h3 {
+ font-size: 1.2rem;
+ margin-bottom: 0.5rem;
+ color: #172033;
+}
+
+.modal-card p {
+ font-size: 0.92rem;
+ color: #6b7280;
+ margin-bottom: 1.3rem;
+}
+
+.modal-actions {
+ display: flex;
+ gap: 0.8rem;
+ justify-content: center;
+}
+
+.modal-btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.8rem 1rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+ min-width: 8rem;
+}
+
+.modal-btn.secondary {
+ background: #e5e7eb;
+ color: #172033;
+}
+
+.modal-btn.danger {
+ background: #dc2626;
+ color: #ffffff;
+}
+
+/* Responsive */
+@media (max-width: 75rem) {
+ .stats-grid,
+ .quick-actions {
+ grid-template-columns: repeat(2, 1fr);
+ max-width: none;
+ }
+
+ .recent-activity-section,
+ .quick-actions-section {
+ max-width: none;
+ }
+
+ .table-wrapper {
+ overflow-x: auto;
+ }
+
+ table {
+ min-width: 42rem;
+ }
+}
+
+@media (max-width: 62rem) {
+ .sidebar {
+ display: none;
+ }
+
+ .topbar {
+ padding: 0 1rem;
+ }
+
+ .search-box {
+ width: 16rem;
+ }
+
+ .page-content {
+ padding: 2rem 1rem;
+ }
+
+ .admin-text,
+ .admin-chevron {
+ display: none;
+ }
+}
+
+@media (max-width: 36rem) {
+ .stats-grid,
+ .quick-actions {
+ grid-template-columns: 1fr;
+ }
+
+ .search-box {
+ width: 12rem;
+ }
+
+ .modal-actions {
+ flex-direction: column;
+ }
+
+ .modal-btn {
+ width: 100%;
+ }
+}
\ No newline at end of file
diff --git a/Admin/dashboard/admin-dashboard.html b/Admin/dashboard/admin-dashboard.html
new file mode 100644
index 0000000..4b2cf57
--- /dev/null
+++ b/Admin/dashboard/admin-dashboard.html
@@ -0,0 +1,197 @@
+
+
+
+ AIDLoop Dashboard
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Quick Actions
+
+
+
+ Go to Verification Queue
+
+
+
+ View Organizations
+
+
+
+ View Events
+
+
+
+
+
+
+ Recent Activity
+
+
+
+
+
+ ACTIVITY
+ ENTITY
+ DATE
+ STATUS
+
+
+
+
+
+ Loading recent activity...
+
+
+
+
+
+
+
+
+
+ ×
+
+
+
+
+
+
Log out?
+
You are about to end your current admin session.
+
+
+ Cancel
+ Yes, Log out
+
+
+
+ No matching activity found.
+
+ `;
+ return;
+ }
+
+ els.activityTable.innerHTML = filtered
+ .map(
+ (row) => `
+
+ ${row.activity}
+ ${row.entity}
+ ${row.formattedDate}
+
+
+ ${row.status}
+
+
+
+ `
+ )
+ .join("");
+}
+
+function openLogoutModal() {
+ els.logoutModal.classList.remove("hidden");
+}
+
+function closeLogoutModal() {
+ els.logoutModal.classList.add("hidden");
+ els.confirmLogout.disabled = false;
+ els.confirmLogout.textContent = "Yes, Log out";
+}
+
+async function handleLogout() {
+ try {
+ els.confirmLogout.disabled = true;
+ els.confirmLogout.textContent = "Logging out...";
+
+ await apiRequest("/auth/logout", {
+ method: "POST"
+ });
+ } catch (error) {
+ console.warn("Logout failed:", error.message);
+ } finally {
+ localStorage.clear();
+ sessionStorage.clear();
+ window.location.href = "../../index.html";
+ }
+}
+
+async function loadAdminProfile() {
+ try {
+ let profile;
+ try {
+ profile = await apiRequest("/users/me");
+ } catch {
+ profile = await apiRequest("/user/me");
+ }
+
+ els.adminName.textContent =
+ profile.fullName ||
+ profile.name ||
+ "Admin User";
+
+ els.adminRole.textContent =
+ profile.role
+ ? profile.role.charAt(0).toUpperCase() + profile.role.slice(1)
+ : "Admin";
+
+ if (profile.profileImage) {
+ els.adminAvatar.src = profile.profileImage;
+ }
+ } catch (error) {
+ console.error("Failed to load admin profile:", error.message);
+ window.location.href = "../profile/admin-profile.html";
+ }
+}
+
+async function loadDashboardData() {
+ try {
+ const [usersPayload, eventsPayload] = await Promise.all([
+ apiRequest("/user").catch(() => apiRequest("/users")),
+ apiRequest("/events")
+ ]);
+
+ const users = normalizeUsers(usersPayload);
+ const events = normalizeEvents(eventsPayload);
+
+ const organizers = users.filter(
+ (user) => String(user.role || "").toLowerCase() === "organizer"
+ );
+
+ const pendingOrganizers = organizers.filter((user) => {
+ const status = String(user.status || "").toLowerCase();
+ const approvalStatus = String(user.approvalStatus || "").toLowerCase();
+ return status === "pending" || approvalStatus === "pending";
+ });
+
+ const activeUsers = users.filter((user) => user.isActive !== false);
+
+ setStatValue(els.organizationCount, organizers.length);
+ setStatValue(els.pendingCount, pendingOrganizers.length);
+ setStatValue(els.eventsCount, events.length);
+ setStatValue(els.activeUsersCount, activeUsers.length);
+
+ const recentActivity = buildRecentActivity(users, events);
+ renderRecentActivity(recentActivity);
+ } catch (error) {
+ console.error("Failed to load dashboard data:", error.message);
+ els.activityTable.innerHTML = `
+
+ Failed to load dashboard data.
+
+ `;
+ }
+}
+
+function bindUI() {
+ els.goVerificationQueue.addEventListener("click", () => {
+ window.location.href = "../verification/verification-queue.html";
+ });
+
+ els.viewOrganizations.addEventListener("click", () => {
+ window.location.href = "../organizations/organization-directory.html";
+ });
+
+ els.viewEvents.addEventListener("click", () => {
+ window.location.href = "../events/events-oversight.html";
+ });
+
+ els.searchInput.addEventListener("input", applyActivitySearch);
+
+ els.logoutBtn.addEventListener("click", openLogoutModal);
+ els.closeLogoutModal.addEventListener("click", closeLogoutModal);
+ els.cancelLogout.addEventListener("click", closeLogoutModal);
+ els.confirmLogout.addEventListener("click", handleLogout);
+
+ els.logoutModal.addEventListener("click", (event) => {
+ if (event.target === els.logoutModal) {
+ closeLogoutModal();
+ }
+ });
+
+ document.addEventListener("keydown", (event) => {
+ if (event.key === "Escape" && !els.logoutModal.classList.contains("hidden")) {
+ closeLogoutModal();
+ }
+ });
+}
+
+document.addEventListener("DOMContentLoaded", async () => {
+ bindUI();
+ await loadAdminProfile();
+ await loadDashboardData();
+});
\ No newline at end of file
diff --git a/Admin/events/event-details.css b/Admin/events/event-details.css
new file mode 100644
index 0000000..0abe53c
--- /dev/null
+++ b/Admin/events/event-details.css
@@ -0,0 +1,186 @@
+ * {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.overlay {
+ min-height: 100vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1.5rem;
+}
+
+.modal-card {
+ width: 100%;
+ max-width: 42rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.8rem;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.12);
+}
+
+.modal-header {
+ display: flex;
+ align-items: flex-start;
+ justify-content: space-between;
+ gap: 1rem;
+ margin-bottom: 1.5rem;
+}
+
+.modal-header h1 {
+ font-size: 1.6rem;
+ font-weight: 700;
+ color: #172033;
+ line-height: 1.3;
+}
+
+.status-badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 6rem;
+ padding: 0.45rem 0.85rem;
+ border-radius: 0.55rem;
+ color: #ffffff;
+ font-size: 0.72rem;
+ font-weight: 700;
+ text-transform: capitalize;
+}
+
+.status-badge.published {
+ background: #16a34a;
+}
+
+.status-badge.cancelled {
+ background: #dc2626;
+}
+
+.status-badge.draft {
+ background: #6b7280;
+}
+
+.details-grid {
+ display: grid;
+ grid-template-columns: 8rem 1fr;
+ gap: 0.9rem 1rem;
+ margin-bottom: 1.6rem;
+}
+
+.label {
+ font-size: 0.9rem;
+ font-weight: 600;
+ color: #223f6b;
+}
+
+.value {
+ font-size: 0.9rem;
+ color: #374151;
+ word-break: break-word;
+}
+
+.description-section h2 {
+ font-size: 1rem;
+ font-weight: 700;
+ margin-bottom: 0.7rem;
+ color: #172033;
+}
+
+.description-box {
+ background: #f8fafc;
+ border: 0.0625rem solid #e5e7eb;
+ border-radius: 0.75rem;
+ padding: 1rem;
+ font-size: 0.9rem;
+ line-height: 1.7;
+ color: #374151;
+}
+
+.feedback {
+ min-height: 1.2rem;
+ margin-top: 1rem;
+ text-align: center;
+ font-size: 0.85rem;
+}
+
+.feedback.success {
+ color: #16a34a;
+}
+
+.feedback.error {
+ color: #dc2626;
+}
+
+.action-row {
+ margin-top: 1.3rem;
+ display: flex;
+ justify-content: flex-end;
+ gap: 0.8rem;
+}
+
+.action-btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.85rem 1.2rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+}
+
+.close-btn {
+ background: #e5e7eb;
+ color: #172033;
+}
+
+.flag-btn {
+ background: #dc2626;
+ color: #ffffff;
+}
+
+.flag-btn:disabled {
+ opacity: 0.7;
+ cursor: not-allowed;
+}
+
+.social-link {
+ color: #1d7de2;
+ text-decoration: none;
+}
+
+.social-link:hover {
+ text-decoration: underline;
+}
+
+@media (max-width: 36rem) {
+ .modal-card {
+ padding: 1.2rem;
+ }
+
+ .modal-header {
+ flex-direction: column;
+ align-items: flex-start;
+ }
+
+ .details-grid {
+ grid-template-columns: 1fr;
+ gap: 0.4rem;
+ }
+
+ .label {
+ margin-top: 0.4rem;
+ }
+
+ .action-row {
+ flex-direction: column;
+ }
+
+ .action-btn {
+ width: 100%;
+ }
+}
\ No newline at end of file
diff --git a/Admin/events/event-details.html b/Admin/events/event-details.html
new file mode 100644
index 0000000..fd70c1d
--- /dev/null
+++ b/Admin/events/event-details.html
@@ -0,0 +1,59 @@
+
+
+
+ Event Details
+
+
+
+
+
+
Org. Name:
+
—
+
+
Social Links:
+
—
+
+
Email:
+
—
+
+
Phone No:
+
—
+
+
Date / Time:
+
—
+
+
Slots Filled
+
—
+
+
+
+
Description
+
+ Loading event description...
+
+
+
+
+
+
+ Close
+ Flag Event
+
+
+
+ ${link}
+
+ `;
+}
+
+function getSlotsFilled(event) {
+ const filled =
+ event.filledSlots ??
+ event.registrationsCount ??
+ event.registeredCount ??
+ event.attendeesCount ??
+ 0;
+
+ const total = event.volunteerSlots ?? event.slots ?? 0;
+ return `${filled} / ${total}`;
+}
+
+function populateEvent(event) {
+ els.eventTitle.textContent = event.name || event.title || "Untitled Event";
+ setStatusBadge(event.status);
+
+ els.orgName.textContent = getOrganizerName(event);
+ els.email.textContent = getOrganizerEmail(event);
+ els.phoneNumber.textContent = getOrganizerPhone(event);
+
+ renderSocialLinks(getSocialLink(event));
+
+ const formattedDate = formatDate(event.date);
+ const startTime = formatTimeValue(event.startTime);
+ const endTime = formatTimeValue(event.endTime);
+
+ els.dateTime.textContent =
+ startTime && endTime
+ ? `${formattedDate} • ${startTime} - ${endTime}`
+ : startTime
+ ? `${formattedDate} • ${startTime}`
+ : formattedDate;
+
+ els.slotsFilled.textContent = getSlotsFilled(event);
+ els.description.textContent =
+ event.description || "No event description available.";
+}
+
+function setFeedback(message, type = "") {
+ els.feedback.textContent = message;
+ els.feedback.className = "feedback";
+ if (type) {
+ els.feedback.classList.add(type);
+ }
+}
+
+async function loadEventDetails() {
+ if (!eventId) {
+ setFeedback("No event ID provided.", "error");
+ els.flagBtn.disabled = true;
+ return;
+ }
+
+ try {
+ const payload = await apiRequest("/events");
+ const events = normalizeEvents(payload);
+
+ currentEvent = events.find(
+ (event) => String(event._id || event.id) === String(eventId)
+ );
+
+ if (!currentEvent) {
+ throw new Error("Event not found");
+ }
+
+ populateEvent(currentEvent);
+ } catch (error) {
+ els.eventTitle.textContent = "Unable to load event";
+ els.description.textContent = "Failed to fetch event details.";
+ setFeedback(error.message || "Failed to load event details.", "error");
+ els.flagBtn.disabled = true;
+ }
+}
+
+async function flagEvent() {
+ if (!eventId) return;
+
+ try {
+ els.flagBtn.disabled = true;
+ els.flagBtn.textContent = "Flagging...";
+
+ await apiRequest(`/events/${eventId}/cancel`, {
+ method: "PATCH",
+ body: JSON.stringify({
+ reason: "Flagged by admin"
+ })
+ });
+
+ setFeedback("Event flagged and cancelled successfully.", "success");
+ setStatusBadge("cancelled");
+ } catch (error) {
+ setFeedback(error.message || "Failed to flag event.", "error");
+ els.flagBtn.disabled = false;
+ els.flagBtn.textContent = "Flag Event";
+ }
+}
+
+function closeModal() {
+ if (window.history.length > 1) {
+ window.history.back();
+ return;
+ }
+
+ window.location.href = "events-oversight.html";
+}
+
+els.closeBtn.addEventListener("click", closeModal);
+els.flagBtn.addEventListener("click", flagEvent);
+
+document.addEventListener("DOMContentLoaded", loadEventDetails);
\ No newline at end of file
diff --git a/Admin/events/events-oversight.css b/Admin/events/events-oversight.css
new file mode 100644
index 0000000..b2b49a5
--- /dev/null
+++ b/Admin/events/events-oversight.css
@@ -0,0 +1,445 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.dashboard {
+ display: flex;
+ min-height: 100vh;
+}
+
+.sidebar {
+ width: 15rem;
+ background: #223f6b;
+ color: #ffffff;
+ padding: 1.8rem 0.9rem;
+}
+
+.sidebar-logo {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 0.35rem;
+ margin-bottom: 2.4rem;
+}
+
+.sidebar-logo img {
+ width: 3.1rem;
+ height: 3.1rem;
+ object-fit: contain;
+}
+
+.sidebar-menu {
+ list-style: none;
+}
+
+.sidebar-menu li {
+ margin-bottom: 0.8rem;
+}
+
+.sidebar-menu li a,
+.logout-btn {
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ text-decoration: none;
+ color: #ffffff;
+ padding: 0.9rem 0.85rem;
+ border-radius: 0.45rem;
+ font-size: 0.95rem;
+ transition: background 0.2s ease;
+ width: 100%;
+ border: none;
+ background: transparent;
+ cursor: pointer;
+}
+
+.sidebar-menu li a i,
+.logout-btn i {
+ width: 1rem;
+ text-align: center;
+}
+
+.sidebar-menu li.active a,
+.sidebar-menu li a:hover {
+ background: #1d7de2;
+}
+
+.logout-btn:hover {
+ background: #ef2f2f;
+}
+
+.main-content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.topbar {
+ height: 5.8rem;
+ background: #ffffff;
+ border-bottom: 0.0625rem solid #e6e8eb;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 1.8rem;
+}
+
+.search-box {
+ width: 21rem;
+ height: 2.9rem;
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ border: 0.0625rem solid #d9dde3;
+ border-radius: 0.35rem;
+ padding: 0 0.9rem;
+ background: #ffffff;
+}
+
+.search-box i {
+ color: #6b7280;
+ font-size: 0.95rem;
+}
+
+.search-box input {
+ width: 100%;
+ border: none;
+ outline: none;
+ background: transparent;
+ font-size: 0.95rem;
+ color: #374151;
+}
+
+.topbar-right {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.notification {
+ position: relative;
+ color: #111827;
+ font-size: 1.2rem;
+}
+
+.notification-dot {
+ position: absolute;
+ top: 0.08rem;
+ right: -0.12rem;
+ width: 0.45rem;
+ height: 0.45rem;
+ background: #ef2f2f;
+ border-radius: 50%;
+}
+
+.admin-profile {
+ display: flex;
+ align-items: center;
+ gap: 0.7rem;
+}
+
+.user-avatar {
+ width: 2.45rem;
+ height: 2.45rem;
+ border-radius: 50%;
+ object-fit: cover;
+}
+
+.admin-text h4 {
+ font-size: 0.82rem;
+ font-weight: 600;
+ color: #172033;
+ line-height: 1.2;
+}
+
+.admin-text p {
+ font-size: 0.72rem;
+ color: #6b7280;
+ line-height: 1.2;
+}
+
+.admin-chevron {
+ color: #6b7280;
+ font-size: 0.7rem;
+}
+
+.page-content {
+ padding: 4rem 1.4rem 2rem;
+}
+
+.page-header {
+ margin-bottom: 2rem;
+}
+
+.page-header h1 {
+ font-size: 2.1rem;
+ font-weight: 700;
+ margin-bottom: 0.3rem;
+}
+
+.page-header p {
+ font-size: 0.78rem;
+ color: #6b7280;
+}
+
+.filter-buttons {
+ display: flex;
+ gap: 0.8rem;
+ margin-bottom: 1.4rem;
+ flex-wrap: wrap;
+}
+
+.filter-btn {
+ border: 0.0625rem solid #d9dde3;
+ background: #ffffff;
+ color: #374151;
+ padding: 0.75rem 1rem;
+ border-radius: 0.4rem;
+ font-size: 0.8rem;
+ cursor: pointer;
+}
+
+.filter-btn.active {
+ background: #1d7de2;
+ color: #ffffff;
+ border-color: #1d7de2;
+}
+
+.table-wrapper {
+ background: #ffffff;
+ overflow: hidden;
+ border-radius: 0.6rem;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+thead {
+ background: #f4f6f8;
+}
+
+th,
+td {
+ text-align: left;
+ padding: 1rem 1.4rem;
+}
+
+th {
+ font-size: 0.62rem;
+ letter-spacing: 0.08em;
+ color: #7b8492;
+ font-weight: 700;
+}
+
+td {
+ font-size: 0.72rem;
+ color: #172033;
+ border-top: 0.0625rem solid #eef1f3;
+}
+
+.status-badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 5.2rem;
+ padding: 0.35rem 0.7rem;
+ border-radius: 0.45rem;
+ color: #ffffff;
+ font-size: 0.58rem;
+ font-weight: 700;
+}
+
+.status-badge.published {
+ background: #16a34a;
+}
+
+.status-badge.cancelled {
+ background: #dc2626;
+}
+
+.status-badge.draft {
+ background: #6b7280;
+}
+
+.action-link {
+ color: #1d7de2;
+ text-decoration: none;
+ font-weight: 600;
+}
+
+.action-link:hover {
+ text-decoration: underline;
+}
+
+.empty-state {
+ text-align: center;
+ padding: 3rem 1rem;
+}
+
+.empty-icon {
+ width: 4rem;
+ height: 4rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #e8f0fb;
+ color: #1d7de2;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.4rem;
+}
+
+.empty-state h2 {
+ font-size: 1.1rem;
+ margin-bottom: 0.4rem;
+}
+
+.empty-state p {
+ color: #6b7280;
+ font-size: 0.85rem;
+}
+
+/* Logout Modal */
+.hidden {
+ display: none !important;
+}
+
+.modal-overlay {
+ position: fixed;
+ inset: 0;
+ background: rgba(15, 23, 42, 0.45);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1rem;
+ z-index: 999;
+}
+
+.modal-card {
+ width: 100%;
+ max-width: 25rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.5rem;
+ position: relative;
+ text-align: center;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.15);
+}
+
+.modal-close-btn {
+ position: absolute;
+ top: 0.7rem;
+ right: 0.9rem;
+ border: none;
+ background: transparent;
+ font-size: 1.5rem;
+ color: #6b7280;
+ cursor: pointer;
+}
+
+.modal-icon-wrap {
+ width: 3.5rem;
+ height: 3.5rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #fee2e2;
+ color: #dc2626;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.25rem;
+}
+
+.modal-card h3 {
+ font-size: 1.2rem;
+ margin-bottom: 0.5rem;
+ color: #172033;
+}
+
+.modal-card p {
+ font-size: 0.92rem;
+ color: #6b7280;
+ margin-bottom: 1.3rem;
+}
+
+.modal-actions {
+ display: flex;
+ gap: 0.8rem;
+ justify-content: center;
+}
+
+.modal-btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.8rem 1rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+ min-width: 8rem;
+}
+
+.modal-btn.secondary {
+ background: #e5e7eb;
+ color: #172033;
+}
+
+.modal-btn.danger {
+ background: #dc2626;
+ color: #ffffff;
+}
+
+@media (max-width: 75rem) {
+ .table-wrapper {
+ overflow-x: auto;
+ }
+
+ table {
+ min-width: 46rem;
+ }
+}
+
+@media (max-width: 62rem) {
+ .sidebar {
+ display: none;
+ }
+
+ .topbar {
+ padding: 0 1rem;
+ }
+
+ .search-box {
+ width: 16rem;
+ }
+
+ .page-content {
+ padding: 2rem 1rem;
+ }
+
+ .admin-text,
+ .admin-chevron {
+ display: none;
+ }
+}
+
+@media (max-width: 36rem) {
+ .search-box {
+ width: 12rem;
+ }
+
+ .modal-actions {
+ flex-direction: column;
+ }
+
+ .modal-btn {
+ width: 100%;
+ }
+}
\ No newline at end of file
diff --git a/Admin/events/events-oversight.html b/Admin/events/events-oversight.html
new file mode 100644
index 0000000..ca5cbc2
--- /dev/null
+++ b/Admin/events/events-oversight.html
@@ -0,0 +1,157 @@
+
+
+
+ AIDLoop - Events Oversight
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Status: All
+ Published
+ Cancelled
+
+
+
+
+
+
+ EVENT NAME
+ CONTACT EMAIL
+ LOCATION
+ STATUS
+ ACTIONS
+
+
+
+
+
+ Loading events...
+
+
+
+
+
+
+
+
No Events Found
+
Events created by organizations will appear here.
+
+
+
+
+
+
+ ×
+
+
+
+
+
+
Log out?
+
You are about to end your current admin session.
+
+
+ Cancel
+ Yes, Log out
+
+
+
+ ${getEventTitle(event)}
+ ${getContactEmail(event)}
+ ${formatLocation(event)}
+
+
+ ${status.charAt(0).toUpperCase() + status.slice(1)}
+
+
+
+
+ View Details
+
+
+
+ `;
+ }).join("");
+}
+
+function bindFilters() {
+ els.filterButtons.forEach((button) => {
+ button.addEventListener("click", () => {
+ els.filterButtons.forEach((btn) => btn.classList.remove("active"));
+ button.classList.add("active");
+ currentFilter = button.dataset.filter;
+ renderEvents();
+ });
+ });
+}
+
+function openLogoutModal() {
+ els.logoutModal.classList.remove("hidden");
+}
+
+function closeLogoutModal() {
+ els.logoutModal.classList.add("hidden");
+ els.confirmLogout.disabled = false;
+ els.confirmLogout.textContent = "Yes, Log out";
+}
+
+async function handleLogout() {
+ try {
+ els.confirmLogout.disabled = true;
+ els.confirmLogout.textContent = "Logging out...";
+
+ await apiRequest("/auth/logout", {
+ method: "POST"
+ });
+ } catch (error) {
+ console.warn("Logout failed:", error.message);
+ } finally {
+ localStorage.clear();
+ sessionStorage.clear();
+ window.location.href = "../../index.html";
+ }
+}
+
+async function loadAdminProfile() {
+ try {
+ let profile;
+ try {
+ profile = await apiRequest("/users/me");
+ } catch {
+ profile = await apiRequest("/user/me");
+ }
+
+ els.adminName.textContent =
+ profile.fullName ||
+ profile.name ||
+ "Admin User";
+
+ els.adminRole.textContent =
+ profile.role
+ ? profile.role.charAt(0).toUpperCase() + profile.role.slice(1)
+ : "Admin";
+
+ if (profile.profileImage) {
+ els.adminAvatar.src = profile.profileImage;
+ }
+ } catch (error) {
+ console.error("Failed to load admin profile:", error.message);
+ window.location.href = "../profile/admin-profile.html";
+ }
+}
+
+async function loadEvents() {
+ try {
+ const payload = await apiRequest("/events");
+ eventsCache = normalizeEvents(payload);
+ renderEvents();
+ } catch (error) {
+ console.error("Failed to load events:", error.message);
+ els.eventsTable.innerHTML = `
+
+ Failed to load events.
+
+ `;
+ }
+}
+
+function bindUI() {
+ els.searchInput.addEventListener("input", renderEvents);
+
+ bindFilters();
+
+ els.logoutBtn.addEventListener("click", openLogoutModal);
+ els.closeLogoutModal.addEventListener("click", closeLogoutModal);
+ els.cancelLogout.addEventListener("click", closeLogoutModal);
+ els.confirmLogout.addEventListener("click", handleLogout);
+
+ els.logoutModal.addEventListener("click", (event) => {
+ if (event.target === els.logoutModal) {
+ closeLogoutModal();
+ }
+ });
+
+ document.addEventListener("keydown", (event) => {
+ if (event.key === "Escape" && !els.logoutModal.classList.contains("hidden")) {
+ closeLogoutModal();
+ }
+ });
+}
+
+document.addEventListener("DOMContentLoaded", async () => {
+ bindUI();
+ await loadAdminProfile();
+ await loadEvents();
+});
\ No newline at end of file
diff --git a/Admin/flags/flag-details.css b/Admin/flags/flag-details.css
new file mode 100644
index 0000000..f7e2a6b
--- /dev/null
+++ b/Admin/flags/flag-details.css
@@ -0,0 +1,198 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.overlay {
+ min-height: 100vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1.5rem;
+}
+
+.modal-card {
+ width: 100%;
+ max-width: 40rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.8rem;
+ position: relative;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.12);
+}
+
+.close-btn {
+ position: absolute;
+ top: 0.8rem;
+ right: 1rem;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 1.5rem;
+ cursor: pointer;
+}
+
+.close-btn:hover {
+ color: #172033;
+}
+
+.modal-header {
+ display: flex;
+ align-items: flex-start;
+ justify-content: space-between;
+ gap: 1rem;
+ margin-bottom: 1.5rem;
+}
+
+.modal-header h1 {
+ font-size: 1.6rem;
+ font-weight: 700;
+ color: #172033;
+ line-height: 1.3;
+}
+
+.severity-badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 5.5rem;
+ padding: 0.45rem 0.8rem;
+ border-radius: 0.55rem;
+ color: #ffffff;
+ font-size: 0.72rem;
+ font-weight: 700;
+ text-transform: capitalize;
+}
+
+.severity-badge.low {
+ background: #16a34a;
+}
+
+.severity-badge.medium {
+ background: #f59e0b;
+}
+
+.severity-badge.high {
+ background: #dc2626;
+}
+
+.details-grid {
+ display: grid;
+ grid-template-columns: 9rem 1fr;
+ gap: 0.9rem 1rem;
+ margin-bottom: 1.5rem;
+}
+
+.label {
+ font-size: 0.9rem;
+ font-weight: 600;
+ color: #223f6b;
+}
+
+.value {
+ font-size: 0.9rem;
+ color: #374151;
+ word-break: break-word;
+}
+
+.description-section h2 {
+ font-size: 1rem;
+ font-weight: 700;
+ margin-bottom: 0.7rem;
+ color: #172033;
+}
+
+.description-box {
+ background: #f8fafc;
+ border: 0.0625rem solid #e5e7eb;
+ border-radius: 0.75rem;
+ padding: 1rem;
+ font-size: 0.9rem;
+ line-height: 1.7;
+ color: #374151;
+}
+
+.feedback {
+ min-height: 1.2rem;
+ margin-top: 1rem;
+ text-align: center;
+ font-size: 0.85rem;
+}
+
+.feedback.success {
+ color: #16a34a;
+}
+
+.feedback.error {
+ color: #dc2626;
+}
+
+.action-row {
+ margin-top: 1.3rem;
+ display: flex;
+ justify-content: flex-end;
+}
+
+.contact-btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.85rem 1.2rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+ background: #223f6b;
+ color: #ffffff;
+}
+
+.contact-btn:hover {
+ opacity: 0.94;
+}
+
+.contact-btn:disabled {
+ opacity: 0.7;
+ cursor: not-allowed;
+}
+
+@media (max-width: 36rem) {
+ .modal-card {
+ padding: 1.2rem;
+ }
+
+ .modal-header {
+ flex-direction: column;
+ align-items: flex-start;
+ }
+
+ .details-grid {
+ grid-template-columns: 1fr;
+ gap: 0.4rem;
+ }
+
+ .label {
+ margin-top: 0.4rem;
+ }
+
+ .action-row {
+ justify-content: stretch;
+ }
+
+ .contact-btn {
+ width: 100%;
+ }
+}
+
+
+
+
+
+
+
+
+
+
diff --git a/Admin/flags/flag-details.html b/Admin/flags/flag-details.html
new file mode 100644
index 0000000..575412e
--- /dev/null
+++ b/Admin/flags/flag-details.html
@@ -0,0 +1,51 @@
+
+
+
+ Flag Details
+
+
+
×
+
+
+
+
+
Org. Name:
+
Loading...
+
+
Flag Reason:
+
—
+
+
Last Event Cancelled
+
—
+
+
+
+
Description
+
+ Loading organizer description...
+
+
+
+
+
+
+ Contact Organizer
+
+
+
AIDLoop - Flags
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ORGANIZATION NAME
+ NUMBER OF CANCELLATIONS
+ SEVERITY
+ LAST EVENT DATE
+ FLAG REASON
+ ACTIONS
+
+
+
+
+
+ Loading flags...
+
+
+
+
+
+
+
+
No flags found
+
Flagged organizers and events will appear here.
+
+
+
+
+
+
+ ×
+
+
+
+
+
+
Log out?
+
You are about to end your current admin session.
+
+
+ Cancel
+ Yes, Log out
+
+
+
+ ${item.name}
+ ${item.cancellations}
+
+
+ ${item.severityLabel}
+
+
+ ${formatDate(item.lastEventDate)}
+ ${item.reason}
+
+
+ Review
+
+
+
+ `).join("");
+}
+
+function bindFilters() {
+ els.filterButtons.forEach((button) => {
+ button.addEventListener("click", () => {
+ els.filterButtons.forEach((btn) => btn.classList.remove("active"));
+ button.classList.add("active");
+ currentFilter = button.dataset.filter;
+ renderFlags();
+ });
+ });
+}
+
+function openLogoutModal() {
+ els.logoutModal.classList.remove("hidden");
+}
+
+function closeLogoutModal() {
+ els.logoutModal.classList.add("hidden");
+ els.confirmLogout.disabled = false;
+ els.confirmLogout.textContent = "Yes, Log out";
+}
+
+async function handleLogout() {
+ try {
+ els.confirmLogout.disabled = true;
+ els.confirmLogout.textContent = "Logging out...";
+
+ await apiRequest("/auth/logout", {
+ method: "POST"
+ });
+ } catch (error) {
+ console.warn("Logout failed:", error.message);
+ } finally {
+ localStorage.clear();
+ sessionStorage.clear();
+ window.location.href = "../../index.html";
+ }
+}
+
+async function loadAdminProfile() {
+ try {
+ let profile;
+ try {
+ profile = await apiRequest("/users/me");
+ } catch {
+ profile = await apiRequest("/user/me");
+ }
+
+ els.adminName.textContent =
+ profile.fullName ||
+ profile.name ||
+ "Admin User";
+
+ els.adminRole.textContent =
+ profile.role
+ ? profile.role.charAt(0).toUpperCase() + profile.role.slice(1)
+ : "Admin";
+
+ if (profile.profileImage) {
+ els.adminAvatar.src = profile.profileImage;
+ }
+ } catch (error) {
+ console.error("Failed to load admin profile:", error.message);
+ window.location.href = "../profile/admin-profile.html";
+ }
+}
+
+async function loadFlags() {
+ try {
+ const [usersPayload, eventsPayload] = await Promise.all([
+ apiRequest("/user").catch(() => apiRequest("/users")),
+ apiRequest("/events")
+ ]);
+
+ const users = normalizeUsers(usersPayload);
+ const events = normalizeEvents(eventsPayload);
+
+ flagsCache = buildFlags(users, events);
+ renderFlags();
+ } catch (error) {
+ console.error("Failed to load flags:", error.message);
+ els.flagsTable.innerHTML = `
+
+ Failed to load flags.
+
+ `;
+ }
+}
+
+function bindUI() {
+ els.searchInput.addEventListener("input", renderFlags);
+
+ bindFilters();
+
+ els.logoutBtn.addEventListener("click", openLogoutModal);
+ els.closeLogoutModal.addEventListener("click", closeLogoutModal);
+ els.cancelLogout.addEventListener("click", closeLogoutModal);
+ els.confirmLogout.addEventListener("click", handleLogout);
+
+ els.logoutModal.addEventListener("click", (event) => {
+ if (event.target === els.logoutModal) {
+ closeLogoutModal();
+ }
+ });
+
+ document.addEventListener("keydown", (event) => {
+ if (event.key === "Escape" && !els.logoutModal.classList.contains("hidden")) {
+ closeLogoutModal();
+ }
+ });
+}
+
+document.addEventListener("DOMContentLoaded", async () => {
+ bindUI();
+ await loadAdminProfile();
+ await loadFlags();
+});
\ No newline at end of file
diff --git a/Admin/login/admin-login.css b/Admin/login/admin-login.css
new file mode 100644
index 0000000..d328716
--- /dev/null
+++ b/Admin/login/admin-login.css
@@ -0,0 +1,210 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.login-page {
+ min-height: 100vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1.5rem;
+}
+
+.login-card {
+ width: 100%;
+ max-width: 31rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 2rem;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.08);
+}
+
+.logo-wrap {
+ text-align: center;
+ margin-bottom: 1.5rem;
+}
+
+.logo {
+ width: 4rem;
+ height: 4rem;
+ object-fit: contain;
+ margin-bottom: 0.75rem;
+}
+
+.tagline {
+ font-size: 0.85rem;
+ color: #6b7280;
+}
+
+.login-card h1 {
+ font-size: 1.7rem;
+ font-weight: 700;
+ color: #172033;
+ margin-bottom: 1.5rem;
+ text-align: center;
+}
+
+.form-group {
+ margin-bottom: 1rem;
+}
+
+.form-group label {
+ display: block;
+ font-size: 0.9rem;
+ font-weight: 600;
+ color: #223f6b;
+ margin-bottom: 0.45rem;
+}
+
+.form-group input {
+ width: 100%;
+ height: 3rem;
+ border: 0.0625rem solid #d9dde3;
+ border-radius: 0.55rem;
+ padding: 0 0.9rem;
+ font-size: 0.95rem;
+ outline: none;
+ background: #ffffff;
+ color: #374151;
+}
+
+.form-group input:focus {
+ border-color: #1d7de2;
+ box-shadow: 0 0 0 0.15rem rgba(29, 125, 226, 0.12);
+}
+
+.password-wrap {
+ position: relative;
+}
+
+.password-wrap input {
+ padding-right: 3rem;
+}
+
+.toggle-password {
+ position: absolute;
+ top: 50%;
+ right: 0.8rem;
+ transform: translateY(-50%);
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ cursor: pointer;
+ font-size: 1rem;
+}
+
+.remember-wrap {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.55rem;
+ cursor: pointer;
+ user-select: none;
+ margin: 0.35rem 0 1rem;
+}
+
+.remember-wrap input {
+ display: none;
+}
+
+.custom-check {
+ width: 1rem;
+ height: 1rem;
+ border: 0.0625rem solid #c5ccd6;
+ border-radius: 0.2rem;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ background: #ffffff;
+ color: transparent;
+ font-size: 0.65rem;
+}
+
+.remember-wrap input:checked + .custom-check {
+ background: #1d7de2;
+ border-color: #1d7de2;
+ color: #ffffff;
+}
+
+.remember-text {
+ font-size: 0.85rem;
+ color: #4b5563;
+}
+
+.error-message,
+.success-message {
+ display: block;
+ min-height: 1rem;
+ font-size: 0.78rem;
+ margin-top: 0.35rem;
+}
+
+.error-message {
+ color: #dc2626;
+}
+
+.success-message {
+ color: #16a34a;
+}
+
+.form-error,
+.success-message {
+ text-align: center;
+ margin-bottom: 0.5rem;
+}
+
+.button-group {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: 0.8rem;
+ margin-top: 0.5rem;
+}
+
+.btn {
+ height: 3rem;
+ border: none;
+ border-radius: 0.55rem;
+ font-size: 0.92rem;
+ font-weight: 600;
+ cursor: pointer;
+}
+
+.btn-primary {
+ background: #1d7de2;
+ color: #ffffff;
+}
+
+.btn-primary:hover {
+ opacity: 0.94;
+}
+
+.btn-secondary {
+ background: #e5e7eb;
+ color: #172033;
+}
+
+.btn-secondary:hover {
+ background: #dfe3e8;
+}
+
+.btn:disabled {
+ opacity: 0.7;
+ cursor: not-allowed;
+}
+
+@media (max-width: 32rem) {
+ .login-card {
+ padding: 1.3rem;
+ }
+
+ .button-group {
+ grid-template-columns: 1fr;
+ }
+}
\ No newline at end of file
diff --git a/Admin/login/admin-login.html b/Admin/login/admin-login.html
new file mode 100644
index 0000000..c821120
--- /dev/null
+++ b/Admin/login/admin-login.html
@@ -0,0 +1,81 @@
+
+
+
+ AIDLoop Admin Login
+
+
+
+
+
Connecting Volunteers to verified community events
+
Log in
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Admin/login/admin-login.js b/Admin/login/admin-login.js
new file mode 100644
index 0000000..ff31099
--- /dev/null
+++ b/Admin/login/admin-login.js
@@ -0,0 +1,147 @@
+const API_BASE_URL = "https://aidloop-backend.onrender.com/api";
+
+const els = {
+ loginForm: document.getElementById("loginForm"),
+ email: document.getElementById("email"),
+ password: document.getElementById("password"),
+ rememberMe: document.getElementById("rememberMe"),
+ loginBtn: document.getElementById("loginBtn"),
+ forgotPasswordBtn: document.getElementById("forgotPasswordBtn"),
+ togglePassword: document.getElementById("togglePassword"),
+ emailError: document.getElementById("emailError"),
+ passwordError: document.getElementById("passwordError"),
+ formError: document.getElementById("formError"),
+ formSuccess: document.getElementById("formSuccess")
+};
+
+async function apiRequest(endpoint, options = {}) {
+ const response = await fetch(`${API_BASE_URL}${endpoint}`, {
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json",
+ ...(options.headers || {})
+ },
+ ...options
+ });
+
+ const contentType = response.headers.get("content-type") || "";
+ const data = contentType.includes("application/json")
+ ? await response.json()
+ : await response.text();
+
+ if (!response.ok) {
+ throw new Error(
+ (data && data.message) ||
+ (data && data.error) ||
+ "Request failed"
+ );
+ }
+
+ return data;
+}
+
+function clearErrors() {
+ els.emailError.textContent = "";
+ els.passwordError.textContent = "";
+ els.formError.textContent = "";
+ els.formSuccess.textContent = "";
+}
+
+function validateEmail(value) {
+ return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value);
+}
+
+function validateForm() {
+ clearErrors();
+
+ const email = els.email.value.trim();
+ const password = els.password.value.trim();
+ let isValid = true;
+
+ if (!email) {
+ els.emailError.textContent = "Email address is required.";
+ isValid = false;
+ } else if (!validateEmail(email)) {
+ els.emailError.textContent = "Enter a valid email address.";
+ isValid = false;
+ }
+
+ if (!password) {
+ els.passwordError.textContent = "Password is required.";
+ isValid = false;
+ }
+
+ return isValid;
+}
+
+function restoreRememberedEmail() {
+ const rememberedEmail = localStorage.getItem("aidloop_admin_email");
+ if (rememberedEmail) {
+ els.email.value = rememberedEmail;
+ els.rememberMe.checked = true;
+ }
+}
+
+function togglePasswordVisibility() {
+ const isPassword = els.password.type === "password";
+ els.password.type = isPassword ? "text" : "password";
+
+ els.togglePassword.innerHTML = isPassword
+ ? 'Organizer Details
+
+
+
×
+
+
+
+
+
Org. Name:
+
Loading...
+
+
Social Links:
+
—
+
+
Email:
+
—
+
+
Phone No:
+
—
+
+
Location:
+
—
+
+
+
+
Description
+
+
Loading organization description...
+
+
+
+
+ ${link}
+
+ `;
+}
+
+function populateOrganizer(user) {
+ const status = getOrganizerStatus(user);
+
+ els.orgTitle.textContent = getDisplayName(user);
+ els.orgName.textContent = getDisplayName(user);
+ els.email.textContent = user.email || "—";
+ els.phoneNumber.textContent = user.phoneNumber || user.phone || "—";
+ els.location.textContent = getLocation(user);
+ els.description.innerHTML = `${
+ user.description ||
+ user.bio ||
+ "No organization description available."
+ }
`;
+
+ renderSocialLinks(user);
+ setStatusBadge(status);
+}
+
+async function loadOrganizerDetails() {
+ if (!organizerId) {
+ els.orgTitle.textContent = "No organizer selected";
+ els.description.innerHTML = "No organizer ID provided.
";
+ return;
+ }
+
+ try {
+ let payload;
+
+ try {
+ payload = await apiRequest("/user");
+ } catch {
+ payload = await apiRequest("/users");
+ }
+
+ const users = normalizeUsers(payload);
+
+ const organizer = users.find(
+ (user) => String(user._id || user.id) === String(organizerId)
+ );
+
+ if (!organizer) {
+ throw new Error("Organizer not found");
+ }
+
+ populateOrganizer(organizer);
+ } catch (error) {
+ els.orgTitle.textContent = "Unable to load organizer";
+ els.description.innerHTML = `${error.message || "Failed to fetch organizer details."}
`;
+ }
+}
+
+function closeModal() {
+ if (window.history.length > 1) {
+ window.history.back();
+ return;
+ }
+
+ window.location.href = "organization-directory.html";
+}
+
+els.closeBtn.addEventListener("click", closeModal);
+
+document.addEventListener("DOMContentLoaded", loadOrganizerDetails);
\ No newline at end of file
diff --git a/Admin/organizations/organization-directory.css b/Admin/organizations/organization-directory.css
new file mode 100644
index 0000000..f1bff77
--- /dev/null
+++ b/Admin/organizations/organization-directory.css
@@ -0,0 +1,453 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.dashboard {
+ display: flex;
+ min-height: 100vh;
+}
+
+.sidebar {
+ width: 15rem;
+ background: #223f6b;
+ color: #ffffff;
+ padding: 1.8rem 0.9rem;
+}
+
+.sidebar-logo {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 0.35rem;
+ margin-bottom: 2.4rem;
+}
+
+.sidebar-logo img {
+ width: 3.1rem;
+ height: 3.1rem;
+ object-fit: contain;
+}
+
+.sidebar-menu {
+ list-style: none;
+}
+
+.sidebar-menu li {
+ margin-bottom: 0.8rem;
+}
+
+.sidebar-menu li a,
+.logout-btn {
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ text-decoration: none;
+ color: #ffffff;
+ padding: 0.9rem 0.85rem;
+ border-radius: 0.45rem;
+ font-size: 0.95rem;
+ transition: background 0.2s ease;
+ width: 100%;
+ border: none;
+ background: transparent;
+ cursor: pointer;
+}
+
+.sidebar-menu li a i,
+.logout-btn i {
+ width: 1rem;
+ text-align: center;
+}
+
+.sidebar-menu li.active a,
+.sidebar-menu li a:hover {
+ background: #1d7de2;
+}
+
+.logout-btn:hover {
+ background: #ef2f2f;
+}
+
+.main-content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.topbar {
+ height: 5.8rem;
+ background: #ffffff;
+ border-bottom: 0.0625rem solid #e6e8eb;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 1.8rem;
+}
+
+.search-box {
+ width: 21rem;
+ height: 2.9rem;
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ border: 0.0625rem solid #d9dde3;
+ border-radius: 0.35rem;
+ padding: 0 0.9rem;
+ background: #ffffff;
+}
+
+.search-box i {
+ color: #6b7280;
+ font-size: 0.95rem;
+}
+
+.search-box input {
+ width: 100%;
+ border: none;
+ outline: none;
+ background: transparent;
+ font-size: 0.95rem;
+ color: #374151;
+}
+
+.topbar-right {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.notification {
+ position: relative;
+ color: #111827;
+ font-size: 1.2rem;
+}
+
+.notification-dot {
+ position: absolute;
+ top: 0.08rem;
+ right: -0.12rem;
+ width: 0.45rem;
+ height: 0.45rem;
+ background: #ef2f2f;
+ border-radius: 50%;
+}
+
+.admin-profile {
+ display: flex;
+ align-items: center;
+ gap: 0.7rem;
+}
+
+.user-avatar {
+ width: 2.45rem;
+ height: 2.45rem;
+ border-radius: 50%;
+ object-fit: cover;
+}
+
+.admin-text h4 {
+ font-size: 0.82rem;
+ font-weight: 600;
+ color: #172033;
+ line-height: 1.2;
+}
+
+.admin-text p {
+ font-size: 0.72rem;
+ color: #6b7280;
+ line-height: 1.2;
+}
+
+.admin-chevron {
+ color: #6b7280;
+ font-size: 0.7rem;
+}
+
+.page-content {
+ padding: 4rem 1.4rem 2rem;
+}
+
+.page-header {
+ margin-bottom: 2rem;
+}
+
+.page-header h1 {
+ font-size: 2.1rem;
+ font-weight: 700;
+ margin-bottom: 0.3rem;
+}
+
+.page-header p {
+ font-size: 0.78rem;
+ color: #6b7280;
+}
+
+.filter-buttons {
+ display: flex;
+ gap: 0.8rem;
+ margin-bottom: 1.4rem;
+ flex-wrap: wrap;
+}
+
+.filter-btn {
+ border: 0.0625rem solid #d9dde3;
+ background: #ffffff;
+ color: #374151;
+ padding: 0.75rem 1rem;
+ border-radius: 0.4rem;
+ font-size: 0.8rem;
+ cursor: pointer;
+}
+
+.filter-btn.active {
+ background: #1d7de2;
+ color: #ffffff;
+ border-color: #1d7de2;
+}
+
+.table-wrapper {
+ background: #ffffff;
+ overflow: hidden;
+ border-radius: 0.6rem;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+thead {
+ background: #f4f6f8;
+}
+
+th,
+td {
+ text-align: left;
+ padding: 1rem 1.4rem;
+}
+
+th {
+ font-size: 0.62rem;
+ letter-spacing: 0.08em;
+ color: #7b8492;
+ font-weight: 700;
+}
+
+td {
+ font-size: 0.72rem;
+ color: #172033;
+ border-top: 0.0625rem solid #eef1f3;
+}
+
+.status-badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 5.5rem;
+ padding: 0.35rem 0.7rem;
+ border-radius: 0.45rem;
+ color: #ffffff;
+ font-size: 0.58rem;
+ font-weight: 700;
+}
+
+.status-badge.verified {
+ background: #16a34a;
+}
+
+.status-badge.rejected {
+ background: #dc2626;
+}
+
+.status-badge.pending {
+ background: #f59e0b;
+}
+
+.action-link {
+ color: #1d7de2;
+ text-decoration: none;
+ font-weight: 600;
+}
+
+.action-link:hover {
+ text-decoration: underline;
+}
+
+.empty-state {
+ text-align: center;
+ padding: 3rem 1rem;
+}
+
+.empty-icon {
+ width: 4rem;
+ height: 4rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #e8f0fb;
+ color: #1d7de2;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ position: relative;
+ font-size: 1.4rem;
+}
+
+.empty-check {
+ position: absolute;
+ right: -0.2rem;
+ bottom: -0.2rem;
+ font-size: 0.9rem;
+ color: #16a34a;
+}
+
+.empty-state h2 {
+ font-size: 1.1rem;
+ margin-bottom: 0.4rem;
+}
+
+.empty-state p {
+ color: #6b7280;
+ font-size: 0.85rem;
+}
+
+.hidden {
+ display: none !important;
+}
+
+.modal-overlay {
+ position: fixed;
+ inset: 0;
+ background: rgba(15, 23, 42, 0.45);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1rem;
+ z-index: 999;
+}
+
+.modal-card {
+ width: 100%;
+ max-width: 25rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.5rem;
+ position: relative;
+ text-align: center;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.15);
+}
+
+.modal-close-btn {
+ position: absolute;
+ top: 0.7rem;
+ right: 0.9rem;
+ border: none;
+ background: transparent;
+ font-size: 1.5rem;
+ color: #6b7280;
+ cursor: pointer;
+}
+
+.modal-icon-wrap {
+ width: 3.5rem;
+ height: 3.5rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #fee2e2;
+ color: #dc2626;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.25rem;
+}
+
+.modal-card h3 {
+ font-size: 1.2rem;
+ margin-bottom: 0.5rem;
+ color: #172033;
+}
+
+.modal-card p {
+ font-size: 0.92rem;
+ color: #6b7280;
+ margin-bottom: 1.3rem;
+}
+
+.modal-actions {
+ display: flex;
+ gap: 0.8rem;
+ justify-content: center;
+}
+
+.modal-btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.8rem 1rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+ min-width: 8rem;
+}
+
+.modal-btn.secondary {
+ background: #e5e7eb;
+ color: #172033;
+}
+
+.modal-btn.danger {
+ background: #dc2626;
+ color: #ffffff;
+}
+
+@media (max-width: 75rem) {
+ .table-wrapper {
+ overflow-x: auto;
+ }
+
+ table {
+ min-width: 46rem;
+ }
+}
+
+@media (max-width: 62rem) {
+ .sidebar {
+ display: none;
+ }
+
+ .topbar {
+ padding: 0 1rem;
+ }
+
+ .search-box {
+ width: 16rem;
+ }
+
+ .page-content {
+ padding: 2rem 1rem;
+ }
+
+ .admin-text,
+ .admin-chevron {
+ display: none;
+ }
+}
+
+@media (max-width: 36rem) {
+ .search-box {
+ width: 12rem;
+ }
+
+ .modal-actions {
+ flex-direction: column;
+ }
+
+ .modal-btn {
+ width: 100%;
+ }
+}
diff --git a/Admin/organizations/organization-directory.html b/Admin/organizations/organization-directory.html
new file mode 100644
index 0000000..0a87836
--- /dev/null
+++ b/Admin/organizations/organization-directory.html
@@ -0,0 +1,153 @@
+
+
+
+ AIDLoop - Organizer Directory
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Status: All
+ Verified
+ Rejected
+
+
+
+
+
+
+ ORGANIZATION NAME
+ CONTACT EMAIL
+ LOCATION
+ STATUS
+ ACTIONS
+
+
+
+
+
+ Loading organizations...
+
+
+
+
+
+
+
+
No Organizations Found
+
Registered organizations will appear here once they sign up.
+
+
+
+
+
+
+ ×
+
+
+
+
+
+
Log out?
+
You are about to end your current admin session.
+
+
+ Cancel
+ Yes, Log out
+
+
+
+ ${getDisplayName(organizer)}
+ ${organizer.email || "—"}
+ ${getLocation(organizer)}
+
+
+ ${organizer._status.charAt(0).toUpperCase() + organizer._status.slice(1)}
+
+
+
+
+ View Details
+
+
+
+ `).join("");
+}
+
+function bindFilters() {
+ els.filterButtons.forEach((button) => {
+ button.addEventListener("click", () => {
+ els.filterButtons.forEach((btn) => btn.classList.remove("active"));
+ button.classList.add("active");
+ currentFilter = button.dataset.filter;
+ renderDirectory();
+ });
+ });
+}
+
+function openLogoutModal() {
+ els.logoutModal.classList.remove("hidden");
+}
+
+function closeLogoutModal() {
+ els.logoutModal.classList.add("hidden");
+ els.confirmLogout.disabled = false;
+ els.confirmLogout.textContent = "Yes, Log out";
+}
+
+async function handleLogout() {
+ try {
+ els.confirmLogout.disabled = true;
+ els.confirmLogout.textContent = "Logging out...";
+
+ await apiRequest("/auth/logout", {
+ method: "POST"
+ });
+ } catch (error) {
+ console.warn("Logout failed:", error.message);
+ } finally {
+ localStorage.clear();
+ sessionStorage.clear();
+ window.location.href = "../../index.html";
+ }
+}
+
+async function loadAdminProfile() {
+ try {
+ let profile;
+ try {
+ profile = await apiRequest("/users/me");
+ } catch {
+ profile = await apiRequest("/user/me");
+ }
+
+ els.adminName.textContent =
+ profile.fullName ||
+ profile.name ||
+ "Admin User";
+
+ els.adminRole.textContent =
+ profile.role
+ ? profile.role.charAt(0).toUpperCase() + profile.role.slice(1)
+ : "Admin";
+
+ if (profile.profileImage) {
+ els.adminAvatar.src = profile.profileImage;
+ }
+ } catch (error) {
+ console.error("Failed to load admin profile:", error.message);
+ window.location.href = "../profile/admin-profile.html";
+ }
+}
+
+async function loadOrganizations() {
+ try {
+ const payload = await apiRequest("/user").catch(() => apiRequest("/users"));
+ const users = normalizeUsers(payload);
+
+ organizersCache = users
+ .filter((user) => String(user.role || "").toLowerCase() === "organizer")
+ .map((user) => ({
+ ...user,
+ _status: getOrganizerStatus(user)
+ }));
+
+ renderDirectory();
+ } catch (error) {
+ console.error("Failed to load organizations:", error.message);
+ els.directoryTable.innerHTML = `
+
+ Failed to load organizations.
+
+ `;
+ }
+}
+
+function bindUI() {
+ els.searchInput.addEventListener("input", renderDirectory);
+ bindFilters();
+
+ els.logoutBtn.addEventListener("click", openLogoutModal);
+ els.closeLogoutModal.addEventListener("click", closeLogoutModal);
+ els.cancelLogout.addEventListener("click", closeLogoutModal);
+ els.confirmLogout.addEventListener("click", handleLogout);
+
+ els.logoutModal.addEventListener("click", (event) => {
+ if (event.target === els.logoutModal) {
+ closeLogoutModal();
+ }
+ });
+
+ document.addEventListener("keydown", (event) => {
+ if (event.key === "Escape" && !els.logoutModal.classList.contains("hidden")) {
+ closeLogoutModal();
+ }
+ });
+}
+
+document.addEventListener("DOMContentLoaded", async () => {
+ bindUI();
+ await loadAdminProfile();
+ await loadOrganizations();
+});
\ No newline at end of file
diff --git a/Admin/profile/admin-profile.css b/Admin/profile/admin-profile.css
new file mode 100644
index 0000000..20c9749
--- /dev/null
+++ b/Admin/profile/admin-profile.css
@@ -0,0 +1,418 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.dashboard {
+ display: flex;
+ min-height: 100vh;
+}
+
+.sidebar {
+ width: 15rem;
+ background: #223f6b;
+ color: #ffffff;
+ padding: 1.8rem 0.9rem;
+}
+
+.sidebar-logo {
+ display: flex;
+ justify-content: center;
+ margin-bottom: 2.4rem;
+}
+
+.sidebar-logo img {
+ width: 3.1rem;
+ height: 3.1rem;
+ object-fit: contain;
+}
+
+.sidebar-menu {
+ list-style: none;
+}
+
+.sidebar-menu li {
+ margin-bottom: 0.8rem;
+}
+
+.sidebar-menu li a,
+.logout-btn {
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ text-decoration: none;
+ color: #ffffff;
+ padding: 0.9rem 0.85rem;
+ border-radius: 0.45rem;
+ font-size: 0.95rem;
+ transition: background 0.2s ease;
+ width: 100%;
+ border: none;
+ background: transparent;
+ cursor: pointer;
+}
+
+.sidebar-menu li a i,
+.logout-btn i {
+ width: 1rem;
+ text-align: center;
+}
+
+.sidebar-menu li.active a,
+.sidebar-menu li a:hover {
+ background: #1d7de2;
+}
+
+.logout-btn:hover {
+ background: #ef2f2f;
+}
+
+.main-content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.topbar {
+ height: 5.8rem;
+ background: #ffffff;
+ border-bottom: 0.0625rem solid #e6e8eb;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 1.8rem;
+}
+
+.search-box {
+ width: 21rem;
+ height: 2.9rem;
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ border: 0.0625rem solid #d9dde3;
+ border-radius: 0.35rem;
+ padding: 0 0.9rem;
+ background: #ffffff;
+}
+
+.search-box i {
+ color: #6b7280;
+ font-size: 0.95rem;
+}
+
+.search-box input {
+ width: 100%;
+ border: none;
+ outline: none;
+ background: transparent;
+ font-size: 0.95rem;
+ color: #374151;
+}
+
+.topbar-right {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.notification {
+ position: relative;
+ color: #111827;
+ font-size: 1.2rem;
+}
+
+.notification-dot {
+ position: absolute;
+ top: 0.08rem;
+ right: -0.12rem;
+ width: 0.45rem;
+ height: 0.45rem;
+ background: #ef2f2f;
+ border-radius: 50%;
+}
+
+.admin-profile-mini {
+ display: flex;
+ align-items: center;
+ gap: 0.7rem;
+}
+
+.user-avatar {
+ width: 2.45rem;
+ height: 2.45rem;
+ border-radius: 50%;
+ object-fit: cover;
+}
+
+.admin-mini-text h4 {
+ font-size: 0.82rem;
+ font-weight: 600;
+ color: #172033;
+ line-height: 1.2;
+}
+
+.admin-mini-text p {
+ font-size: 0.72rem;
+ color: #6b7280;
+ line-height: 1.2;
+}
+
+.page-content {
+ padding: 4rem 1.4rem 2rem;
+}
+
+.page-header {
+ margin-bottom: 2rem;
+}
+
+.page-header h1 {
+ font-size: 2.1rem;
+ font-weight: 700;
+ margin-bottom: 0.3rem;
+}
+
+.page-header p {
+ font-size: 0.82rem;
+ color: #6b7280;
+}
+
+.profile-grid {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: 1.4rem;
+}
+
+.card {
+ background: #ffffff;
+ border-radius: 0.85rem;
+ padding: 1.4rem;
+}
+
+.card h2 {
+ font-size: 1.1rem;
+ margin-bottom: 1rem;
+ color: #223f6b;
+}
+
+.form {
+ display: flex;
+ flex-direction: column;
+ gap: 0.9rem;
+}
+
+.form-group {
+ display: flex;
+ flex-direction: column;
+ gap: 0.35rem;
+}
+
+.form-group label {
+ font-size: 0.85rem;
+ font-weight: 600;
+ color: #374151;
+}
+
+.form-group input {
+ width: 100%;
+ height: 3rem;
+ border: 0.0625rem solid #d9dde3;
+ border-radius: 0.5rem;
+ padding: 0 0.9rem;
+ font-size: 0.92rem;
+ color: #172033;
+ background: #ffffff;
+ outline: none;
+}
+
+.form-group input[readonly] {
+ background: #f8fafc;
+}
+
+.button-row {
+ display: flex;
+ justify-content: flex-start;
+ margin-top: 0.3rem;
+}
+
+.button-row.align-right {
+ justify-content: flex-end;
+}
+
+.primary-btn,
+.secondary-btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.85rem 1.2rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+}
+
+.primary-btn {
+ background: #1d7de2;
+ color: #ffffff;
+}
+
+.secondary-btn {
+ background: #223f6b;
+ color: #ffffff;
+}
+
+.primary-btn:hover,
+.secondary-btn:hover {
+ opacity: 0.94;
+}
+
+.primary-btn:disabled,
+.secondary-btn:disabled {
+ opacity: 0.7;
+ cursor: not-allowed;
+}
+
+.feedback {
+ min-height: 1.1rem;
+ font-size: 0.82rem;
+}
+
+.feedback.success {
+ color: #16a34a;
+}
+
+.feedback.error {
+ color: #dc2626;
+}
+
+.hidden {
+ display: none !important;
+}
+
+.modal-overlay {
+ position: fixed;
+ inset: 0;
+ background: rgba(15, 23, 42, 0.45);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1rem;
+ z-index: 999;
+}
+
+.modal-card {
+ width: 100%;
+ max-width: 25rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.5rem;
+ position: relative;
+ text-align: center;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.15);
+}
+
+.modal-close-btn {
+ position: absolute;
+ top: 0.7rem;
+ right: 0.9rem;
+ border: none;
+ background: transparent;
+ font-size: 1.5rem;
+ color: #6b7280;
+ cursor: pointer;
+}
+
+.modal-icon-wrap {
+ width: 3.5rem;
+ height: 3.5rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #fee2e2;
+ color: #dc2626;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.25rem;
+}
+
+.modal-card h3 {
+ font-size: 1.2rem;
+ margin-bottom: 0.5rem;
+ color: #172033;
+}
+
+.modal-card p {
+ font-size: 0.92rem;
+ color: #6b7280;
+ margin-bottom: 1.3rem;
+}
+
+.modal-actions {
+ display: flex;
+ gap: 0.8rem;
+ justify-content: center;
+}
+
+.modal-btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.8rem 1rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+ min-width: 8rem;
+}
+
+.modal-btn.secondary {
+ background: #e5e7eb;
+ color: #172033;
+}
+
+.modal-btn.danger {
+ background: #dc2626;
+ color: #ffffff;
+}
+
+@media (max-width: 68rem) {
+ .profile-grid {
+ grid-template-columns: 1fr;
+ }
+}
+
+@media (max-width: 62rem) {
+ .sidebar {
+ display: none;
+ }
+
+ .topbar {
+ padding: 0 1rem;
+ }
+
+ .search-box {
+ width: 16rem;
+ }
+
+ .page-content {
+ padding: 2rem 1rem;
+ }
+
+ .admin-mini-text {
+ display: none;
+ }
+}
+
+@media (max-width: 36rem) {
+ .search-box {
+ width: 12rem;
+ }
+
+ .modal-actions {
+ flex-direction: column;
+ }
+
+ .modal-btn {
+ width: 100%;
+ }
+}
\ No newline at end of file
diff --git a/Admin/profile/admin-profile.html b/Admin/profile/admin-profile.html
new file mode 100644
index 0000000..5e9f539
--- /dev/null
+++ b/Admin/profile/admin-profile.html
@@ -0,0 +1,174 @@
+
+
+
+ AIDLoop - Admin Profile
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Profile Information
+
+
+
+
+
+
+
+
+
+
+ ×
+
+
+
+
+
+
Log out?
+
You are about to end your current admin session.
+
+
+ Cancel
+ Yes, Log out
+
+
+
User Details
+
+
+
+
+
+
Name:
+
Loading...
+
+
Email:
+
—
+
+
Phone No:
+
—
+
+
Location:
+
—
+
+
Date Joined:
+
—
+
+
Status
+
+ Loading...
+
+
+
Description
+
+ Loading description...
+
+
+
+
+ Deactivate
+ Reactivate
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Admin/user/user-details.js b/Admin/user/user-details.js
new file mode 100644
index 0000000..02219db
--- /dev/null
+++ b/Admin/user/user-details.js
@@ -0,0 +1,214 @@
+const API_BASE_URL = "https://aidloop-backend.onrender.com/api";
+
+const els = {
+ userTitle: document.getElementById("userTitle"),
+ roleBadge: document.getElementById("roleBadge"),
+ userName: document.getElementById("userName"),
+ email: document.getElementById("email"),
+ phoneNumber: document.getElementById("phoneNumber"),
+ location: document.getElementById("location"),
+ dateJoined: document.getElementById("dateJoined"),
+ statusBadge: document.getElementById("statusBadge"),
+ description: document.getElementById("description"),
+ feedback: document.getElementById("feedback"),
+ deactivateBtn: document.getElementById("deactivateBtn"),
+ reactivateBtn: document.getElementById("reactivateBtn")
+};
+
+const userId = new URLSearchParams(window.location.search).get("id");
+let currentUser = null;
+
+async function apiRequest(endpoint, options = {}) {
+ const response = await fetch(`${API_BASE_URL}${endpoint}`, {
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json",
+ ...(options.headers || {})
+ },
+ ...options
+ });
+
+ const contentType = response.headers.get("content-type") || "";
+ const data = contentType.includes("application/json")
+ ? await response.json()
+ : await response.text();
+
+ if (!response.ok) {
+ throw new Error(
+ (data && data.message) ||
+ (data && data.error) ||
+ "Request failed"
+ );
+ }
+
+ return data;
+}
+
+function normalizeUsers(payload) {
+ if (Array.isArray(payload)) return payload;
+ if (Array.isArray(payload?.users)) return payload.users;
+ if (Array.isArray(payload?.data)) return payload.data;
+ return [];
+}
+
+function formatDate(dateValue) {
+ if (!dateValue) return "—";
+ const date = new Date(dateValue);
+ if (Number.isNaN(date.getTime())) return dateValue;
+ return date.toLocaleDateString("en-GB", {
+ day: "2-digit",
+ month: "long",
+ year: "numeric"
+ });
+}
+
+function getDisplayName(user) {
+ return user.fullName || user.name || user.organizationName || "User";
+}
+
+function getLocation(user) {
+ if (typeof user.location === "string" && user.location.trim()) {
+ return user.location;
+ }
+
+ if (user.location && typeof user.location === "object") {
+ return (
+ [user.location.venue, user.location.city || user.location.state]
+ .filter(Boolean)
+ .join(", ") || "—"
+ );
+ }
+
+ return user.city || user.state || "—";
+}
+
+function getRole(user) {
+ return String(user.role || "user").toLowerCase();
+}
+
+function getStatus(user) {
+ return user.isActive === false ? "deactivated" : "active";
+}
+
+function setFeedback(message, type = "") {
+ els.feedback.textContent = message;
+ els.feedback.className = "feedback";
+ if (type) {
+ els.feedback.classList.add(type);
+ }
+}
+
+function setRoleBadge(role) {
+ els.roleBadge.textContent = role.charAt(0).toUpperCase() + role.slice(1);
+ els.roleBadge.className = "role-badge";
+ els.roleBadge.classList.add(role);
+}
+
+function setStatusBadge(status) {
+ els.statusBadge.textContent =
+ status === "deactivated" ? "Deactivated" : "Active";
+ els.statusBadge.className = "status-badge";
+ els.statusBadge.classList.add(status);
+}
+
+function syncButtons(status) {
+ if (status === "deactivated") {
+ els.deactivateBtn.disabled = true;
+ els.deactivateBtn.textContent = "Deactivated";
+ els.reactivateBtn.disabled = false;
+ } else {
+ els.deactivateBtn.disabled = false;
+ els.deactivateBtn.textContent = "Deactivate";
+ els.reactivateBtn.disabled = false;
+ }
+}
+
+function populateUser(user) {
+ currentUser = user;
+
+ const role = getRole(user);
+ const status = getStatus(user);
+
+ els.userTitle.textContent = getDisplayName(user);
+ els.userName.textContent = getDisplayName(user);
+ els.email.textContent = user.email || "—";
+ els.phoneNumber.textContent = user.phoneNumber || user.phone || "—";
+ els.location.textContent = getLocation(user);
+ els.dateJoined.textContent = formatDate(user.createdAt || user.dateJoined);
+ els.description.textContent =
+ user.description ||
+ user.bio ||
+ "No description available.";
+
+ setRoleBadge(role);
+ setStatusBadge(status);
+ syncButtons(status);
+}
+
+async function loadUserDetails() {
+ if (!userId) {
+ els.userTitle.textContent = "No user selected";
+ els.description.textContent = "No user ID provided.";
+ els.deactivateBtn.disabled = true;
+ els.reactivateBtn.disabled = true;
+ return;
+ }
+
+ try {
+ const payload = await apiRequest("/user").catch(() => apiRequest("/users"));
+ const users = normalizeUsers(payload);
+
+ const user = users.find(
+ (item) => String(item._id || item.id) === String(userId)
+ );
+
+ if (!user) {
+ throw new Error("User not found");
+ }
+
+ populateUser(user);
+ } catch (error) {
+ els.userTitle.textContent = "Unable to load user";
+ els.description.textContent = error.message || "Failed to fetch user details.";
+ els.deactivateBtn.disabled = true;
+ els.reactivateBtn.disabled = true;
+ setFeedback(error.message || "Failed to load user details.", "error");
+ }
+}
+
+async function deactivateUser() {
+ if (!userId) return;
+
+ try {
+ els.deactivateBtn.disabled = true;
+ els.deactivateBtn.textContent = "Deactivating...";
+
+ await apiRequest(`/admin/users/${userId}/deactivate`, {
+ method: "PATCH"
+ });
+
+ currentUser = {
+ ...currentUser,
+ isActive: false
+ };
+
+ setStatusBadge("deactivated");
+ syncButtons("deactivated");
+ setFeedback("User deactivated successfully.", "success");
+ } catch (error) {
+ syncButtons(getStatus(currentUser || {}));
+ setFeedback(error.message || "Failed to deactivate user.", "error");
+ }
+}
+
+function handleReactivate() {
+ setFeedback(
+ "No reactivation endpoint has been provided yet.",
+ "error"
+ );
+}
+
+els.deactivateBtn.addEventListener("click", deactivateUser);
+els.reactivateBtn.addEventListener("click", handleReactivate);
+
+document.addEventListener("DOMContentLoaded", loadUserDetails);
\ No newline at end of file
diff --git a/Admin/user/user-management.css b/Admin/user/user-management.css
new file mode 100644
index 0000000..bbdd83e
--- /dev/null
+++ b/Admin/user/user-management.css
@@ -0,0 +1,434 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.dashboard {
+ display: flex;
+ min-height: 100vh;
+}
+
+.sidebar {
+ width: 15rem;
+ background: #223f6b;
+ color: #ffffff;
+ padding: 1.8rem 0.9rem;
+}
+
+.sidebar-logo {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 0.35rem;
+ margin-bottom: 2.4rem;
+}
+
+.sidebar-logo img {
+ width: 3.1rem;
+ height: 3.1rem;
+ object-fit: contain;
+}
+
+.sidebar-menu {
+ list-style: none;
+}
+
+.sidebar-menu li {
+ margin-bottom: 0.8rem;
+}
+
+.sidebar-menu li a,
+.logout-btn {
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ text-decoration: none;
+ color: #ffffff;
+ padding: 0.9rem 0.85rem;
+ border-radius: 0.45rem;
+ font-size: 0.95rem;
+ transition: background 0.2s ease;
+ width: 100%;
+ border: none;
+ background: transparent;
+ cursor: pointer;
+}
+
+.sidebar-menu li a i,
+.logout-btn i {
+ width: 1rem;
+ text-align: center;
+}
+
+.sidebar-menu li.active a,
+.sidebar-menu li a:hover {
+ background: #1d7de2;
+}
+
+.logout-btn:hover {
+ background: #ef2f2f;
+}
+
+.main-content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.topbar {
+ height: 5.8rem;
+ background: #ffffff;
+ border-bottom: 0.0625rem solid #e6e8eb;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 1.8rem;
+}
+
+.search-box {
+ width: 21rem;
+ height: 2.9rem;
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ border: 0.0625rem solid #d9dde3;
+ border-radius: 0.35rem;
+ padding: 0 0.9rem;
+ background: #ffffff;
+}
+
+.search-box i {
+ color: #6b7280;
+ font-size: 0.95rem;
+}
+
+.search-box input {
+ width: 100%;
+ border: none;
+ outline: none;
+ background: transparent;
+ font-size: 0.95rem;
+ color: #374151;
+}
+
+.topbar-right {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.notification {
+ position: relative;
+ color: #111827;
+ font-size: 1.2rem;
+}
+
+.notification-dot {
+ position: absolute;
+ top: 0.08rem;
+ right: -0.12rem;
+ width: 0.45rem;
+ height: 0.45rem;
+ background: #ef2f2f;
+ border-radius: 50%;
+}
+
+.admin-profile {
+ display: flex;
+ align-items: center;
+ gap: 0.7rem;
+}
+
+.user-avatar {
+ width: 2.45rem;
+ height: 2.45rem;
+ border-radius: 50%;
+ object-fit: cover;
+}
+
+.admin-text h4 {
+ font-size: 0.82rem;
+ font-weight: 600;
+ color: #172033;
+ line-height: 1.2;
+}
+
+.admin-text p {
+ font-size: 0.72rem;
+ color: #6b7280;
+ line-height: 1.2;
+}
+
+.page-content {
+ padding: 4rem 1.4rem 2rem;
+}
+
+.page-header {
+ margin-bottom: 2rem;
+}
+
+.page-header h1 {
+ font-size: 2.1rem;
+ font-weight: 700;
+ margin-bottom: 0.3rem;
+}
+
+.page-header p {
+ font-size: 0.78rem;
+ color: #6b7280;
+}
+
+.table-wrapper {
+ background: #ffffff;
+ overflow: hidden;
+ border-radius: 0.6rem;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+thead {
+ background: #f4f6f8;
+}
+
+th,
+td {
+ text-align: left;
+ padding: 1rem 1.4rem;
+}
+
+th {
+ font-size: 0.62rem;
+ letter-spacing: 0.08em;
+ color: #7b8492;
+ font-weight: 700;
+}
+
+td {
+ font-size: 0.72rem;
+ color: #172033;
+ border-top: 0.0625rem solid #eef1f3;
+}
+
+.role-badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 5.5rem;
+ padding: 0.35rem 0.7rem;
+ border-radius: 0.45rem;
+ color: #ffffff;
+ font-size: 0.58rem;
+ font-weight: 700;
+ text-transform: capitalize;
+}
+
+.role-badge.organizer {
+ background: #1d7de2;
+}
+
+.role-badge.volunteer {
+ background: #16a34a;
+}
+
+.role-badge.admin {
+ background: #6b7280;
+}
+
+.actions-cell {
+ display: flex;
+ gap: 0.6rem;
+ flex-wrap: wrap;
+}
+
+.action-link,
+.action-btn {
+ color: #1d7de2;
+ text-decoration: none;
+ font-weight: 600;
+ font-size: 0.72rem;
+ border: none;
+ background: transparent;
+ cursor: pointer;
+}
+
+.action-link:hover,
+.action-btn:hover {
+ text-decoration: underline;
+}
+
+.action-btn.deactivated {
+ color: #9ca3af;
+ cursor: not-allowed;
+ text-decoration: none;
+}
+
+.empty-state {
+ text-align: center;
+ padding: 3rem 1rem;
+}
+
+.empty-icon {
+ width: 4rem;
+ height: 4rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #e8f0fb;
+ color: #1d7de2;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.4rem;
+}
+
+.empty-state h2 {
+ font-size: 1.1rem;
+ margin-bottom: 0.4rem;
+}
+
+.empty-state p {
+ color: #6b7280;
+ font-size: 0.85rem;
+}
+
+.hidden {
+ display: none !important;
+}
+
+.modal-overlay {
+ position: fixed;
+ inset: 0;
+ background: rgba(15, 23, 42, 0.45);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1rem;
+ z-index: 999;
+}
+
+.modal-card {
+ width: 100%;
+ max-width: 25rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.5rem;
+ position: relative;
+ text-align: center;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.15);
+}
+
+.modal-close-btn {
+ position: absolute;
+ top: 0.7rem;
+ right: 0.9rem;
+ border: none;
+ background: transparent;
+ font-size: 1.5rem;
+ color: #6b7280;
+ cursor: pointer;
+}
+
+.modal-icon-wrap {
+ width: 3.5rem;
+ height: 3.5rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #fee2e2;
+ color: #dc2626;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.25rem;
+}
+
+.modal-card h3 {
+ font-size: 1.2rem;
+ margin-bottom: 0.5rem;
+ color: #172033;
+}
+
+.modal-card p {
+ font-size: 0.92rem;
+ color: #6b7280;
+ margin-bottom: 1.3rem;
+}
+
+.modal-actions {
+ display: flex;
+ gap: 0.8rem;
+ justify-content: center;
+}
+
+.modal-btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.8rem 1rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+ min-width: 8rem;
+}
+
+.modal-btn.secondary {
+ background: #e5e7eb;
+ color: #172033;
+}
+
+.modal-btn.danger {
+ background: #dc2626;
+ color: #ffffff;
+}
+
+@media (max-width: 75rem) {
+ .table-wrapper {
+ overflow-x: auto;
+ }
+
+ table {
+ min-width: 48rem;
+ }
+}
+
+@media (max-width: 62rem) {
+ .sidebar {
+ display: none;
+ }
+
+ .topbar {
+ padding: 0 1rem;
+ }
+
+ .search-box {
+ width: 16rem;
+ }
+
+ .page-content {
+ padding: 2rem 1rem;
+ }
+
+ .admin-text {
+ display: none;
+ }
+}
+
+@media (max-width: 36rem) {
+ .search-box {
+ width: 12rem;
+ }
+
+ .modal-actions {
+ flex-direction: column;
+ }
+
+ .modal-btn {
+ width: 100%;
+ }
+}
\ No newline at end of file
diff --git a/Admin/user/user-management.html b/Admin/user/user-management.html
new file mode 100644
index 0000000..833bd89
--- /dev/null
+++ b/Admin/user/user-management.html
@@ -0,0 +1,141 @@
+
+
+
+ AIDLoop - User Management
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ USER NAME
+ USER EMAIL
+ LOCATION
+ ROLE
+ ACTIONS
+
+
+
+
+
+ Loading users...
+
+
+
+
+
+
+
+
No Users Found
+
No users match your current search.
+
+
+
+
+
+
+ ×
+
+
+
+
+
+
Log out?
+
You are about to end your current admin session.
+
+
+ Cancel
+ Yes, Log out
+
+
+
+ ${getDisplayName(user)}
+ ${user.email || "—"}
+ ${getLocation(user)}
+ ${role}
+
+
View
+
+ ${isActive ? "Deactivate" : "Deactivated"}
+
+
+
+ `;
+ }).join("");
+
+ bindDeactivateButtons();
+}
+
+function bindDeactivateButtons() {
+ document.querySelectorAll(".action-btn[data-id]").forEach((button) => {
+ button.addEventListener("click", async () => {
+ const id = button.dataset.id;
+ if (!id || button.disabled) return;
+
+ try {
+ button.disabled = true;
+ button.textContent = "Deactivating...";
+
+ await apiRequest(`/admin/users/${id}/deactivate`, {
+ method: "PATCH"
+ });
+
+ usersCache = usersCache.map((user) =>
+ String(user._id || user.id) === String(id)
+ ? { ...user, isActive: false }
+ : user
+ );
+
+ renderUsers();
+ } catch (error) {
+ console.error("Failed to deactivate user:", error.message);
+ button.disabled = false;
+ button.textContent = "Deactivate";
+ }
+ });
+ });
+}
+
+function openLogoutModal() {
+ els.logoutModal.classList.remove("hidden");
+}
+
+function closeLogoutModal() {
+ els.logoutModal.classList.add("hidden");
+ els.confirmLogout.disabled = false;
+ els.confirmLogout.textContent = "Yes, Log out";
+}
+
+async function handleLogout() {
+ try {
+ els.confirmLogout.disabled = true;
+ els.confirmLogout.textContent = "Logging out...";
+
+ await apiRequest("/auth/logout", {
+ method: "POST"
+ });
+ } catch (error) {
+ console.warn("Logout failed:", error.message);
+ } finally {
+ localStorage.clear();
+ sessionStorage.clear();
+ window.location.href = "../../index.html";
+ }
+}
+
+async function loadAdminProfile() {
+ try {
+ let profile;
+ try {
+ profile = await apiRequest("/users/me");
+ } catch {
+ profile = await apiRequest("/user/me");
+ }
+
+ els.adminName.textContent =
+ profile.fullName ||
+ profile.name ||
+ "Admin User";
+
+ els.adminRole.textContent =
+ profile.role
+ ? profile.role.charAt(0).toUpperCase() + profile.role.slice(1)
+ : "Admin";
+
+ if (profile.profileImage) {
+ els.adminAvatar.src = profile.profileImage;
+ }
+ } catch (error) {
+ console.error("Failed to load admin profile:", error.message);
+ window.location.href = "../profile/admin-profile.html";
+ }
+}
+
+async function loadUsers() {
+ try {
+ const payload = await apiRequest("/user").catch(() => apiRequest("/users"));
+ usersCache = normalizeUsers(payload);
+ renderUsers();
+ } catch (error) {
+ console.error("Failed to load users:", error.message);
+ els.userTable.innerHTML = `
+
+ Failed to load users.
+
+ `;
+ }
+}
+
+function bindUI() {
+ els.searchInput.addEventListener("input", renderUsers);
+
+ els.logoutBtn.addEventListener("click", openLogoutModal);
+ els.closeLogoutModal.addEventListener("click", closeLogoutModal);
+ els.cancelLogout.addEventListener("click", closeLogoutModal);
+ els.confirmLogout.addEventListener("click", handleLogout);
+
+ els.logoutModal.addEventListener("click", (event) => {
+ if (event.target === els.logoutModal) {
+ closeLogoutModal();
+ }
+ });
+
+ document.addEventListener("keydown", (event) => {
+ if (event.key === "Escape" && !els.logoutModal.classList.contains("hidden")) {
+ closeLogoutModal();
+ }
+ });
+}
+
+document.addEventListener("DOMContentLoaded", async () => {
+ bindUI();
+ await loadAdminProfile();
+ await loadUsers();
+});
\ No newline at end of file
diff --git a/Admin/verification/verification-details.css b/Admin/verification/verification-details.css
new file mode 100644
index 0000000..26d62ec
--- /dev/null
+++ b/Admin/verification/verification-details.css
@@ -0,0 +1,186 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.page {
+ min-height: 100vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1.5rem;
+}
+
+.card {
+ width: 100%;
+ max-width: 42rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.8rem;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.12);
+}
+
+.card-header {
+ display: flex;
+ align-items: flex-start;
+ justify-content: space-between;
+ gap: 1rem;
+ margin-bottom: 1.5rem;
+}
+
+.card-header h1 {
+ font-size: 1.6rem;
+ font-weight: 700;
+ color: #172033;
+ line-height: 1.3;
+}
+
+.status-badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 7rem;
+ padding: 0.45rem 0.85rem;
+ border-radius: 0.55rem;
+ color: #ffffff;
+ font-size: 0.72rem;
+ font-weight: 700;
+ text-transform: capitalize;
+}
+
+.status-badge.awaiting {
+ background: #f59e0b;
+}
+
+.status-badge.verified {
+ background: #16a34a;
+}
+
+.status-badge.rejected {
+ background: #dc2626;
+}
+
+.details-grid {
+ display: grid;
+ grid-template-columns: 8rem 1fr;
+ gap: 0.9rem 1rem;
+ margin-bottom: 1.5rem;
+}
+
+.label {
+ font-size: 0.9rem;
+ font-weight: 600;
+ color: #223f6b;
+}
+
+.value {
+ font-size: 0.9rem;
+ color: #374151;
+ word-break: break-word;
+}
+
+.description-section h2 {
+ font-size: 1rem;
+ font-weight: 700;
+ margin-bottom: 0.7rem;
+ color: #172033;
+}
+
+.description-box {
+ background: #f8fafc;
+ border: 0.0625rem solid #e5e7eb;
+ border-radius: 0.75rem;
+ padding: 1rem;
+ font-size: 0.9rem;
+ line-height: 1.7;
+ color: #374151;
+}
+
+.actions {
+ margin-top: 1.3rem;
+ display: flex;
+ justify-content: flex-end;
+ gap: 0.8rem;
+}
+
+.btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.85rem 1.2rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+}
+
+.btn-reject {
+ background: #dc2626;
+ color: #ffffff;
+}
+
+.btn-approve {
+ background: #16a34a;
+ color: #ffffff;
+}
+
+.btn:disabled {
+ opacity: 0.7;
+ cursor: not-allowed;
+}
+
+.feedback {
+ min-height: 1.2rem;
+ margin-top: 1rem;
+ text-align: center;
+ font-size: 0.85rem;
+}
+
+.feedback.success {
+ color: #16a34a;
+}
+
+.feedback.error {
+ color: #dc2626;
+}
+
+.social-link {
+ color: #1d7de2;
+ text-decoration: none;
+}
+
+.social-link:hover {
+ text-decoration: underline;
+}
+
+@media (max-width: 36rem) {
+ .card {
+ padding: 1.2rem;
+ }
+
+ .card-header {
+ flex-direction: column;
+ align-items: flex-start;
+ }
+
+ .details-grid {
+ grid-template-columns: 1fr;
+ gap: 0.4rem;
+ }
+
+ .label {
+ margin-top: 0.4rem;
+ }
+
+ .actions {
+ flex-direction: column;
+ }
+
+ .btn {
+ width: 100%;
+ }
+}
\ No newline at end of file
diff --git a/Admin/verification/verification-details.html b/Admin/verification/verification-details.html
new file mode 100644
index 0000000..b7aff3a
--- /dev/null
+++ b/Admin/verification/verification-details.html
@@ -0,0 +1,56 @@
+
+
+
+ Verification Details
+
+
+
+
+
+
Org. Name:
+
Loading...
+
+
Social Links:
+
—
+
+
Email:
+
—
+
+
Phone No:
+
—
+
+
Location:
+
—
+
+
Description
+
+
Loading organization description...
+
+
+ Reject
+ Approve
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Admin/verification/verification-details.js b/Admin/verification/verification-details.js
new file mode 100644
index 0000000..d7f74ed
--- /dev/null
+++ b/Admin/verification/verification-details.js
@@ -0,0 +1,248 @@
+const API_BASE_URL = "https://aidloop-backend.onrender.com/api";
+
+const els = {
+ orgTitle: document.getElementById("orgTitle"),
+ statusBadge: document.getElementById("statusBadge"),
+ orgName: document.getElementById("orgName"),
+ socialLinks: document.getElementById("socialLinks"),
+ email: document.getElementById("email"),
+ phoneNumber: document.getElementById("phoneNumber"),
+ location: document.getElementById("location"),
+ description: document.getElementById("description"),
+ rejectBtn: document.getElementById("rejectBtn"),
+ approveBtn: document.getElementById("approveBtn"),
+ feedback: document.getElementById("feedback")
+};
+
+const organizerId = new URLSearchParams(window.location.search).get("id");
+let currentOrganizer = null;
+
+async function apiRequest(endpoint, options = {}) {
+ const response = await fetch(`${API_BASE_URL}${endpoint}`, {
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json",
+ ...(options.headers || {})
+ },
+ ...options
+ });
+
+ const contentType = response.headers.get("content-type") || "";
+ const data = contentType.includes("application/json")
+ ? await response.json()
+ : await response.text();
+
+ if (!response.ok) {
+ throw new Error(
+ (data && data.message) ||
+ (data && data.error) ||
+ "Request failed"
+ );
+ }
+
+ return data;
+}
+
+function normalizeUsers(payload) {
+ if (Array.isArray(payload)) return payload;
+ if (Array.isArray(payload?.users)) return payload.users;
+ if (Array.isArray(payload?.data)) return payload.data;
+ return [];
+}
+
+function getDisplayName(user) {
+ return user.fullName || user.name || user.organizationName || "Organization";
+}
+
+function getLocation(user) {
+ if (typeof user.location === "string" && user.location.trim()) {
+ return user.location;
+ }
+
+ if (user.location && typeof user.location === "object") {
+ return (
+ [user.location.venue, user.location.city || user.location.state]
+ .filter(Boolean)
+ .join(", ") || "—"
+ );
+ }
+
+ return user.city || user.state || "—";
+}
+
+function getVerificationStatus(user) {
+ const status = String(user.status || "").toLowerCase();
+ const approvalStatus = String(user.approvalStatus || "").toLowerCase();
+ const isVerified = Boolean(user.isVerified);
+
+ if (status === "rejected" || approvalStatus === "rejected") return "rejected";
+
+ if (
+ status === "verified" ||
+ status === "approved" ||
+ approvalStatus === "verified" ||
+ approvalStatus === "approved" ||
+ isVerified
+ ) {
+ return "verified";
+ }
+
+ return "awaiting";
+}
+
+function setStatusBadge(status) {
+ els.statusBadge.textContent =
+ status === "verified"
+ ? "Verified"
+ : status === "rejected"
+ ? "Rejected"
+ : "Awaiting Verification";
+
+ els.statusBadge.className = "status-badge";
+ els.statusBadge.classList.add(status);
+}
+
+function renderSocialLinks(user) {
+ const link =
+ user.website ||
+ user.socialLink ||
+ user.socialLinks?.[0] ||
+ "";
+
+ if (!link) {
+ els.socialLinks.textContent = "—";
+ return;
+ }
+
+ els.socialLinks.innerHTML = `
+
+ ${link}
+
+ `;
+}
+
+function setFeedback(message, type = "") {
+ els.feedback.textContent = message;
+ els.feedback.className = "feedback";
+ if (type) {
+ els.feedback.classList.add(type);
+ }
+}
+
+function populateOrganizer(user) {
+ const status = getVerificationStatus(user);
+
+ currentOrganizer = user;
+
+ els.orgTitle.textContent = getDisplayName(user);
+ els.orgName.textContent = getDisplayName(user);
+ els.email.textContent = user.email || "—";
+ els.phoneNumber.textContent =
+ user.phoneNumber || user.phone || "—";
+ els.location.textContent = getLocation(user);
+ els.description.textContent =
+ user.description ||
+ user.bio ||
+ "No organization description available.";
+
+ renderSocialLinks(user);
+ setStatusBadge(status);
+
+ if (status === "verified") {
+ els.approveBtn.disabled = true;
+ }
+
+ if (status === "rejected") {
+ els.rejectBtn.disabled = true;
+ }
+}
+
+async function loadOrganizerDetails() {
+ if (!organizerId) {
+ setFeedback("No organizer ID provided.", "error");
+ els.rejectBtn.disabled = true;
+ els.approveBtn.disabled = true;
+ return;
+ }
+
+ try {
+ let payload;
+
+ try {
+ payload = await apiRequest("/user");
+ } catch {
+ payload = await apiRequest("/users");
+ }
+
+ const users = normalizeUsers(payload);
+
+ const organizer = users.find(
+ (user) => String(user._id || user.id) === String(organizerId)
+ );
+
+ if (!organizer) {
+ throw new Error("Organizer not found");
+ }
+
+ populateOrganizer(organizer);
+ } catch (error) {
+ els.orgTitle.textContent = "Unable to load organizer";
+ els.description.textContent = "Failed to fetch organizer details.";
+ setFeedback(error.message || "Failed to load organizer details.", "error");
+ els.rejectBtn.disabled = true;
+ els.approveBtn.disabled = true;
+ }
+}
+
+async function approveOrganizer() {
+ if (!organizerId) return;
+
+ try {
+ els.approveBtn.disabled = true;
+ els.rejectBtn.disabled = true;
+
+ await apiRequest(`/admin/organizers/${organizerId}/approve`, {
+ method: "PATCH"
+ });
+
+ setStatusBadge("verified");
+ setFeedback("Organizer approved successfully.", "success");
+
+ setTimeout(() => {
+ window.location.href = "verification-queue.html";
+ }, 900);
+ } catch (error) {
+ els.approveBtn.disabled = false;
+ els.rejectBtn.disabled = false;
+ setFeedback(error.message || "Failed to approve organizer.", "error");
+ }
+}
+
+async function rejectOrganizer() {
+ if (!organizerId) return;
+
+ try {
+ els.approveBtn.disabled = true;
+ els.rejectBtn.disabled = true;
+
+ await apiRequest(`/admin/organizers/${organizerId}/reject`, {
+ method: "PATCH"
+ });
+
+ setStatusBadge("rejected");
+ setFeedback("Organizer rejected successfully.", "success");
+
+ setTimeout(() => {
+ window.location.href = "verification-queue.html";
+ }, 900);
+ } catch (error) {
+ els.approveBtn.disabled = false;
+ els.rejectBtn.disabled = false;
+ setFeedback(error.message || "Failed to reject organizer.", "error");
+ }
+}
+
+els.approveBtn.addEventListener("click", approveOrganizer);
+els.rejectBtn.addEventListener("click", rejectOrganizer);
+
+document.addEventListener("DOMContentLoaded", loadOrganizerDetails);
diff --git a/Admin/verification/verification-queue.css b/Admin/verification/verification-queue.css
new file mode 100644
index 0000000..6b24e05
--- /dev/null
+++ b/Admin/verification/verification-queue.css
@@ -0,0 +1,433 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #edf2f6;
+ color: #172033;
+}
+
+.dashboard {
+ display: flex;
+ min-height: 100vh;
+}
+
+.sidebar {
+ width: 15rem;
+ background: #223f6b;
+ color: #ffffff;
+ padding: 1.8rem 0.9rem;
+}
+
+.sidebar-logo {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 0.35rem;
+ margin-bottom: 2.4rem;
+}
+
+.sidebar-logo img {
+ width: 3.1rem;
+ height: 3.1rem;
+ object-fit: contain;
+}
+
+.sidebar-menu {
+ list-style: none;
+}
+
+.sidebar-menu li {
+ margin-bottom: 0.8rem;
+}
+
+.sidebar-menu li a,
+.logout-btn {
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ text-decoration: none;
+ color: #ffffff;
+ padding: 0.9rem 0.85rem;
+ border-radius: 0.45rem;
+ font-size: 0.95rem;
+ transition: background 0.2s ease;
+ width: 100%;
+ border: none;
+ background: transparent;
+ cursor: pointer;
+}
+
+.sidebar-menu li a i,
+.logout-btn i {
+ width: 1rem;
+ text-align: center;
+}
+
+.sidebar-menu li.active a,
+.sidebar-menu li a:hover {
+ background: #1d7de2;
+}
+
+.logout-btn:hover {
+ background: #ef2f2f;
+}
+
+.content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.topbar {
+ height: 5.8rem;
+ background: #ffffff;
+ border-bottom: 0.0625rem solid #e6e8eb;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 1.8rem;
+}
+
+.search {
+ width: 21rem;
+ height: 2.9rem;
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ border: 0.0625rem solid #d9dde3;
+ border-radius: 0.35rem;
+ padding: 0 0.9rem;
+ background: #ffffff;
+}
+
+.search i {
+ color: #6b7280;
+ font-size: 0.95rem;
+}
+
+.search input {
+ width: 100%;
+ border: none;
+ outline: none;
+ background: transparent;
+ font-size: 0.95rem;
+ color: #374151;
+}
+
+.top-icons {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+ color: #111827;
+}
+
+.admin-mini-profile {
+ display: flex;
+ align-items: center;
+ gap: 0.6rem;
+}
+
+.admin-mini-profile img {
+ width: 2.3rem;
+ height: 2.3rem;
+ border-radius: 50%;
+ object-fit: cover;
+}
+
+.admin-mini-profile span {
+ font-size: 0.85rem;
+ font-weight: 600;
+}
+
+.page-header {
+ padding: 2rem 1.4rem 1rem;
+ display: flex;
+ align-items: flex-start;
+ justify-content: space-between;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.page-header h1 {
+ font-size: 2rem;
+ font-weight: 700;
+ margin-bottom: 0.3rem;
+}
+
+.page-header h3 {
+ font-size: 1rem;
+ margin-bottom: 0.3rem;
+}
+
+.page-header p {
+ font-size: 0.82rem;
+ color: #6b7280;
+}
+
+.filter-buttons {
+ display: flex;
+ gap: 0.8rem;
+ flex-wrap: wrap;
+}
+
+.filter-btn {
+ border: 0.0625rem solid #d9dde3;
+ background: #ffffff;
+ color: #374151;
+ padding: 0.75rem 1rem;
+ border-radius: 0.4rem;
+ font-size: 0.8rem;
+ cursor: pointer;
+}
+
+.filter-btn.active {
+ background: #1d7de2;
+ color: #ffffff;
+ border-color: #1d7de2;
+}
+
+.table-card {
+ margin: 0 1.4rem 2rem;
+ background: #ffffff;
+ border-radius: 0.6rem;
+ overflow: hidden;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+thead {
+ background: #f4f6f8;
+}
+
+th,
+td {
+ text-align: left;
+ padding: 1rem 1.4rem;
+}
+
+th {
+ font-size: 0.62rem;
+ letter-spacing: 0.08em;
+ color: #7b8492;
+ font-weight: 700;
+}
+
+td {
+ font-size: 0.72rem;
+ color: #172033;
+ border-top: 0.0625rem solid #eef1f3;
+}
+
+.badge {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 7rem;
+ padding: 0.35rem 0.7rem;
+ border-radius: 0.45rem;
+ color: #ffffff;
+ font-size: 0.62rem;
+ font-weight: 700;
+}
+
+.badge.awaiting {
+ background: #f59e0b;
+}
+
+.badge.verified {
+ background: #16a34a;
+}
+
+.badge.approved {
+ background: #16a34a;
+}
+
+.badge.rejected {
+ background: #dc2626;
+}
+
+.view {
+ border: none;
+ background: #1d7de2;
+ color: #ffffff;
+ padding: 0.55rem 0.9rem;
+ border-radius: 0.35rem;
+ font-size: 0.72rem;
+ cursor: pointer;
+}
+
+.view:hover {
+ opacity: 0.94;
+}
+
+.empty-state {
+ text-align: center;
+ padding: 3rem 1rem;
+}
+
+.empty-icon {
+ width: 4rem;
+ height: 4rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #e8f0fb;
+ color: #1d7de2;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.4rem;
+}
+
+.empty-state h2 {
+ font-size: 1.1rem;
+ margin-bottom: 0.4rem;
+}
+
+.empty-state p {
+ color: #6b7280;
+ font-size: 0.85rem;
+}
+
+.hidden {
+ display: none !important;
+}
+
+.modal-overlay {
+ position: fixed;
+ inset: 0;
+ background: rgba(15, 23, 42, 0.45);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1rem;
+ z-index: 999;
+}
+
+.modal-card {
+ width: 100%;
+ max-width: 25rem;
+ background: #ffffff;
+ border-radius: 1rem;
+ padding: 1.5rem;
+ position: relative;
+ text-align: center;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.15);
+}
+
+.modal-close-btn {
+ position: absolute;
+ top: 0.7rem;
+ right: 0.9rem;
+ border: none;
+ background: transparent;
+ font-size: 1.5rem;
+ color: #6b7280;
+ cursor: pointer;
+}
+
+.modal-icon-wrap {
+ width: 3.5rem;
+ height: 3.5rem;
+ margin: 0 auto 1rem;
+ border-radius: 50%;
+ background: #fee2e2;
+ color: #dc2626;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.25rem;
+}
+
+.modal-card h3 {
+ font-size: 1.2rem;
+ margin-bottom: 0.5rem;
+ color: #172033;
+}
+
+.modal-card p {
+ font-size: 0.92rem;
+ color: #6b7280;
+ margin-bottom: 1.3rem;
+}
+
+.modal-actions {
+ display: flex;
+ gap: 0.8rem;
+ justify-content: center;
+}
+
+.modal-btn {
+ border: none;
+ border-radius: 0.55rem;
+ padding: 0.8rem 1rem;
+ font-size: 0.9rem;
+ cursor: pointer;
+ min-width: 8rem;
+}
+
+.modal-btn.secondary {
+ background: #e5e7eb;
+ color: #172033;
+}
+
+.modal-btn.danger {
+ background: #dc2626;
+ color: #ffffff;
+}
+
+@media (max-width: 75rem) {
+ .table-card {
+ overflow-x: auto;
+ }
+
+ table {
+ min-width: 46rem;
+ }
+}
+
+@media (max-width: 62rem) {
+ .sidebar {
+ display: none;
+ }
+
+ .topbar {
+ padding: 0 1rem;
+ }
+
+ .search {
+ width: 16rem;
+ }
+
+ .page-header {
+ padding: 2rem 1rem 1rem;
+ }
+
+ .table-card {
+ margin: 0 1rem 2rem;
+ }
+
+ .admin-mini-profile span {
+ display: none;
+ }
+}
+
+@media (max-width: 36rem) {
+ .search {
+ width: 12rem;
+ }
+
+ .modal-actions {
+ flex-direction: column;
+ }
+
+ .modal-btn {
+ width: 100%;
+ }
+}
diff --git a/Admin/verification/verification-queue.html b/Admin/verification/verification-queue.html
new file mode 100644
index 0000000..6da050d
--- /dev/null
+++ b/Admin/verification/verification-queue.html
@@ -0,0 +1,137 @@
+
+
+
+ AIDLoop Verification
+
+
+
+
+
+
+
+
+
+
+
+
+
Loading...
+
+
+
+
+
+
+
+
+
+ Organization Name
+ Contact Email
+ Location
+ Status
+ Actions
+
+
+
+
+
+ Loading verification queue...
+
+
+
+
+
+
+
+
No organizations found
+
No organizations match the current filter.
+
+
+
+
+
+ ×
+
+
+
+
+
+
Log out?
+
You are about to end your current admin session.
+
+
+ Cancel
+ Yes, Log out
+
+
+
+// ${getDisplayName(organizer)}
+// ${organizer.email || "—"}
+// ${getLocation(organizer)}
+// ${badgeText(status)}
+// View Details
+//
+//
+// `;
+// })
+// .join("");
+
+// attachViewDetailsHandlers();
+// }
+
+// function attachViewDetailsHandlers() {
+// document.querySelectorAll(".view").forEach((button) => {
+// button.addEventListener("click", () => {
+// const organizerId = button.dataset.id;
+// window.location.href = `verification-details.html?id=${encodeURIComponent(organizerId)}`;
+// });
+// });
+// }
+
+// async function loadAdminProfile() {
+// try {
+// let profile;
+
+// try {
+// profile = await apiRequest("/users/me");
+// } catch {
+// profile = await apiRequest("/user/me");
+// }
+
+// els.adminName.textContent =
+// profile.fullName || profile.name || "Admin";
+
+// if (profile.profileImage) {
+// els.adminAvatar.src = profile.profileImage;
+// }
+// } catch (error) {
+// console.error("Failed to load admin profile:", error.message);
+// }
+// }
+
+// async function loadVerificationQueue() {
+// try {
+// let usersPayload;
+
+// try {
+// usersPayload = await apiRequest("/user");
+// } catch {
+// usersPayload = await apiRequest("/users");
+// }
+
+// const users = normalizeUsers(usersPayload);
+
+// organizers = users
+// .filter((user) => String(user.role || "").toLowerCase() === "organizer")
+// .map((user) => ({
+// ...user,
+// _verificationStatus: getVerificationStatus(user)
+// }));
+
+// updatePendingCount();
+// renderTable();
+// } catch (error) {
+// console.error("Failed to load verification queue:", error.message);
+// els.orgTable.innerHTML = `
+//
+// Failed to load verification queue.
+//
+// `;
+// }
+// }
+
+// function bindFilters() {
+// els.filterButtons.forEach((button) => {
+// button.addEventListener("click", () => {
+// els.filterButtons.forEach((btn) => btn.classList.remove("active"));
+// button.classList.add("active");
+// currentFilter = button.dataset.filter;
+// renderTable();
+// });
+// });
+// }
+
+// function openLogoutModal() {
+// els.logoutModal.classList.remove("hidden");
+// }
+
+// function closeLogoutModal() {
+// els.logoutModal.classList.add("hidden");
+// els.confirmLogout.disabled = false;
+// els.confirmLogout.textContent = "Yes, Log out";
+// }
+
+// async function handleLogout() {
+// try {
+// els.confirmLogout.disabled = true;
+// els.confirmLogout.textContent = "Logging out...";
+
+// await apiRequest("/auth/logout", {
+// method: "POST"
+// });
+// } catch (error) {
+// console.warn("Logout failed:", error.message);
+// } finally {
+// localStorage.clear();
+// sessionStorage.clear();
+// window.location.href = "../../index.html";
+// }
+// }
+
+// function bindUI() {
+// els.searchInput.addEventListener("input", renderTable);
+// bindFilters();
+
+// els.logoutBtn.addEventListener("click", openLogoutModal);
+// els.closeLogoutModal.addEventListener("click", closeLogoutModal);
+// els.cancelLogout.addEventListener("click", closeLogoutModal);
+// els.confirmLogout.addEventListener("click", handleLogout);
+
+// els.logoutModal.addEventListener("click", (event) => {
+// if (event.target === els.logoutModal) {
+// closeLogoutModal();
+// }
+// });
+
+// document.addEventListener("keydown", (event) => {
+// if (event.key === "Escape" && !els.logoutModal.classList.contains("hidden")) {
+// closeLogoutModal();
+// }
+// });
+// }
+
+// document.addEventListener("DOMContentLoaded", async () => {
+// bindUI();
+// await loadAdminProfile();
+// await loadVerificationQueue();
+// });
+
+
+
+
+
+
+
+
+
+
+
+const API_BASE_URL = "https://aidloop-backend.onrender.com/api";
+
+const els = {
+ searchInput: document.getElementById("searchInput"),
+ orgTable: document.getElementById("orgTable"),
+ orgTableWrap: document.getElementById("orgTableWrap"),
+ pendingCount: document.getElementById("pendingCount"),
+ adminName: document.getElementById("adminName"),
+ adminAvatar: document.getElementById("adminAvatar"),
+ filterButtons: document.querySelectorAll(".filter-btn"),
+ emptyState: document.getElementById("emptyState"),
+ logoutBtn: document.getElementById("logoutBtn"),
+ logoutModal: document.getElementById("logoutModal"),
+ closeLogoutModal: document.getElementById("closeLogoutModal"),
+ cancelLogout: document.getElementById("cancelLogout"),
+ confirmLogout: document.getElementById("confirmLogout")
+};
+
+let organizers = [];
+let currentFilter = "awaiting";
+
+async function apiRequest(endpoint, options = {}) {
+ const response = await fetch(`${API_BASE_URL}${endpoint}`, {
+ credentials: "include",
+ headers: {
+ "Content-Type": "application/json",
+ ...(options.headers || {})
+ },
+ ...options
+ });
+
+ const contentType = response.headers.get("content-type") || "";
+ const data = contentType.includes("application/json")
+ ? await response.json()
+ : await response.text();
+
+ if (!response.ok) {
+ throw new Error(
+ (data && data.message) ||
+ (data && data.error) ||
+ "Request failed"
+ );
+ }
+
+ return data;
+}
+
+function normalizeUsers(payload) {
+ if (Array.isArray(payload)) return payload;
+ if (Array.isArray(payload?.users)) return payload.users;
+ if (Array.isArray(payload?.data)) return payload.data;
+ return [];
+}
+
+function getVerificationStatus(user) {
+ const status = String(user.status || "").toLowerCase();
+ const approvalStatus = String(user.approvalStatus || "").toLowerCase();
+ const isVerified = Boolean(user.isVerified);
+
+ if (status === "rejected" || approvalStatus === "rejected") {
+ return "rejected";
+ }
+
+ if (
+ status === "approved" ||
+ status === "verified" ||
+ approvalStatus === "approved" ||
+ approvalStatus === "verified" ||
+ isVerified
+ ) {
+ return "approved";
+ }
+
+ return "awaiting";
+}
+
+function getLocation(user) {
+ if (typeof user.location === "string" && user.location.trim()) {
+ return user.location;
+ }
+
+ if (user.location && typeof user.location === "object") {
+ return (
+ user.location.city ||
+ user.location.state ||
+ user.location.venue ||
+ "—"
+ );
+ }
+
+ return user.city || user.state || "—";
+}
+
+function getDisplayName(user) {
+ return user.fullName || user.name || user.organizationName || "Unnamed Organizer";
+}
+
+function badgeText(status) {
+ if (status === "approved") return "Approved";
+ if (status === "rejected") return "Rejected";
+ return "Awaiting Verification";
+}
+
+function getSortDate(user) {
+ return new Date(
+ user.createdAt ||
+ user.updatedAt ||
+ user.dateCreated ||
+ 0
+ ).getTime();
+}
+
+function updatePendingCount() {
+ const count = organizers.filter(
+ (organizer) => organizer._verificationStatus === "awaiting"
+ ).length;
+
+ els.pendingCount.textContent = count;
+}
+
+function renderTable() {
+ const query = els.searchInput.value.trim().toLowerCase();
+
+ const filtered = organizers.filter((organizer) => {
+ const matchesFilter =
+ currentFilter === "all"
+ ? true
+ : organizer._verificationStatus === currentFilter;
+
+ const searchableText = `
+ ${getDisplayName(organizer)}
+ ${organizer.email || ""}
+ ${getLocation(organizer)}
+ ${organizer._verificationStatus}
+ `.toLowerCase();
+
+ return matchesFilter && searchableText.includes(query);
+ });
+
+ if (!filtered.length) {
+ els.orgTableWrap.style.display = "none";
+ els.emptyState.style.display = "block";
+ return;
+ }
+
+ els.orgTableWrap.style.display = "table";
+ els.emptyState.style.display = "none";
+
+ els.orgTable.innerHTML = filtered
+ .map((organizer) => {
+ const id = organizer._id || organizer.id || "";
+ const status = organizer._verificationStatus;
+
+ return `
+
+ ${getDisplayName(organizer)}
+ ${organizer.email || "—"}
+ ${getLocation(organizer)}
+ ${badgeText(status)}
+ View Details
+
+
+ `;
+ })
+ .join("");
+
+ attachViewDetailsHandlers();
+}
+
+function attachViewDetailsHandlers() {
+ document.querySelectorAll(".view").forEach((button) => {
+ button.addEventListener("click", () => {
+ const organizerId = button.dataset.id;
+ window.location.href = `verification-details.html?id=${encodeURIComponent(organizerId)}`;
+ });
+ });
+}
+
+async function loadAdminProfile() {
+ try {
+ let profile;
+
+ try {
+ profile = await apiRequest("/users/me");
+ } catch {
+ profile = await apiRequest("/user/me");
+ }
+
+ els.adminName.textContent =
+ profile.fullName || profile.name || "Admin";
+
+ if (profile.profileImage) {
+ els.adminAvatar.src = profile.profileImage;
+ }
+ } catch (error) {
+ console.error("Failed to load admin profile:", error.message);
+ }
+}
+
+async function loadVerificationQueue() {
+ try {
+ let usersPayload;
+
+ try {
+ usersPayload = await apiRequest("/user");
+ } catch {
+ usersPayload = await apiRequest("/users");
+ }
+
+ const users = normalizeUsers(usersPayload);
+
+ organizers = users
+ .filter((user) => String(user.role || "").toLowerCase() === "organizer")
+ .map((user) => ({
+ ...user,
+ _verificationStatus: getVerificationStatus(user)
+ }))
+ .sort((a, b) => getSortDate(b) - getSortDate(a)); // newest first
+
+ updatePendingCount();
+ renderTable();
+ } catch (error) {
+ console.error("Failed to load verification queue:", error.message);
+ els.orgTable.innerHTML = `
+
+ Failed to load verification queue.
+
+ `;
+ }
+}
+
+function bindFilters() {
+ els.filterButtons.forEach((button) => {
+ button.addEventListener("click", () => {
+ els.filterButtons.forEach((btn) => btn.classList.remove("active"));
+ button.classList.add("active");
+ currentFilter = button.dataset.filter;
+ renderTable();
+ });
+ });
+}
+
+function openLogoutModal() {
+ if (!els.logoutModal) return;
+ els.logoutModal.classList.remove("hidden");
+}
+
+function closeLogoutModal() {
+ if (!els.logoutModal) return;
+ els.logoutModal.classList.add("hidden");
+ if (els.confirmLogout) {
+ els.confirmLogout.disabled = false;
+ els.confirmLogout.textContent = "Yes, Log out";
+ }
+}
+
+async function handleLogout() {
+ try {
+ if (els.confirmLogout) {
+ els.confirmLogout.disabled = true;
+ els.confirmLogout.textContent = "Logging out...";
+ }
+
+ await apiRequest("/auth/logout", {
+ method: "POST"
+ });
+ } catch (error) {
+ console.warn("Logout failed:", error.message);
+ } finally {
+ localStorage.clear();
+ sessionStorage.clear();
+ window.location.href = "../../index.html";
+ }
+}
+
+function bindUI() {
+ els.searchInput?.addEventListener("input", renderTable);
+ bindFilters();
+
+ els.logoutBtn?.addEventListener("click", openLogoutModal);
+ els.closeLogoutModal?.addEventListener("click", closeLogoutModal);
+ els.cancelLogout?.addEventListener("click", closeLogoutModal);
+ els.confirmLogout?.addEventListener("click", handleLogout);
+
+ els.logoutModal?.addEventListener("click", (event) => {
+ if (event.target === els.logoutModal) {
+ closeLogoutModal();
+ }
+ });
+
+ document.addEventListener("keydown", (event) => {
+ if (event.key === "Escape" && els.logoutModal && !els.logoutModal.classList.contains("hidden")) {
+ closeLogoutModal();
+ }
+ });
+}
+
+document.addEventListener("DOMContentLoaded", async () => {
+ bindUI();
+ await loadAdminProfile();
+ await loadVerificationQueue();
+});
\ No newline at end of file
diff --git a/Contact.html b/Contact.html
deleted file mode 100644
index e69de29..0000000
diff --git a/HowItWorks.html b/HowItWorks.html
deleted file mode 100644
index 4bd5661..0000000
--- a/HowItWorks.html
+++ /dev/null
@@ -1,247 +0,0 @@
-
-
-
- AIDLOOP-FRONTENDWEB
-
-
-
-
-
-
- Sign Up
-
-
-
-
-
-
-
-
-
Recruit Verified
-
-
- Volun -teers
-
-
-
for Your Events
-
-
- Create and manage volunteers, connect with verified volunteers,
- track attendance, and reward effort with certificates — all in one
- platform designed to maximize your community impact.
-
-
-
- Sign Up
- Learn More
-
-
-
-
-
-
-
-
-
-
-
-
-
How it Works
-
-
-
-
-
-
-
Sign Up
-
Sign up your organization to start hosting
- volunteer events. Submit your details
- and get verified by the platform.
-
-
-
-
-
-
-
-
-
Create Volunteer Event
-
- Create volunteer apportunities using a simple
- event template. Add the event details, roles, and
- number of volunteers needed.
-
-
-
-
-
-
-
Manage Volunteers
-
- Track registrations, mark attendance, rate
- volunteers, and issue certificates from your
- organizer dashboard.
-
-
-
-
-
-
-
-
Benefits
-
-
-
-
-
-
-
Verified Volunteers
-
- Connect with volunteers who are registered and
- tracked through the platform
-
-
-
-
-
-
-
-
-
Easy Event Creation
-
- Create events quickly using a structured template
- designed for volunteer activities.
-
-
-
-
-
-
-
-
-
Attendance Tracking
-
- Monitor volunteer participation and keep records for each event.
-
-
-
-
-
-
-
-
-
Volunteer Certificates
-
- Recognize volunteers by issuing certificates after successful
- event participation.
-
-
-
-
-
-
-
-
-
-
Start Organizing Volunteer Events Today
-
-
-
- Join organization already using AidLoop to manage volunteer events
- and create meaningful community impact.
-
-
-
Sign Up
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/Images/WhatsApp Image 2026-03-08 at 15.32.16.jpeg b/Images/WhatsApp Image 2026-03-08 at 15.32.16.jpeg
deleted file mode 100644
index f251515..0000000
Binary files a/Images/WhatsApp Image 2026-03-08 at 15.32.16.jpeg and /dev/null differ
diff --git a/LICENSE b/LICENSE
deleted file mode 100644
index 02b72bb..0000000
--- a/LICENSE
+++ /dev/null
@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2026 aidloop
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
diff --git a/Login.html b/Login.html
deleted file mode 100644
index e69de29..0000000
diff --git a/Organizer/certificates/organizer-certificates.css b/Organizer/certificates/organizer-certificates.css
new file mode 100644
index 0000000..1a4be4e
--- /dev/null
+++ b/Organizer/certificates/organizer-certificates.css
@@ -0,0 +1,317 @@
+*{
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #f4f7fb;
+ color: #1f2f46;
+}
+
+.dashboard-layout {
+ display: flex;
+ min-height: 100vh;
+}
+
+.sidebar {
+ width: 15rem;
+ background: #1f3b63;
+ color: #ffffff;
+ padding: 1.5rem 1rem;
+ flex-shrink: 0;
+}
+
+.sidebar-logo {
+ text-align: center;
+ margin-bottom: 2rem;
+}
+
+.sidebar-logo img {
+ width: 5.5rem;
+ max-width: 100%;
+}
+
+.sidebar-menu {
+ list-style: none;
+ display: flex;
+ flex-direction: column;
+ gap: 0.55rem;
+}
+
+.sidebar-menu li a,
+.sidebar-logout {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ color: #ffffff;
+ text-decoration: none;
+ padding: 0.95rem 1rem;
+ border-radius: 0.65rem;
+ font-size: 0.96rem;
+ border: none;
+ background: transparent;
+ cursor: pointer;
+}
+
+.sidebar-menu li.active a,
+.sidebar-menu li a:hover {
+ background: #1f80ea;
+}
+
+.sidebar-logout:hover {
+ background: #dc2626;
+}
+
+.main-content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.topbar {
+ background: #ffffff;
+ padding: 2rem 2.2rem 1.2rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-start;
+}
+
+.page-title {
+ font-size: 2rem;
+ font-weight: 700;
+ color: #223f6b;
+}
+
+.page-subtitle {
+ margin-top: 0.3rem;
+ font-size: 0.9rem;
+ color: #6b7280;
+}
+
+.topbar-right {
+ display: flex;
+ align-items: center;
+ gap: 0.9rem;
+}
+
+.icon-btn {
+ width: 2.7rem;
+ height: 2.7rem;
+ border: none;
+ border-radius: 50%;
+ background: transparent;
+ color: #223f6b;
+ font-size: 1.35rem;
+ cursor: pointer;
+}
+
+.page-content {
+ padding: 2.2rem;
+}
+
+.stats-grid {
+ display: grid;
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ gap: 1.4rem;
+ max-width: 40rem;
+ margin-bottom: 2rem;
+}
+
+.stat-card {
+ background: #ffffff;
+ border-radius: 0.9rem;
+ padding: 1.2rem;
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+ box-shadow: 0 0.15rem 0.45rem rgba(0, 0, 0, 0.05);
+}
+
+.stat-icon {
+ width: 3rem;
+ height: 3rem;
+ border-radius: 0.7rem;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1.15rem;
+ flex-shrink: 0;
+}
+
+.stat-icon.gold {
+ background: #fff0d8;
+ color: #d29a1f;
+}
+
+.stat-icon.green {
+ background: #dff2e4;
+ color: #2e8b57;
+}
+
+.stat-icon.pink {
+ background: #f8d9dd;
+ color: #a23c4b;
+}
+
+.stat-text p {
+ font-size: 0.72rem;
+ color: #8a94a6;
+ font-weight: 600;
+}
+
+.stat-text h3 {
+ font-size: 1.9rem;
+ color: #223f6b;
+ font-weight: 700;
+ margin-top: 0.1rem;
+}
+
+.table-wrapper {
+ background: #ffffff;
+ border-radius: 0.9rem;
+ overflow: hidden;
+ border: 0.08rem solid #d8dfe8;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+thead {
+ background: #eef2f6;
+}
+
+th,
+td {
+ padding: 1rem;
+ text-align: left;
+ font-size: 0.92rem;
+}
+
+th {
+ color: #35527a;
+ font-weight: 600;
+}
+
+tbody tr {
+ border-bottom: 0.08rem solid #d7dde6;
+}
+
+tbody tr:last-child {
+ border-bottom: none;
+}
+
+.person-cell {
+ display: flex;
+ align-items: center;
+ gap: 0.8rem;
+}
+
+.avatar {
+ width: 2.2rem;
+ height: 2.2rem;
+ border-radius: 50%;
+ object-fit: cover;
+ flex-shrink: 0;
+}
+
+.status-badge {
+ display: inline-block;
+ min-width: 6.8rem;
+ text-align: center;
+ padding: 0.58rem 0.95rem;
+ border-radius: 0.42rem;
+ color: #ffffff;
+ font-size: 0.84rem;
+ font-weight: 600;
+}
+
+.status-issued {
+ background: #2e8b57;
+}
+
+.status-pending {
+ background: #f5ae42;
+}
+
+.row-actions {
+ text-align: center;
+}
+
+.row-actions button,
+.row-actions a {
+ border: none;
+ background: transparent;
+ color: #223f6b;
+ font-size: 1.1rem;
+ cursor: pointer;
+ text-decoration: none;
+}
+
+.table-footer {
+ margin-top: 1rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: #4b5563;
+ font-size: 0.9rem;
+}
+
+.pagination {
+ display: flex;
+ align-items: center;
+ gap: 0.35rem;
+ flex-wrap: wrap;
+}
+
+.page-btn {
+ border: 0.08rem solid #d6dde6;
+ background: #ffffff;
+ color: #1f2f46;
+ padding: 0.42rem 0.75rem;
+ border-radius: 0.3rem;
+ cursor: pointer;
+ font-size: 0.8rem;
+}
+
+.page-btn.active {
+ background: #1f80ea;
+ color: #ffffff;
+ border-color: #1f80ea;
+}
+
+@media (max-width: 68rem) {
+ .stats-grid {
+ grid-template-columns: 1fr;
+ max-width: 100%;
+ }
+}
+
+@media (max-width: 64rem) {
+ .dashboard-layout {
+ flex-direction: column;
+ }
+
+ .sidebar {
+ width: 100%;
+ }
+
+ .topbar {
+ flex-direction: column;
+ gap: 1rem;
+ }
+
+ .table-wrapper {
+ overflow-x: auto;
+ }
+
+ table {
+ min-width: 46rem;
+ }
+}
\ No newline at end of file
diff --git a/Organizer/certificates/organizer-certificates.html b/Organizer/certificates/organizer-certificates.html
new file mode 100644
index 0000000..e182e62
--- /dev/null
+++ b/Organizer/certificates/organizer-certificates.html
@@ -0,0 +1,169 @@
+
+
+
+ AIDLoop Organizer Certificates
+
+
+
+
+
+
+
+
+
+
+
+
+
+
TOTAL CERTIFICATES
+
0
+
+
+
+
+
+
+
+
+
+
+ Name
+ EVENT
+ Date
+ Status
+
+
+
+
+
+ Loading certificates...
+
+
+
+
+
+
+ ${row.userName} ${row.eventName}
+ ${formatDate(row.date, "long")}
+ ${row.status === "issued" ? "Issued" : "Pending"} ${row.status === "issued" && row.certificateId ? `View ` : "..."}
+
+ `).join("") || `No certificate records found. Failed to load certificates. AIDLoop Organizer Dashboard
+
+
+
+
+
+
+
+
+
+
+
+ Recent Events
+
+
+
+
+
+ Events Name
+ Location
+ Date
+ Volunteers
+ Status
+
+
+
+
+ Loading events...
+
+
+
+
+
+
+ ${event.name || "Untitled Event"}
+ ${getLocationText(event)}
+ ${formatDate(event.date, "long")}
+ ${event.filledSlots ?? event.registrationsCount ?? 0}/${event.volunteerSlots ?? 0}
+ ${getStatus(event)}
+ `).join("") || `No events found. Failed to load dashboard data. Email Verified Successfully
+
+
+
+
+
+
+
+
diff --git a/Organizer/email-verified/email-verified.js b/Organizer/email-verified/email-verified.js
new file mode 100644
index 0000000..d41b16f
--- /dev/null
+++ b/Organizer/email-verified/email-verified.js
@@ -0,0 +1,56 @@
+import { apiRequest } from "../../assets/js/api.js";
+import { ROUTES } from "../../assets/js/config.js";
+
+const els = {
+ continueBtn: document.getElementById("continueBtn"),
+ statusText: document.getElementById("statusText")
+};
+
+function setLoading(isLoading) {
+ els.continueBtn.disabled = isLoading;
+ els.continueBtn.textContent = isLoading
+ ? "Checking session..."
+ : "Continue to Dashboard";
+}
+
+async function checkUserSession() {
+ try {
+ setLoading(true);
+
+ let user;
+ try {
+ user = await apiRequest("/users/me");
+ } catch {
+ user = await apiRequest("/user/me");
+ }
+
+ if (user && String(user.role || "").toLowerCase() === "organizer") {
+ els.statusText.textContent = "You are already signed in.";
+ return true;
+ }
+
+ els.statusText.textContent = "";
+ return false;
+ } catch {
+ els.statusText.textContent = "";
+ return false;
+ } finally {
+ setLoading(false);
+ }
+}
+
+els.continueBtn.addEventListener("click", async () => {
+ const hasSession = await checkUserSession();
+
+ if (hasSession) {
+ window.location.href = ROUTES.organizerDashboard;
+ return;
+ }
+
+ window.location.href = ROUTES.organizerLogin;
+});
+
+document.addEventListener("DOMContentLoaded", async () => {
+ await checkUserSession();
+});
+
diff --git a/Organizer/events/cancel-event.css b/Organizer/events/cancel-event.css
new file mode 100644
index 0000000..27b4ba6
--- /dev/null
+++ b/Organizer/events/cancel-event.css
@@ -0,0 +1,133 @@
+
+
+.page-title {
+ font-size: 2rem;
+ font-weight: 700;
+ color: #223f6b;
+}
+
+
+.cancel-section {
+ padding: 2rem;
+ max-width: 700px;
+}
+
+.warning {
+ text-align: center;
+ margin-bottom: 2rem;
+}
+
+.warning i {
+ font-size: 3rem;
+ color: orange;
+}
+
+.warning p {
+ margin-top: 1rem;
+ color: #333;
+}
+
+.reasons h3 {
+ margin-bottom: 1rem;
+}
+
+.checkbox-grid {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ gap: 0.8rem;
+}
+
+.reason-text {
+ margin-top: 2rem;
+}
+
+textarea {
+ width: 100%;
+ height: 120px;
+ padding: 0.8rem;
+ border-radius: 8px;
+ border: 1px solid #ccc;
+}
+
+.actions {
+ display: flex;
+ gap: 1rem;
+ margin-top: 2rem;
+}
+
+.btn {
+ padding: 0.8rem 1.4rem;
+ border-radius: 6px;
+ border: none;
+ cursor: pointer;
+}
+
+.btn.danger {
+ background: red;
+ color: #fff;
+}
+
+.btn.secondary {
+ background: #2c4a74;
+ color: #fff;
+}
+
+/* MODAL */
+.modal-overlay {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: rgba(0,0,0,0.4);
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ z-index: 999;
+}
+
+.hidden {
+ display: none;
+}
+
+.modal-card {
+ background: #fff;
+ padding: 2rem;
+ border-radius: 16px;
+ width: 400px;
+ max-width: 90%;
+ text-align: center;
+ position: relative;
+}
+
+.close-btn {
+ position: absolute;
+ top: 10px;
+ right: 14px;
+ font-size: 1.4rem;
+ border: none;
+ background: none;
+ cursor: pointer;
+}
+
+.warning-icon {
+ font-size: 3rem;
+ color: orange;
+ margin-bottom: 1rem;
+}
+
+.modal-content p {
+ margin-bottom: 2rem;
+ color: #333;
+}
+
+.btn.full {
+ width: 100%;
+ margin-bottom: 1rem;
+}
+
+.btn.outline {
+ background: transparent;
+ border: 2px solid #2c4a74;
+ color: #2c4a74;
+}
\ No newline at end of file
diff --git a/Organizer/events/cancel-event.html b/Organizer/events/cancel-event.html
new file mode 100644
index 0000000..ca235a9
--- /dev/null
+++ b/Organizer/events/cancel-event.html
@@ -0,0 +1,140 @@
+
+
+
+ Cancel Event
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Cancelling this event will notify all registered volunteers and cannot be undone
+
+
+ Why are you cancelling this event?
+
+
+
+
+
+ Cancel Event
+ Go Back
+
+
+
+
+
+
+
+
×
+
+
+
+
+
+ Are you sure you want to cancel this event?
+
+
+ Yes, Cancel event
+
+
+
+ No, Go back
+
+
+
+
Create Event
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
${r} `).join("");
+// }
+
+// /* CREATE EVENT */
+// async function createEvent(status = "draft") {
+// const payload = {
+// name: document.getElementById("name").value,
+// category: document.getElementById("category").value,
+// description: document.getElementById("description").value,
+// location: {
+// venue: document.getElementById("venue").value,
+// city: document.getElementById("city").value
+// },
+// image: imageUrl,
+// date: document.getElementById("date").value,
+// startTime: document.getElementById("startTime").value,
+// endTime: document.getElementById("endTime").value,
+// volunteerSlots: Number(document.getElementById("slots").value),
+// roles,
+// certificateEnabled: document.getElementById("certificateEnabled").checked,
+// requirements: document
+// .getElementById("requirements")
+// .value.split("\n")
+// };
+
+// try {
+// const res = await apiRequest("/events", {
+// method: "POST",
+// body: JSON.stringify(payload)
+// });
+
+// const eventId = res._id || res.id;
+
+// if (status === "published") {
+// await apiRequest(`/events/${eventId}/status`, {
+// method: "PATCH",
+// body: JSON.stringify({ status: "published" })
+// });
+// }
+
+// els.formMsg.textContent = "Event created successfully!";
+// window.location.href = ROUTES.organizerDashboard;
+
+// } catch (err) {
+// els.formMsg.textContent = err.message;
+// }
+// }
+
+// /* ACTIONS */
+// els.form.addEventListener("submit", (e) => {
+// e.preventDefault();
+// createEvent("published");
+// });
+
+// els.saveDraft.addEventListener("click", () => createEvent("draft"));
+
+// /* LOGOUT */
+// els.logoutBtn.addEventListener("click", () => {
+// logout(ROUTES.organizerLogin);
+// });
+
+
+
+
+
+
+
+
+
+
+
+import { apiRequest } from "../../assets/js/api.js";
+import { ROUTES } from "../../assets/js/config.js";
+import { logout } from "../../assets/js/logout.js";
+
+const roles = [];
+let imageUrl = "";
+
+const els = {
+ form: document.getElementById("eventForm"),
+ roleInput: document.getElementById("roleInput"),
+ addRole: document.getElementById("addRole"),
+ rolesList: document.getElementById("rolesList"),
+ imageInput: document.getElementById("imageInput"),
+ imageBox: document.getElementById("imageBox"),
+ formMsg: document.getElementById("formMsg"),
+ saveDraft: document.getElementById("saveDraft"),
+ logoutBtn: document.getElementById("logoutBtn")
+};
+
+/* IMAGE */
+els.imageBox?.addEventListener("click", () => els.imageInput?.click());
+
+els.imageInput?.addEventListener("change", async (e) => {
+ const file = e.target.files?.[0];
+ if (!file) return;
+
+ // Temporary local preview
+ imageUrl = URL.createObjectURL(file);
+ els.imageBox.innerHTML = `
+ ${role}
+ ×
+
+ `)
+ .join("");
+
+ document.querySelectorAll(".remove-role-btn").forEach((button) => {
+ button.addEventListener("click", () => {
+ const index = Number(button.dataset.index);
+ roles.splice(index, 1);
+ renderRoles();
+ });
+ });
+}
+
+function setMessage(message, type = "") {
+ if (!els.formMsg) return;
+ els.formMsg.textContent = message;
+ els.formMsg.className = "form-message";
+ if (type) {
+ els.formMsg.classList.add(type);
+ }
+}
+
+function getEventPayload() {
+ return {
+ name: document.getElementById("name")?.value.trim(),
+ category: document.getElementById("category")?.value.trim(),
+ description: document.getElementById("description")?.value.trim(),
+ location: {
+ venue: document.getElementById("venue")?.value.trim(),
+ city: document.getElementById("city")?.value.trim()
+ },
+ image: imageUrl,
+ date: document.getElementById("date")?.value,
+ startTime: document.getElementById("startTime")?.value.trim(),
+ endTime: document.getElementById("endTime")?.value.trim(),
+ volunteerSlots: Number(document.getElementById("slots")?.value || 0),
+ roles,
+ certificateEnabled: document.getElementById("certificateEnabled")?.checked || false,
+ requirements: document
+ .getElementById("requirements")
+ ?.value.split("\n")
+ .map((item) => item.trim())
+ .filter(Boolean) || []
+ };
+}
+
+function extractEventId(res) {
+ return (
+ res?._id ||
+ res?.id ||
+ res?.event?._id ||
+ res?.event?.id ||
+ res?.data?._id ||
+ res?.data?.id ||
+ ""
+ );
+}
+
+/* CREATE EVENT */
+async function createEvent(status = "draft") {
+ const payload = getEventPayload();
+
+ try {
+ setMessage(status === "published" ? "Creating and publishing event..." : "Saving draft...");
+
+ const res = await apiRequest("/events", {
+ method: "POST",
+ body: JSON.stringify(payload)
+ });
+
+ console.log("Create event response:", res);
+
+ const eventId = extractEventId(res);
+
+ if (!eventId) {
+ throw new Error("Event created but no event ID was returned by the backend.");
+ }
+
+ if (status === "published") {
+ await apiRequest(`/events/${eventId}/status`, {
+ method: "PATCH",
+ body: JSON.stringify({ status: "published" })
+ });
+ }
+
+ setMessage(
+ status === "published"
+ ? "Event published successfully!"
+ : "Draft saved successfully!",
+ "success"
+ );
+
+ setTimeout(() => {
+ window.location.href = ROUTES.organizerDashboard;
+ }, 800);
+ } catch (err) {
+ console.error("Create/publish event error:", err);
+ setMessage(err.message || "Something went wrong.", "error");
+ }
+}
+
+/* ACTIONS */
+els.form?.addEventListener("submit", (e) => {
+ e.preventDefault();
+ createEvent("published");
+});
+
+els.saveDraft?.addEventListener("click", (e) => {
+ e.preventDefault();
+ createEvent("draft");
+});
+
+/* LOGOUT */
+els.logoutBtn?.addEventListener("click", () => {
+ logout(ROUTES.organizerLogin);
+});
\ No newline at end of file
diff --git a/Organizer/events/event-details.css b/Organizer/events/event-details.css
new file mode 100644
index 0000000..ad6b3f4
--- /dev/null
+++ b/Organizer/events/event-details.css
@@ -0,0 +1,130 @@
+
+.top-actions {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.btn-primary {
+ background: #223f6b;
+ color: #fff;
+ text-decoration: none;
+ padding: 0.95rem 1.4rem;
+ border-radius: 0.75rem;
+ font-weight: 600;
+}
+
+
+.btn-danger {
+ background: #dc2626;
+ color: #fff;
+ text-decoration: none;
+ padding: 0.95rem 1.4rem;
+ border-radius: 0.75rem;
+ font-weight: 600;
+ cursor: pointer;
+}
+
+.icon-btn {
+ width: 2.6rem;
+ height: 2.6rem;
+ border: none;
+ border-radius: 50%;
+ background: transparent;
+ color: #223f6b;
+ font-size: 1.35rem;
+ cursor: pointer;
+}
+
+
+.profile-mini img {
+ width: 2.5rem;
+ height: 2.5rem;
+ border-radius: 50%;
+ object-fit: cover;
+}
+
+.event-details {
+ padding: 2rem;
+}
+
+.event-image {
+ position: relative;
+ margin: 1rem 0;
+}
+
+.event-image img {
+ width: 100%;
+ border-radius: 10px;
+}
+
+.status-badge {
+ position: absolute;
+ top: 15px;
+ right: 15px;
+ padding: 6px 14px;
+ border-radius: 6px;
+ color: #fff;
+ font-size: 0.85rem;
+}
+
+.status-published { background: green; }
+.status-draft { background: gray; }
+.status-cancelled { background: red; }
+
+.description-box {
+ border: 1px solid #ccc;
+ padding: 1rem;
+ border-radius: 8px;
+ margin: 1rem 0;
+}
+
+.event-meta {
+ display: flex;
+ gap: 2rem;
+ margin: 1rem 0;
+}
+
+.requirements ul {
+ padding-left: 1.5rem;
+}
+
+.stats {
+ display: flex;
+ gap: 2rem;
+ margin: 2rem 0;
+}
+
+.stat {
+ background: #f3f5f9;
+ padding: 1rem;
+ border-radius: 8px;
+ text-align: center;
+}
+
+.table-wrapper {
+ margin-top: 1.5rem;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+td, th {
+ padding: 0.8rem;
+ border-bottom: 1px solid #ddd;
+}
+
+.row-actions {
+ text-align: center;
+}
+
+.row-actions a,
+.row-actions button {
+ color: #223f6b;
+ background: transparent;
+ border: none;
+ cursor: pointer;
+ font-size: 1.2rem;
+}
\ No newline at end of file
diff --git a/Organizer/events/event-details.html b/Organizer/events/event-details.html
new file mode 100644
index 0000000..c2b7b4c
--- /dev/null
+++ b/Organizer/events/event-details.html
@@ -0,0 +1,151 @@
+
+
+
+ Event Details
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Loading...
+
+
+
+
Status
+
Events Description
+
+
+
+
+
+
+
+
+
Volunteer Requirements
+
+
+
+
+
+ Name
+ Email
+ Date
+ Status
+
+
+
+
+ Loading...
+
+
+
+
${r} `)
+ .join("");
+
+ // Stats
+ els.totalSlots.textContent = eventData.volunteerSlots;
+
+ await loadVolunteers();
+}
+
+async function loadVolunteers() {
+ const data = await apiRequest(`/applications/events/${eventId}/registrations`);
+
+ const volunteers = Array.isArray(data) ? data : data.data || [];
+
+ els.registered.textContent = volunteers.length;
+ els.remaining.textContent = eventData.volunteerSlots - volunteers.length;
+
+ if (!volunteers.length) {
+ els.table.innerHTML = `No volunteers yet
+ ${v.user?.fullName || "Unknown"}
+ ${v.user?.email || "—"}
+ ${new Date(v.createdAt).toDateString()}
+ Confirmed
+ `).join("");
+}
+
+// Cancel event
+els.cancelBtn.addEventListener("click", async () => {
+ if (!confirm("Cancel this event?")) return;
+
+ await apiRequest(`/events/${eventId}/cancel`, {
+ method: "PATCH",
+ body: JSON.stringify({ reason: "Cancelled by organizer" })
+ });
+
+ alert("Event cancelled");
+ location.reload();
+});
+
+// Edit
+els.editBtn.addEventListener("click", () => {
+ window.location.href = `create-event.html?id=${eventId}`;
+});
+
+// Logout
+els.logoutBtn.addEventListener("click", () => {
+ logout("../login/organizer-login.html/");
+
+});
+
+// Init
+document.addEventListener("DOMContentLoaded", async () => {
+ await requireRole("organizer", "../login/organizer-login.html");
+ await loadEvent();
+});
diff --git a/Organizer/events/event-listing.css b/Organizer/events/event-listing.css
new file mode 100644
index 0000000..654fd13
--- /dev/null
+++ b/Organizer/events/event-listing.css
@@ -0,0 +1,249 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #f4f7fb;
+ color: #1f2f46;
+}
+
+.dashboard-layout {
+ display: flex;
+ min-height: 100vh;
+}
+
+.sidebar {
+ width: 15rem;
+ background: #1f3b63;
+ color: #fff;
+ padding: 1.5rem 1rem;
+ flex-shrink: 0;
+}
+
+.sidebar-logo {
+ text-align: center;
+ margin-bottom: 2rem;
+}
+
+.sidebar-logo img {
+ width: 6rem;
+}
+
+.sidebar-menu {
+ list-style: none;
+ display: flex;
+ flex-direction: column;
+ gap: 0.55rem;
+}
+
+.sidebar-menu li a,
+.sidebar-logout {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ color: #fff;
+ text-decoration: none;
+ padding: 0.95rem 1rem;
+ border-radius: 0.65rem;
+ font-size: 0.98rem;
+ border: none;
+ background: transparent;
+ cursor: pointer;
+}
+
+.sidebar-menu li.active a,
+.sidebar-menu li a:hover {
+ background: #1f80ea;
+}
+
+.sidebar-logout:hover {
+ background: #dc2626;
+}
+
+.main-content {
+ flex: 1;
+}
+
+.topbar {
+ background: #fff;
+ padding: 1.5rem 2rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-start;
+}
+
+.page-title {
+ font-size: 2rem;
+ font-weight: 700;
+ color: #223f6b;
+}
+
+.page-subtitle {
+ color: #6b7280;
+ font-size: 0.9rem;
+ margin-top: 0.3rem;
+}
+
+.topbar-actions {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.create-event-btn {
+ background: #223f6b;
+ color: #fff;
+ text-decoration: none;
+ padding: 0.95rem 1.4rem;
+ border-radius: 0.75rem;
+ font-weight: 600;
+}
+
+.icon-btn {
+ width: 2.6rem;
+ height: 2.6rem;
+ border: none;
+ border-radius: 50%;
+ background: transparent;
+ color: #223f6b;
+ font-size: 1.35rem;
+ cursor: pointer;
+}
+
+.profile-mini img {
+ width: 2.5rem;
+ height: 2.5rem;
+ border-radius: 50%;
+ object-fit: cover;
+}
+
+.events-section {
+ padding: 2rem;
+}
+
+.filter-tabs {
+ display: flex;
+ gap: 2rem;
+ margin-bottom: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.filter-btn {
+ background: transparent;
+ border: none;
+ color: #111827;
+ font-size: 1rem;
+ cursor: pointer;
+ padding-bottom: 0.4rem;
+}
+
+.filter-btn.active {
+ color: #1f80ea;
+ font-weight: 600;
+}
+
+.table-wrapper {
+ background: #fff;
+ border-radius: 0.85rem;
+ overflow: hidden;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+thead {
+ background: #eef2f6;
+}
+
+th,
+td {
+ padding: 1rem;
+ text-align: left;
+ font-size: 0.92rem;
+}
+
+th {
+ color: #35527a;
+ font-weight: 600;
+}
+
+tbody tr {
+ border-bottom: 0.08rem solid #d7dde6;
+}
+
+tbody tr:last-child {
+ border-bottom: none;
+}
+
+.status-badge {
+ display: inline-block;
+ min-width: 7rem;
+ text-align: center;
+ padding: 0.62rem 1rem;
+ border-radius: 0.45rem;
+ color: #fff;
+ font-size: 0.88rem;
+ font-weight: 600;
+}
+
+.status-upcoming {
+ background: #f5ae42;
+}
+
+.status-published {
+ background: #26a65b;
+}
+
+.status-draft {
+ background: #6f809b;
+}
+
+.status-completed {
+ background: #1f80ea;
+}
+
+.status-cancelled {
+ background: #dc2626;
+}
+
+.row-actions {
+ text-align: center;
+}
+
+.row-actions a,
+.row-actions button {
+ color: #223f6b;
+ background: transparent;
+ border: none;
+ cursor: pointer;
+ font-size: 1.2rem;
+}
+
+@media (max-width: 52rem) {
+ .dashboard-layout {
+ flex-direction: column;
+ }
+
+ .sidebar {
+ width: 100%;
+ }
+
+ .topbar {
+ flex-direction: column;
+ gap: 1rem;
+ }
+
+ .table-wrapper {
+ overflow-x: auto;
+ }
+
+ table {
+ min-width: 50rem;
+ }
+}
diff --git a/Organizer/events/event-listing.html b/Organizer/events/event-listing.html
new file mode 100644
index 0000000..3760f04
--- /dev/null
+++ b/Organizer/events/event-listing.html
@@ -0,0 +1,110 @@
+
+
+
+ AIDLoop Organizer Events
+
+
+
+
+
+
+
+
+
+ All
+ Draft
+ Published
+ Cancelled
+
+
+
+
+
+
+ Events Name
+ Location
+ Date
+ Volunteers
+ Status
+
+
+
+
+
+ Loading events...
+
+
+
+
+
+
+ ${event.name || "Untitled Event"}
+ ${getLocationText(event)}
+ ${formatDate(event.date, "long")}
+ ${event.filledSlots ?? event.registrationsCount ?? 0}/${event.volunteerSlots ?? 0}
+ ${statusOf(event)} Details
+ `).join("") || `No events found. Failed to load events. AIDLoop Organizer Login
+
+
+
+
+
+
+
Connecting Volunteers to verified community events
+
Welcome back to AidLoop
+
+ Sign in to access your organizers dashboard, manage volunteer events, and track participant activity
+
+
+
+
+
+
+
+
+
diff --git a/Organizer/login/organizer-login.js b/Organizer/login/organizer-login.js
new file mode 100644
index 0000000..59c2685
--- /dev/null
+++ b/Organizer/login/organizer-login.js
@@ -0,0 +1,92 @@
+import { apiRequest } from "../../assets/js/api.js";
+import { ROUTES } from "../../assets/js/config.js";
+
+const els = {
+ form: document.getElementById("loginForm"),
+ email: document.getElementById("email"),
+ password: document.getElementById("password"),
+ togglePassword: document.getElementById("togglePassword"),
+ loginBtn: document.getElementById("loginBtn"),
+
+ emailError: document.getElementById("emailError"),
+ passwordError: document.getElementById("passwordError"),
+ formError: document.getElementById("formError"),
+ formSuccess: document.getElementById("formSuccess")
+};
+
+function clearMessages() {
+ els.emailError.textContent = "";
+ els.passwordError.textContent = "";
+ els.formError.textContent = "";
+ els.formSuccess.textContent = "";
+}
+
+function validateEmail(email) {
+ return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
+}
+
+function setLoading(isLoading) {
+ els.loginBtn.disabled = isLoading;
+ els.loginBtn.textContent = isLoading ? "Logging in..." : "Log in";
+}
+
+/* Toggle password */
+els.togglePassword.addEventListener("click", () => {
+ const isPassword = els.password.type === "password";
+ els.password.type = isPassword ? "text" : "password";
+
+ els.togglePassword.innerHTML = isPassword
+ ? 'AIDLoop Organization Profile
+
+
+
+
+
+
+
+
+
+
+
AL
+
+
+
Loading...
+
+ Organization
+ •
+ Volunteer Management
+
+
+
+ Verified Org
+
+
+
+
+
+ About Organization
+
+
+
+
+
+
+
+
+
+
+
TOTAL EVENTS CREATED
+
0
+
This month
+
+
+
+
+
+
TOTAL VOLUNTEERS
+
0
+
This month
+
+
+
+
+
+
CERTIFICATES ISSUED
+
0
+
This month
+
+
+
+
+
+
+
AIDLoop Organizer Signup
+
+
+
+
+
+
+
Sign Up
+
Create an organizers account to start hosting volunteer events on AidLoop
+
+
+
+
+
+
+
+
diff --git a/Organizer/signup/organizer-signup.js b/Organizer/signup/organizer-signup.js
new file mode 100644
index 0000000..abc9a69
--- /dev/null
+++ b/Organizer/signup/organizer-signup.js
@@ -0,0 +1,80 @@
+import { apiRequest } from "../../assets/js/api.js";
+import { ROUTES } from "../../assets/js/config.js";
+
+const els = {
+ form: document.getElementById("signupForm"),
+ name: document.getElementById("name"),
+ email: document.getElementById("email"),
+ password: document.getElementById("password"),
+ phone: document.getElementById("phone"),
+ state: document.getElementById("state"),
+ city: document.getElementById("city"),
+ description: document.getElementById("description"),
+ social: document.getElementById("social"),
+ btn: document.getElementById("signupBtn"),
+ error: document.getElementById("formError"),
+ success: document.getElementById("formSuccess")
+};
+
+function setLoading(isLoading) {
+ els.btn.disabled = isLoading;
+ els.btn.textContent = isLoading ? "Creating account..." : "Sign Up";
+}
+
+function validateEmail(email) {
+ return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
+}
+
+els.form.addEventListener("submit", async (e) => {
+ e.preventDefault();
+
+ els.error.textContent = "";
+ els.success.textContent = "";
+
+ const fullName = els.name.value.trim();
+ const email = els.email.value.trim();
+ const password = els.password.value.trim();
+
+ if (!fullName || !email || !password) {
+ els.error.textContent = "All required fields must be filled";
+ return;
+ }
+
+ if (!validateEmail(email)) {
+ els.error.textContent = "Invalid email address";
+ return;
+ }
+
+ if (password.length < 6) {
+ els.error.textContent = "Password must be at least 6 characters";
+ return;
+ }
+
+ try {
+ setLoading(true);
+
+ const response = await apiRequest("/auth/register/web", {
+ method: "POST",
+ header: {"Content-Type": "application.json"},
+ body: JSON.stringify({
+ fullName,
+ email,
+ password
+ })
+ });
+
+ els.success.textContent =
+ response.message || "Account created successfully. Check your email for verification.";
+
+ sessionStorage.setItem("aidloop_pending_verification_email", email);
+ localStorage.setItem("aidloop_organizer_email", email);
+
+ setTimeout(() => {
+ window.location.href = "../verify-email/verify-email.html";
+ }, 1200);
+ } catch (error) {
+ els.error.textContent = error.message || "Signup failed";
+ } finally {
+ setLoading(false);
+ }
+});
diff --git a/Organizer/verify-email/verify-email.css b/Organizer/verify-email/verify-email.css
new file mode 100644
index 0000000..16932d4
--- /dev/null
+++ b/Organizer/verify-email/verify-email.css
@@ -0,0 +1,123 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #f5f7fa;
+ min-height: 100vh;
+}
+
+.verify-page {
+ min-height: 100vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 2rem;
+}
+
+.verify-card {
+ width: 100%;
+ max-width: 40rem;
+ min-height: 46rem;
+ background: #ffffff;
+ padding: 4rem 2rem;
+ text-align: center;
+ box-shadow: 0 0.625rem 2.5rem rgba(0, 0, 0, 0.05);
+}
+
+.icon-wrap {
+ display: flex;
+ justify-content: center;
+ margin-bottom: 1.5rem;
+}
+
+.mail-box {
+ width: 7rem;
+ height: 7rem;
+ border-radius: 1rem;
+ background: #f5ae42;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.mail-box i {
+ font-size: 4rem;
+ color: #ffffff;
+}
+
+.verify-card h1 {
+ font-size: 2rem;
+ color: #223f6b;
+ margin-bottom: 3rem;
+ font-weight: 700;
+}
+
+.divider {
+ width: 100%;
+ height: 0.0625rem;
+ background: #cfd5dc;
+ margin-bottom: 1.5rem;
+}
+
+.message {
+ max-width: 25rem;
+ margin: 0 auto 0.75rem;
+ font-size: 1rem;
+ line-height: 1.7;
+ color: #4b5563;
+}
+
+.email-text {
+ margin-bottom: 1.5rem;
+ font-size: 0.95rem;
+ color: #223f6b;
+ font-weight: 600;
+}
+
+.primary-btn {
+ margin-top: 2rem;
+ width: 100%;
+ max-width: 15rem;
+ border: none;
+ background: #223f6b;
+ color: #ffffff;
+ padding: 1rem 1.25rem;
+ border-radius: 0.75rem;
+ font-size: 1rem;
+ font-weight: 600;
+ cursor: pointer;
+}
+
+.primary-btn:hover {
+ background: goldenrod;
+}
+
+.primary-btn:disabled {
+ background: #dc2626;
+ cursor: not-allowed;
+}
+
+@media (max-width: 40rem) {
+ .verify-card {
+ min-height: auto;
+ padding: 3rem 1.25rem;
+ }
+
+ .verify-card h1 {
+ font-size: 1.7rem;
+ margin-bottom: 2rem;
+ }
+
+ .mail-box {
+ width: 6rem;
+ height: 6rem;
+ }
+
+ .mail-box i {
+ font-size: 3.2rem;
+ }
+}
diff --git a/Organizer/verify-email/verify-email.html b/Organizer/verify-email/verify-email.html
new file mode 100644
index 0000000..b2a10a6
--- /dev/null
+++ b/Organizer/verify-email/verify-email.html
@@ -0,0 +1,44 @@
+
+
+
+ Verify Your Email
+
+
+
+
+
+ Verify Your Email
+
+
+
+
+ We've sent a verification link to your email address.
+ Please check your inbox and click the link to continue.
+
+
+
+
+ Resend Email
+
+
+
+
+
+
diff --git a/Organizer/verify-email/verify-email.js b/Organizer/verify-email/verify-email.js
new file mode 100644
index 0000000..dd6306c
--- /dev/null
+++ b/Organizer/verify-email/verify-email.js
@@ -0,0 +1,70 @@
+import { apiRequest } from "../../assets/js/api.js";
+import { ROUTES } from "../../assets/js/config.js";
+
+const els = {
+ resendBtn: document.getElementById("resendBtn"),
+ formError: document.getElementById("formError"),
+ formSuccess: document.getElementById("formSuccess"),
+ emailText: document.getElementById("emailText")
+};
+
+function getStoredEmail() {
+ return (
+ sessionStorage.getItem("aidloop_pending_verification_email") ||
+ localStorage.getItem("aidloop_organizer_email") ||
+ ""
+ );
+}
+
+function setLoading(isLoading) {
+ els.resendBtn.disabled = isLoading;
+ els.resendBtn.textContent = isLoading ? "Resending..." : "Resend Email";
+}
+
+async function resendVerification() {
+ const email = getStoredEmail();
+
+ els.formError.textContent = "";
+ els.formSuccess.textContent = "";
+
+ if (!email) {
+ els.formError.textContent = "No email found. Please sign up again.";
+ return;
+ }
+
+ try {
+ setLoading(true);
+
+ const result = await apiRequest("/auth/resend-otp", {
+ method: "POST",
+ body: JSON.stringify({ email })
+ });
+
+ els.formSuccess.textContent =
+ result.message || "Verification email sent successfully.";
+ } catch (error) {
+ els.formError.textContent = error.message || "Failed to resend verification email.";
+ } finally {
+ setLoading(false);
+ }
+}
+
+document.addEventListener("DOMContentLoaded", () => {
+ const email = getStoredEmail();
+
+ if (email) {
+ els.emailText.textContent = `Sent to: ${email}`;
+ } else {
+ els.emailText.textContent = "";
+ }
+
+ els.resendBtn.addEventListener("click", resendVerification);
+});
+
+
+
+
+
+
+
+
diff --git a/Organizer/volunteers/volunteers.css b/Organizer/volunteers/volunteers.css
new file mode 100644
index 0000000..b045df3
--- /dev/null
+++ b/Organizer/volunteers/volunteers.css
@@ -0,0 +1,406 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: "Poppins", sans-serif;
+}
+
+body {
+ background: #f4f7fb;
+ color: #1f2f46;
+}
+
+.dashboard-layout {
+ display: flex;
+ min-height: 100vh;
+}
+
+.sidebar {
+ width: 15rem;
+ background: #1f3b63;
+ color: #ffffff;
+ padding: 1.5rem 1rem;
+ flex-shrink: 0;
+}
+
+.sidebar-logo {
+ text-align: center;
+ margin-bottom: 2rem;
+}
+
+.sidebar-logo img {
+ width: 5.5rem;
+ max-width: 100%;
+}
+
+.sidebar-menu {
+ list-style: none;
+ display: flex;
+ flex-direction: column;
+ gap: 0.55rem;
+}
+
+.sidebar-menu li a,
+.sidebar-logout {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ gap: 0.85rem;
+ color: #ffffff;
+ text-decoration: none;
+ padding: 0.95rem 1rem;
+ border-radius: 0.65rem;
+ font-size: 0.96rem;
+ border: none;
+ background: transparent;
+ cursor: pointer;
+}
+
+.sidebar-menu li.active a,
+.sidebar-menu li a:hover {
+ background: #1f80ea;
+}
+
+.sidebar-logout:hover {
+ background: #dc2626;
+}
+
+.main-content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.topbar {
+ background: #ffffff;
+ padding: 2rem 2.2rem 1.2rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-start;
+}
+
+.page-title {
+ font-size: 2rem;
+ font-weight: 700;
+ color: #223f6b;
+}
+
+.page-subtitle {
+ margin-top: 0.3rem;
+ font-size: 0.9rem;
+ color: #6b7280;
+}
+
+.topbar-right {
+ display: flex;
+ align-items: center;
+ gap: 0.9rem;
+}
+
+.icon-btn {
+ width: 2.7rem;
+ height: 2.7rem;
+ border: none;
+ border-radius: 50%;
+ background: transparent;
+ color: #223f6b;
+ font-size: 1.35rem;
+ cursor: pointer;
+}
+
+.page-content {
+ padding: 2rem 2.2rem;
+}
+
+.toolbar {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ margin-bottom: 2rem;
+}
+
+.filter-tabs {
+ display: flex;
+ align-items: center;
+ gap: 2rem;
+ flex-wrap: wrap;
+}
+
+.filter-btn {
+ border: none;
+ background: transparent;
+ color: #111827;
+ font-size: 1rem;
+ cursor: pointer;
+ padding-bottom: 0.35rem;
+}
+
+.filter-btn.active {
+ color: #1f80ea;
+ font-weight: 600;
+}
+
+.search-box {
+ width: 100%;
+ max-width: 17rem;
+ display: flex;
+ align-items: center;
+ border: 0.08rem solid #8fa1ba;
+ border-radius: 0.55rem;
+ overflow: hidden;
+ background: #ffffff;
+}
+
+.search-box input {
+ flex: 1;
+ border: none;
+ outline: none;
+ padding: 0.9rem 0.9rem;
+ font-size: 0.9rem;
+ background: transparent;
+}
+
+.search-box button {
+ width: 3rem;
+ border: none;
+ background: transparent;
+ color: #1f80ea;
+ cursor: pointer;
+ font-size: 1rem;
+}
+
+.stats-grid {
+ display: grid;
+ gap: 2rem;
+ margin-bottom: 2rem;
+}
+
+.three-cards {
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ max-width: 48rem;
+}
+
+.stat-card {
+ background: #ffffff;
+ border: 0.08rem solid #9ca9bb;
+ border-radius: 0.85rem;
+ overflow: hidden;
+}
+
+.stat-number {
+ text-align: center;
+ font-size: 2.2rem;
+ font-weight: 700;
+ color: #111111;
+ padding: 1rem 0 0.7rem;
+}
+
+.stat-footer {
+ border-top: 0.08rem solid #c9d2dd;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ gap: 0.55rem;
+ padding: 0.95rem 1rem;
+ color: #526176;
+ font-size: 0.86rem;
+}
+
+.stat-footer i {
+ color: #1f80ea;
+ font-size: 1rem;
+}
+
+.table-wrapper {
+ background: #ffffff;
+ border-radius: 0.85rem;
+ overflow: hidden;
+ border: 0.08rem solid #d8dfe8;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+thead {
+ background: #eef2f6;
+}
+
+th,
+td {
+ padding: 1rem;
+ text-align: left;
+ font-size: 0.92rem;
+}
+
+th {
+ color: #35527a;
+ font-weight: 600;
+}
+
+tbody tr {
+ border-bottom: 0.08rem solid #d7dde6;
+}
+
+tbody tr:last-child {
+ border-bottom: none;
+}
+
+.volunteer-name {
+ display: flex;
+ align-items: center;
+ gap: 0.8rem;
+}
+
+.avatar {
+ width: 2.1rem;
+ height: 2.1rem;
+ border-radius: 50%;
+ object-fit: cover;
+ flex-shrink: 0;
+}
+
+.badge {
+ display: inline-block;
+ min-width: 6.8rem;
+ text-align: center;
+ padding: 0.55rem 0.9rem;
+ border-radius: 0.4rem;
+ color: #ffffff;
+ font-size: 0.84rem;
+ font-weight: 600;
+}
+
+.confirmed {
+ background: #26a65b;
+}
+
+.attendance-wrap {
+ display: flex;
+ align-items: center;
+}
+
+.attendance-box {
+ width: 1.8rem;
+ height: 1.8rem;
+ border: 0.1rem solid #1f80ea;
+ border-radius: 0.45rem;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ background: #ffffff;
+ cursor: pointer;
+ transition: 0.2s ease;
+}
+
+.attendance-box.checked {
+ background: #1f80ea;
+ color: #ffffff;
+}
+
+.attendance-box:disabled {
+ opacity: 0.7;
+ cursor: not-allowed;
+}
+
+.row-actions {
+ text-align: center;
+ color: #223f6b;
+ font-size: 1.1rem;
+}
+
+.row-actions button {
+ border: none;
+ background: transparent;
+ color: inherit;
+ cursor: pointer;
+}
+
+.table-footer {
+ margin-top: 1rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: #4b5563;
+ font-size: 0.9rem;
+}
+
+.pagination {
+ display: flex;
+ align-items: center;
+ gap: 0.35rem;
+ flex-wrap: wrap;
+}
+
+.page-btn {
+ border: 0.08rem solid #d6dde6;
+ background: #ffffff;
+ color: #1f2f46;
+ padding: 0.42rem 0.75rem;
+ border-radius: 0.3rem;
+ cursor: pointer;
+ font-size: 0.8rem;
+}
+
+.page-btn.active {
+ background: #1f80ea;
+ color: #ffffff;
+ border-color: #1f80ea;
+}
+
+.qualification-cell {
+ font-size: 0.84rem;
+ font-weight: 500;
+}
+
+.qualification-cell.qualified {
+ color: #15803d;
+}
+
+.qualification-cell.pending {
+ color: #9ca3af;
+}
+
+@media (max-width: 68rem) {
+ .three-cards {
+ grid-template-columns: 1fr;
+ max-width: 100%;
+ }
+}
+
+@media (max-width: 64rem) {
+ .dashboard-layout {
+ flex-direction: column;
+ }
+
+ .sidebar {
+ width: 100%;
+ }
+
+ .topbar {
+ flex-direction: column;
+ gap: 1rem;
+ }
+
+ .toolbar {
+ flex-direction: column;
+ align-items: stretch;
+ }
+
+ .search-box {
+ max-width: 100%;
+ }
+
+ .table-wrapper {
+ overflow-x: auto;
+ }
+
+ table {
+ min-width: 46rem;
+ }
+}
\ No newline at end of file
diff --git a/Organizer/volunteers/volunteers.html b/Organizer/volunteers/volunteers.html
new file mode 100644
index 0000000..49d5605
--- /dev/null
+++ b/Organizer/volunteers/volunteers.html
@@ -0,0 +1,178 @@
+
+
+
+ AIDLoop Volunteers
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Name
+ Email
+ Status
+ Attendance
+ Certificate
+
+
+
+
+
+ Loading volunteers...
+
+
+
+
+
+
No volunteers found
+
+
+
+
${getDisplayName(v)}
+
+ ${getEmail(v)}
+ Confirmed
+
+
+ ${attended ? '
+
+
+
+ ${attended ? "Qualified for certificate" : "Pending attendance"}
+
+
+
+
+
+
+ `;
+ }).join("");
+
+ attachAttendanceHandlers();
+}
+
+function attachAttendanceHandlers() {
+ document.querySelectorAll(".attendance-box").forEach((btn) => {
+ btn.addEventListener("click", async () => {
+ const id = btn.dataset.id;
+ const targetVolunteer = allVolunteers.find((v) => v._id === id);
+ const alreadyAttended = getAttendance(targetVolunteer) === "attended";
+
+ if (alreadyAttended) return;
+
+ try {
+ btn.disabled = true;
+
+ await apiRequest(`/applications/registrations/${id}/attendance`, {
+ method: "PATCH",
+ body: JSON.stringify({ status: "attended" })
+ });
+
+ allVolunteers = allVolunteers.map((v) =>
+ v._id === id
+ ? {
+ ...v,
+ attendance: "attended",
+ certificateQualified: true
+ }
+ : v
+ );
+
+ renderStats();
+ renderTable();
+ } catch (err) {
+ alert(err.message || "Failed to update attendance");
+ btn.disabled = false;
+ }
+ });
+ });
+}
+
+async function loadVolunteers() {
+ const data = await apiRequest(`/applications/events/${eventId}/registrations`);
+ const volunteers = Array.isArray(data) ? data : data.data || [];
+ allVolunteers = volunteers;
+
+ renderStats();
+ renderTable();
+}
+
+function bindFilters() {
+ els.filterBtns.forEach((btn) => {
+ btn.addEventListener("click", () => {
+ els.filterBtns.forEach((b) => b.classList.remove("active"));
+ btn.classList.add("active");
+ currentFilter = btn.dataset.filter;
+ renderTable();
+ });
+ });
+}
+
+els.searchInput.addEventListener("input", renderTable);
+
+els.logoutBtn.addEventListener("click", () => {
+ logout(ROUTES.organizerLogin);
+});
+
+document.addEventListener("DOMContentLoaded", async () => {
+ await requireRole("organizer", ROUTES.organizerLogin);
+
+ if (!eventId) {
+ alert("No event selected");
+ window.location.href = ROUTES.eventListing;
+ return;
+ }
+
+ bindFilters();
+
+ try {
+ await loadVolunteers();
+ } catch (err) {
+ els.table.innerHTML = `
+ Failed to load volunteers
+ ${message}
+
+ `;
+}
+
+export function toggleEmptyState(tableBody, emptyState, hasData) {
+ if (!tableBody || !emptyState) return;
+
+ if (hasData) {
+ tableBody.style.display = "";
+ emptyState.style.display = "none";
+ } else {
+ tableBody.style.display = "";
+ emptyState.style.display = "flex";
+ }
+}
\ No newline at end of file
diff --git a/assets/js/ui.js b/assets/js/ui.js
new file mode 100644
index 0000000..45c96c4
--- /dev/null
+++ b/assets/js/ui.js
@@ -0,0 +1,13 @@
+export function bindFilterButtons(buttons, onChange) {
+ buttons.forEach((button) => {
+ button.addEventListener("click", () => {
+ buttons.forEach((b) => b.classList.remove("active"));
+ button.classList.add("active");
+ onChange(button.dataset.filter);
+ });
+ });
+}
+
+export function renderMessageRow(tbody, colSpan, message) {
+ tbody.innerHTML = `${message} Aid Loop Organizational login
- AIDLoop - Recruit Verified Volunteers
+ 
- 
+ 
-
- 
-
- 
-
- 
-
- 
-
- 
-
- 
-
- 
+ Status
+ 