Add statistics endpoint

frontend/src/api.ts

@@ -12,6 +12,7 @@ import type {
   MigratePreferencesResponse,
   RadioConfig,
   RadioConfigUpdate,
+  StatisticsResponse,
   TelemetryResponse,
   TraceResponse,
   UnreadCounts,
@@ -216,4 +217,7 @@ export const api = {
       method: 'POST',
       body: JSON.stringify(request),
     }),
+
+  // Statistics
+  getStatistics: () => fetchJson<StatisticsResponse>('/statistics'),
 };

frontend/src/components/SettingsModal.tsx

@@ -10,6 +10,7 @@ import type {
   HealthStatus,
   RadioConfig,
   RadioConfigUpdate,
+  StatisticsResponse,
 } from '../types';
 import { Input } from './ui/input';
 import { Label } from './ui/label';
@@ -109,6 +110,7 @@ export function SettingsModal(props: SettingsModalProps) {
       connectivity: false,
       database: false,
       bot: false,
+      statistics: false,
     };
   });
 
@@ -185,6 +187,10 @@ export function SettingsModal(props: SettingsModalProps) {
   const [editingNameId, setEditingNameId] = useState<string | null>(null);
   const [editingNameValue, setEditingNameValue] = useState('');
 
+  // Statistics state
+  const [stats, setStats] = useState<StatisticsResponse | null>(null);
+  const [statsLoading, setStatsLoading] = useState(false);
+
   useEffect(() => {
     if (config) {
       setName(config.name);
@@ -239,6 +245,31 @@ export function SettingsModal(props: SettingsModalProps) {
     setSectionError(null);
   }, [externalSidebarNav, desktopSection]);
 
+  // Fetch statistics when the section becomes visible
+  const statisticsVisible = externalSidebarNav
+    ? desktopSection === 'statistics'
+    : expandedSections.statistics;
+
+  useEffect(() => {
+    if (!statisticsVisible) return;
+    let cancelled = false;
+    setStatsLoading(true);
+    api.getStatistics().then(
+      (data) => {
+        if (!cancelled) {
+          setStats(data);
+          setStatsLoading(false);
+        }
+      },
+      () => {
+        if (!cancelled) setStatsLoading(false);
+      }
+    );
+    return () => {
+      cancelled = true;
+    };
+  }, [statisticsVisible]);
+
   // Detect current preset from form values
   const currentPreset = useMemo(() => {
     const freqNum = parseFloat(freq);
@@ -1207,6 +1238,141 @@ export function SettingsModal(props: SettingsModalProps) {
           )}
         </div>
       )}
+
+      {shouldRenderSection('statistics') && (
+        <div className={sectionWrapperClass}>
+          {renderSectionHeader('statistics')}
+          {isSectionVisible('statistics') && (
+            <div className={sectionContentClass}>
+              {statsLoading && !stats ? (
+                <div className="py-8 text-center text-muted-foreground">Loading statistics...</div>
+              ) : stats ? (
+                <div className="space-y-6">
+                  {/* Network */}
+                  <div>
+                    <h4 className="text-sm font-medium mb-2">Network</h4>
+                    <div className="grid grid-cols-3 gap-3">
+                      <div className="text-center p-3 bg-muted/50 rounded-md">
+                        <div className="text-2xl font-bold">{stats.contact_count}</div>
+                        <div className="text-xs text-muted-foreground">Contacts</div>
+                      </div>
+                      <div className="text-center p-3 bg-muted/50 rounded-md">
+                        <div className="text-2xl font-bold">{stats.repeater_count}</div>
+                        <div className="text-xs text-muted-foreground">Repeaters</div>
+                      </div>
+                      <div className="text-center p-3 bg-muted/50 rounded-md">
+                        <div className="text-2xl font-bold">{stats.channel_count}</div>
+                        <div className="text-xs text-muted-foreground">Channels</div>
+                      </div>
+                    </div>
+                  </div>
+
+                  <Separator />
+
+                  {/* Messages */}
+                  <div>
+                    <h4 className="text-sm font-medium mb-2">Messages</h4>
+                    <div className="grid grid-cols-3 gap-3">
+                      <div className="text-center p-3 bg-muted/50 rounded-md">
+                        <div className="text-2xl font-bold">{stats.total_dms}</div>
+                        <div className="text-xs text-muted-foreground">Direct Messages</div>
+                      </div>
+                      <div className="text-center p-3 bg-muted/50 rounded-md">
+                        <div className="text-2xl font-bold">{stats.total_channel_messages}</div>
+                        <div className="text-xs text-muted-foreground">Channel Messages</div>
+                      </div>
+                      <div className="text-center p-3 bg-muted/50 rounded-md">
+                        <div className="text-2xl font-bold">{stats.total_outgoing}</div>
+                        <div className="text-xs text-muted-foreground">Sent (Outgoing)</div>
+                      </div>
+                    </div>
+                  </div>
+
+                  <Separator />
+
+                  {/* Packets */}
+                  <div>
+                    <h4 className="text-sm font-medium mb-2">Packets</h4>
+                    <div className="space-y-2">
+                      <div className="flex justify-between items-center">
+                        <span className="text-sm text-muted-foreground">Total stored</span>
+                        <span className="font-medium">{stats.total_packets}</span>
+                      </div>
+                      <div className="flex justify-between items-center">
+                        <span className="text-sm text-green-500">Decrypted</span>
+                        <span className="font-medium text-green-500">
+                          {stats.decrypted_packets}
+                        </span>
+                      </div>
+                      <div className="flex justify-between items-center">
+                        <span className="text-sm text-yellow-500">Undecrypted</span>
+                        <span className="font-medium text-yellow-500">
+                          {stats.undecrypted_packets}
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+
+                  <Separator />
+
+                  {/* Activity */}
+                  <div>
+                    <h4 className="text-sm font-medium mb-2">Activity</h4>
+                    <table className="w-full text-sm">
+                      <thead>
+                        <tr className="text-muted-foreground">
+                          <th className="text-left font-normal pb-1"></th>
+                          <th className="text-right font-normal pb-1">1h</th>
+                          <th className="text-right font-normal pb-1">24h</th>
+                          <th className="text-right font-normal pb-1">7d</th>
+                        </tr>
+                      </thead>
+                      <tbody>
+                        <tr>
+                          <td className="py-1">Contacts heard</td>
+                          <td className="text-right py-1">{stats.contacts_heard.last_hour}</td>
+                          <td className="text-right py-1">{stats.contacts_heard.last_24_hours}</td>
+                          <td className="text-right py-1">{stats.contacts_heard.last_week}</td>
+                        </tr>
+                        <tr>
+                          <td className="py-1">Repeaters heard</td>
+                          <td className="text-right py-1">{stats.repeaters_heard.last_hour}</td>
+                          <td className="text-right py-1">{stats.repeaters_heard.last_24_hours}</td>
+                          <td className="text-right py-1">{stats.repeaters_heard.last_week}</td>
+                        </tr>
+                      </tbody>
+                    </table>
+                  </div>
+
+                  {/* Busiest Channels */}
+                  {stats.busiest_channels_24h.length > 0 && (
+                    <>
+                      <Separator />
+                      <div>
+                        <h4 className="text-sm font-medium mb-2">Busiest Channels (24h)</h4>
+                        <div className="space-y-1">
+                          {stats.busiest_channels_24h.map((ch, i) => (
+                            <div
+                              key={ch.channel_key}
+                              className="flex justify-between items-center text-sm"
+                            >
+                              <span>
+                                <span className="text-muted-foreground mr-2">{i + 1}.</span>
+                                {ch.channel_name}
+                              </span>
+                              <span className="text-muted-foreground">{ch.message_count} msgs</span>
+                            </div>
+                          ))}
+                        </div>
+                      </div>
+                    </>
+                  )}
+                </div>
+              ) : null}
+            </div>
+          )}
+        </div>
+      )}
     </div>
   );
 }

