refactor code, new db tables, show AP info on UI

frontend/src/App.tsx

@@ -1,8 +1,9 @@
 import { NavLink, Navigate, Route, Routes } from 'react-router-dom'
-import { LogOut, Moon, Router, Sun, Wifi } from 'lucide-react'
+import { LogOut, Moon, Router, Sun, Users, Wifi } from 'lucide-react'
 import { useAuth } from '@/auth/auth'
 import { useTheme } from '@/lib/theme'
 import { Login } from '@/pages/Login'
+import { Clients } from '@/pages/Clients'
 import { Devices } from '@/pages/Devices'
 import { Vlans } from '@/pages/Vlans'
 import { Button } from '@/components/ui/button'
@@ -39,6 +40,9 @@ function Nav() {
           <Wifi className="h-5 w-5 text-primary" />
           RADIUS Admin
         </div>
+        <NavLink to="/clients" className={linkClass}>
+          <Users className="h-4 w-4" /> Clients
+        </NavLink>
         <NavLink to="/devices" className={linkClass}>
           <Router className="h-4 w-4" /> Devices
         </NavLink>
@@ -66,9 +70,10 @@ export default function App() {
       <Nav />
       <main className="mx-auto max-w-6xl px-4 py-6">
         <Routes>
+          <Route path="/clients" element={<Clients />} />
           <Route path="/devices" element={<Devices />} />
           <Route path="/vlans" element={<Vlans />} />
-          <Route path="*" element={<Navigate to="/devices" replace />} />
+          <Route path="*" element={<Navigate to="/clients" replace />} />
         </Routes>
       </main>
     </div>