refactor: simplify API routes and add sniffer status functionality

- Updated API routes to remove redundant prefixes.
- Introduced sniffer status fetching in the backend API.
- Added Sniffing page and integrated it into the routing.
- Created a new hook for backend API interactions.
- Implemented sniffer status type definitions.

frontend/src/appRouter.tsx

@@ -3,6 +3,7 @@ import { Navigate, Route, Routes } from 'react-router-dom';
 import App from './App'; // your layout component (has <Outlet />)
 import Home from './pages/Home';
 import Network from './pages/Network';
+import Sniffing from './pages/Sniffing';
 import { PATHS } from './routes';
 
 export default function AppRouter() {
@@ -16,6 +17,7 @@ export default function AppRouter() {
         {/* Child routes - these render inside App's <Outlet /> */}
         <Route path={PATHS.HOME.slice(1)} element={<Home />} />
         <Route path={PATHS.NETWORK.slice(1)} element={<Network />} />
+        <Route path={PATHS.SNIFFING.slice(1)} element={<Sniffing />} />
 
         {/* Fallback (renders inside layout too) */}
         <Route path="*" element={<NotFound />} />