feat(firewall): add packet statistics tracking for firewall clients

Enhanced the firewall client functionality by introducing packet statistics tracking, including the cumulative count of packets dropped and accepted. Updated the API to support these new fields and modified the database schema accordingly. Improved the firewall scripts to collect and report packet statistics, ensuring better visibility into client performance. Adjusted the UI components to display packet counts in the clients table, enhancing user experience and monitoring capabilities.

apps/web/src/routes/_auth/firewall.tsx

@@ -279,6 +279,13 @@ function FirewallPage() {
   )
 }
 
+function formatPacketCount(value?: number | null): string | null {
+  if (value == null || value <= 0) return null
+  if (value >= 1_000_000) return `${(value / 1_000_000).toFixed(1)}M`
+  if (value >= 1_000) return `${(value / 1_000).toFixed(1)}k`
+  return String(value)
+}
+
 function ClientsTable({
   clients,
   onApprove,
@@ -305,6 +312,7 @@ function ClientsTable({
           <TableHead>Статус</TableHead>
           <TableHead>Last seen</TableHead>
           <TableHead>Apply</TableHead>
+          <TableHead>Пакеты</TableHead>
           <TableHead />
         </TableRow>
       </TableHeader>
@@ -323,6 +331,23 @@ function ClientsTable({
               {c.last_apply_status ?? '—'}
               {c.last_apply_prefix_count != null ? ` (${c.last_apply_prefix_count})` : ''}
             </TableCell>
+            <TableCell className="text-muted-foreground text-xs">
+              {formatPacketCount(c.last_apply_packets_dropped) || formatPacketCount(c.last_apply_packets_accepted) ? (
+                <>
+                  {formatPacketCount(c.last_apply_packets_dropped) ? (
+                    <span className="text-destructive">↓{formatPacketCount(c.last_apply_packets_dropped)}</span>
+                  ) : null}
+                  {formatPacketCount(c.last_apply_packets_dropped) && formatPacketCount(c.last_apply_packets_accepted)
+                    ? ' · '
+                    : null}
+                  {formatPacketCount(c.last_apply_packets_accepted) ? (
+                    <span className="text-success">↑{formatPacketCount(c.last_apply_packets_accepted)}</span>
+                  ) : null}
+                </>
+              ) : (
+                '—'
+              )}
+            </TableCell>
             <TableCell>
               <div className="flex justify-end gap-2">
                 {c.status === 'pending' ? (

apps/web/src/types/api.ts

@@ -356,6 +356,8 @@ export type FirewallClient = {
   last_apply_at?: string | null
   last_apply_status?: string
   last_apply_prefix_count?: number
+  last_apply_packets_dropped?: number
+  last_apply_packets_accepted?: number
   last_apply_source?: string
   client_version?: string
   created_at: string