feature1

frontend/static/js/app.js

@@ -14,6 +14,8 @@ const usersSection = document.getElementById("users-section");
 const appsSection = document.getElementById("apps-section");
 const usersTableBody = document.querySelector("#users-table tbody");
 const appsTableBody = document.querySelector("#apps-table tbody");
+const requestsSection = document.getElementById("requests-section");
+const requestsTableBody = document.querySelector("#requests-table tbody");
 
 // Init
 function init() {
@@ -40,11 +42,18 @@ function showSection(section) {
     if (section === 'users') {
         usersSection.classList.remove("hidden");
         appsSection.classList.add("hidden");
+        requestsSection.classList.add("hidden");
         loadUsers();
-    } else {
+    } else if (section === 'apps') {
         usersSection.classList.add("hidden");
         appsSection.classList.remove("hidden");
+        requestsSection.classList.add("hidden");
         loadApps();
+    } else {
+        usersSection.classList.add("hidden");
+        appsSection.classList.add("hidden");
+        requestsSection.classList.remove("hidden");
+        loadRequests();
     }
 }
 
@@ -156,6 +165,52 @@ async function loadApps() {
     `).join("");
 }
 
+// Requests
+async function loadRequests() {
+    const res = await authFetch(`${API_URL}/requests/`);
+    const requests = await res.json();
+    requestsTableBody.innerHTML = requests.map(req => {
+        const appsList = req.requested_apps.map(app =>
+            `<span class="badge badge-info">${app.name}</span>`
+        ).join(" ");
+
+        return `
+        <tr>
+            <td>${req.id}</td>
+            <td>${req.username}</td>
+            <td>${req.email}</td>
+            <td>${appsList}</td>
+            <td>${req.status}</td>
+            <td>
+                <button class="btn btn-primary" onclick="approveRequest(${req.id})">Approve</button>
+                <button class="btn btn-secondary" onclick="rejectRequest(${req.id})">Reject</button>
+            </td>
+        </tr>
+    `}).join("");
+}
+
+window.approveRequest = async (id) => {
+    if (!confirm("Approve this request?")) return;
+    try {
+        const res = await authFetch(`${API_URL}/requests/${id}/approve`, { method: "POST" });
+        if (!res.ok) throw new Error("Failed to approve");
+        loadRequests();
+    } catch (err) {
+        alert(err.message);
+    }
+};
+
+window.rejectRequest = async (id) => {
+    if (!confirm("Reject this request?")) return;
+    try {
+        const res = await authFetch(`${API_URL}/requests/${id}/reject`, { method: "POST" });
+        if (!res.ok) throw new Error("Failed to reject");
+        loadRequests();
+    } catch (err) {
+        alert(err.message);
+    }
+};
+
 // Modals
 function openModal(id) {
     document.getElementById(id).classList.remove("hidden");