frontend/src/components/settingsConstants.ts

@@ -1,4 +1,10 @@
-export type SettingsSection = 'radio' | 'identity' | 'connectivity' | 'database' | 'bot';
+export type SettingsSection =
+  | 'radio'
+  | 'identity'
+  | 'connectivity'
+  | 'database'
+  | 'bot'
+  | 'statistics';
 
 export const SETTINGS_SECTION_ORDER: SettingsSection[] = [
   'radio',
@@ -6,6 +12,7 @@ export const SETTINGS_SECTION_ORDER: SettingsSection[] = [
   'connectivity',
   'database',
   'bot',
+  'statistics',
 ];
 
 export const SETTINGS_SECTION_LABELS: Record<SettingsSection, string> = {
@@ -14,4 +21,5 @@ export const SETTINGS_SECTION_LABELS: Record<SettingsSection, string> = {
   connectivity: '📡 Connectivity',
   database: '🗄️ Database',
   bot: '🤖 Bot',
+  statistics: '📊 Statistics',
 };

frontend/src/test/settingsModal.test.tsx

@@ -8,6 +8,7 @@ import type {
   HealthStatus,
   RadioConfig,
   RadioConfigUpdate,
+  StatisticsResponse,
 } from '../types';
 import type { SettingsSection } from '../components/SettingsModal';
 
@@ -289,4 +290,55 @@ describe('SettingsModal', () => {
     });
     expect(onClose).not.toHaveBeenCalled();
   });
