feat: add hub filtering capability to KYC request list and update detail view with hub labels

src/app/admin/kyc/[id]/page.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import { useState, useEffect } from 'react';
+import Link from 'next/link';
 import { useParams, useRouter } from 'next/navigation';
 import {
   Shield, Check, Clock, Bike, User, Phone,
@@ -130,6 +131,14 @@ const sourceLabels: Record<string, string> = {
   referral: 'Referral',
 };
 
+const hubLabels: Record<string, string> = {
+  hub1: 'Gulshan Hub',
+  hub2: 'Banani Hub',
+  hub3: 'Dhanmondi Hub',
+  hub4: 'Mirpur Hub',
+  hub5: 'Uttara Hub',
+};
+
 const planLabels: Record<string, string> = {
   daily_rent: 'Daily Rent',
   weekly_rent: 'Weekly Rent',

src/app/admin/kyc/page.tsx

@@ -327,6 +327,7 @@ export default function RequestsPage() {
   const [requests, setRequests] = useState<Request[]>(mockRequests);
   const [searchQuery, setSearchQuery] = useState('');
   const [statusFilter, setStatusFilter] = useState('all');
+  const [hubFilter, setHubFilter] = useState('all');
   const [selectedRequest, setSelectedRequest] = useState<Request | null>(null);
   const [showMessageModal, setShowMessageModal] = useState(false);
   const [showDetailsModal, setShowDetailsModal] = useState(false);
@@ -382,7 +383,8 @@ export default function RequestsPage() {
       req.email.toLowerCase().includes(searchQuery.toLowerCase()) ||
       req.id.toLowerCase().includes(searchQuery.toLowerCase());
     const matchesStatus = statusFilter === 'all' || req.status === statusFilter;
-    return matchesTab && matchesSearch && matchesStatus;
+    const matchesHub = hubFilter === 'all' || req.sourceDetails?.toLowerCase().includes(hubFilter.toLowerCase());
+    return matchesTab && matchesSearch && matchesStatus && matchesHub;
   });
 
   const pending = requests.filter(r => r.status === 'pending' || r.status === 'documents_needed').length;
@@ -572,6 +574,18 @@ export default function RequestsPage() {
               <option value="approved">Approved</option>
               <option value="rejected">Rejected</option>
             </select>
+            <select
+              value={hubFilter}
+              onChange={(e) => setHubFilter(e.target.value)}
+              className="py-2 px-3 border border-slate-200 rounded-lg text-sm font-medium text-slate-600"
+            >
+              <option value="all">All Hubs</option>
+              <option value="Gulshan">Gulshan Hub</option>
+              <option value="Banani">Banani Hub</option>
+              <option value="Dhanmondi">Dhanmondi Hub</option>
+              <option value="Mirpur">Mirpur Hub</option>
+              <option value="Uttara">Uttara Hub</option>
+            </select>
           </div>
         </div>