Add search bar to admin servers page (filter by server name or owner)

Author: ddrayko

public/js/admin.js

@@ -501,17 +501,23 @@ function updateAdminNav() {
 }
 
 let adminServersPage = 1;
+let adminServersSearch = '';
 
 async function renderAdminServers() {
   document.querySelectorAll('.admin-page').forEach(p => p.classList.remove('active'));
   const el = $a('#admin-page-servers');
   if (!el) return;
   el.classList.add('active');
+  adminServersSearch = '';
   el.innerHTML = ahtml`
     <div class="page-header">
       <h1 class="page-title">All Servers</h1>
       <p class="page-subtitle">All servers across all users</p>
     </div>
+    <div class="search-wrapper" style="margin-bottom:16px;max-width:400px" id="admin-servers-search-wrapper">
+      <span data-lucide="search"></span>
+      <input type="text" id="admin-servers-search" placeholder="Search by server name or owner...">
+    </div>
     <div class="table-container">
       <table>
         <thead>
@@ -531,6 +537,19 @@ async function renderAdminServers() {
     </div>
   `;
 
+  const searchInput = $a('#admin-servers-search');
+  if (searchInput) {
+    let searchTimer;
+    searchInput.addEventListener('input', () => {
+      clearTimeout(searchTimer);
+      searchTimer = setTimeout(() => {
+        adminServersSearch = searchInput.value.trim();
+        adminServersPage = 1;
+        fetchAdminServers(1);
+      }, 400);
+    });
+  }
+
   await fetchAdminServers(adminServersPage);
 }
 
@@ -539,9 +558,11 @@ async function fetchAdminServers(pageNum) {
   const limit = 10;
   const offset = (pageNum - 1) * limit;
   const paginationEl = $a('#admin-servers-pagination');
+  const params = new URLSearchParams({ limit, offset });
+  if (adminServersSearch) params.set('search', adminServersSearch);
 
   try {
-    const data = await adminApi(`/servers?limit=${limit}&offset=${offset}`);
+    const data = await adminApi(`/servers?${params.toString()}`);
     const tbody = $a('#admin-servers-tbody');
     if (!tbody) return;
 

routes/admin.js

@@ -138,19 +138,24 @@ router.get('/servers', authenticateToken, requireAdmin, async (req, res) => {
   try {
     const limit = Math.min(parseInt(req.query.limit, 10) || 10, 50);
     const offset = Math.max(parseInt(req.query.offset, 10) || 0, 0);
+    const search = (req.query.search || '').trim().toLowerCase();
 
-    const result = await getAllServers(limit, offset);
-    const { servers: paginatedServers, total } = result;
-    const page = Math.floor(offset / limit) + 1;
-    const totalPages = Math.ceil(total / limit) || 1;
+    let allServers;
+    if (search) {
+      const result = await getAllServers();
+      allServers = Array.isArray(result) ? result : result.servers || [];
+    } else {
+      const result = await getAllServers(limit, offset);
+      allServers = result.servers || [];
+    }
 
     const users = await query('SELECT id, email, username, ptero_user_id FROM users');
     const userMap = {};
     for (const u of users) {
       userMap[u.ptero_user_id] = { id: u.id, email: u.email, username: u.username };
     }
 
-    for (const s of paginatedServers) {
+    for (const s of allServers) {
       s.owner = userMap[s.user] || { id: null, email: 'Unknown', username: 'Unknown' };
       try {
         const meta = await query('SELECT * FROM server_meta WHERE ptero_server_id = ?', [s.id]);
@@ -160,7 +165,22 @@ router.get('/servers', authenticateToken, requireAdmin, async (req, res) => {
       }
     }
 
-    res.json({ servers: paginatedServers, total, page, totalPages, limit });
+    let filtered = allServers;
+    if (search) {
+      filtered = allServers.filter(s => {
+        const name = (s.name || '').toLowerCase();
+        const ownerName = (s.owner?.username || '').toLowerCase();
+        const ownerEmail = (s.owner?.email || '').toLowerCase();
+        return name.includes(search) || ownerName.includes(search) || ownerEmail.includes(search);
+      });
+    }
+
+    const filteredTotal = filtered.length;
+    const page = Math.floor(offset / limit) + 1;
+    const totalPages = Math.ceil(filteredTotal / limit) || 1;
+    const sliced = filtered.slice(offset, offset + limit);
+
+    res.json({ servers: sliced, total: filteredTotal, page, totalPages, limit });
   } catch (err) {
     console.error('Admin servers list error:', err.message);
     res.status(500).json({ error: 'Failed to fetch servers' });