+
+  it('renders statistics section with fetched data', async () => {
+    const mockStats: StatisticsResponse = {
+      busiest_channels_24h: [
+        { channel_key: 'AA'.repeat(16), channel_name: 'general', message_count: 42 },
+      ],
+      contact_count: 10,
+      repeater_count: 3,
+      channel_count: 5,
+      total_packets: 200,
+      decrypted_packets: 150,
+      undecrypted_packets: 50,
+      total_dms: 25,
+      total_channel_messages: 80,
+      total_outgoing: 30,
+      contacts_heard: { last_hour: 2, last_24_hours: 7, last_week: 10 },
+      repeaters_heard: { last_hour: 1, last_24_hours: 3, last_week: 3 },
+    };
+
+    vi.spyOn(globalThis, 'fetch').mockResolvedValue(
+      new Response(JSON.stringify(mockStats), {
+        status: 200,
+        headers: { 'Content-Type': 'application/json' },
+      })
+    );
+
+    renderModal({
+      externalSidebarNav: true,
+      desktopSection: 'statistics',
+    });
+
+    await waitFor(() => {
+      expect(screen.getByText('Network')).toBeInTheDocument();
+    });
+
+    // Verify key labels are present
+    expect(screen.getByText('Contacts')).toBeInTheDocument();
+    expect(screen.getByText('Repeaters')).toBeInTheDocument();
+    expect(screen.getByText('Direct Messages')).toBeInTheDocument();
+    expect(screen.getByText('Channel Messages')).toBeInTheDocument();
+    expect(screen.getByText('Sent (Outgoing)')).toBeInTheDocument();
+    expect(screen.getByText('Total stored')).toBeInTheDocument();
+    expect(screen.getByText('Decrypted')).toBeInTheDocument();
+    expect(screen.getByText('Undecrypted')).toBeInTheDocument();
+    expect(screen.getByText('Contacts heard')).toBeInTheDocument();
+    expect(screen.getByText('Repeaters heard')).toBeInTheDocument();
+
+    // Busiest channels
+    expect(screen.getByText('general')).toBeInTheDocument();
+    expect(screen.getByText('42 msgs')).toBeInTheDocument();
+  });
 });

frontend/src/types.ts

@@ -211,3 +211,30 @@ export interface UnreadCounts {
   mentions: Record<string, boolean>;
   last_message_times: Record<string, number>;
 }
+
+export interface BusyChannel {
+  channel_key: string;
+  channel_name: string;
+  message_count: number;
+}
+
+export interface ContactActivityCounts {
+  last_hour: number;
+  last_24_hours: number;
+  last_week: number;
+}
+
+export interface StatisticsResponse {
+  busiest_channels_24h: BusyChannel[];
+  contact_count: number;
+  repeater_count: number;
+  channel_count: number;
+  total_packets: number;
+  decrypted_packets: number;
+  undecrypted_packets: number;
+  total_dms: number;
+  total_channel_messages: number;
+  total_outgoing: number;
+  contacts_heard: ContactActivityCounts;
+  repeaters_heard: ContactActivityCounts;
+}