docs: add M24 GUI tests to testing guide (discovery, network scan, approval)

Adds Part 19.5 (approval workflow), 19.6 (discovery triage),
19.7 (network scan management) to GUI testing section. Renumbers
existing 19.5 Other Pages to 19.8 and Cross-Cutting to 19.9.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

README.md

@@ -24,7 +24,7 @@ certctl is a self-hosted platform that automates the entire certificate lifecycl
 
 [![License](https://img.shields.io/badge/license-BSL%201.1-blue.svg)](LICENSE)
 [![Go Report Card](https://goreportcard.com/badge/github.com/shankar0123/certctl)](https://goreportcard.com/report/github.com/shankar0123/certctl)
-![Version: v2.0.3](https://img.shields.io/badge/version-v2.0.3-brightgreen)
+![Version: v2.0.4](https://img.shields.io/badge/version-v2.0.4-brightgreen)
 
 ## Documentation
 
@@ -65,7 +65,7 @@ It's also **target-agnostic**. Agents deploy certificates to NGINX, Apache, and
 
 ## What It Does
 
-certctl gives you a single pane of glass for every TLS certificate in your organization. The **web dashboard** shows your full certificate inventory — what's healthy, what's expiring, what's already expired, and who owns each one. The **REST API** (95 endpoints under `/api/v1/` + `/.well-known/est/`) lets you automate everything. **Agents** deployed on your infrastructure generate private keys locally, discover existing certificates on disk, and submit CSRs — private keys never leave your servers. The **network scanner** discovers certificates on TLS endpoints across your infrastructure without requiring agents. The **EST server** (RFC 7030) enables device and WiFi certificate enrollment via industry-standard Enrollment over Secure Transport. The background scheduler watches expiration dates and triggers renewals automatically — when certificate lifespans drop to 47 days, certctl handles the constant rotation without human involvement.
+certctl gives you a single pane of glass for every TLS certificate in your organization. The **web dashboard** shows your full certificate inventory — what's healthy, what's expiring, what's already expired, and who owns each one. The **REST API** (95 endpoints under `/api/v1/` + `/.well-known/est/`) lets you automate everything. **Agents** deployed on your infrastructure generate private keys locally, discover existing certificates on disk, and submit CSRs — private keys never leave your servers. The **network scanner** discovers certificates on TLS endpoints across your infrastructure without requiring agents — a triage workflow in the GUI lets you claim discovered certificates into your inventory. The **EST server** (RFC 7030) enables device and WiFi certificate enrollment via industry-standard Enrollment over Secure Transport. Interactive **approval workflows** let you require human sign-off on renewals before deployment. The background scheduler watches expiration dates and triggers renewals automatically — when certificate lifespans drop to 47 days, certctl handles the constant rotation without human involvement.
 
 **Core capabilities:**
 
@@ -76,7 +76,7 @@ certctl gives you a single pane of glass for every TLS certificate in your organ
 - **Revocation infrastructure** — RFC 5280 revocation with all standard reason codes, DER-encoded X.509 CRL per issuer, embedded OCSP responder, and short-lived certificate exemption (certs under 1 hour skip CRL/OCSP).
 - **Policy engine** — 5 rule types with violation tracking and severity levels. Certificate profiles enforce allowed key types, maximum TTL, and crypto constraints at enrollment time.
 - **Immutable audit trail** — every action recorded to an append-only log. Every API call recorded with method, path, actor, SHA-256 body hash, response status, and latency. No update or delete on audit records.
-- **Operational dashboard** — Full React GUI with certificate inventory, bulk operations (multi-select renew/revoke/reassign), deployment timeline visualization, inline policy editing, agent fleet overview, expiration heatmaps, and real-time short-lived credential tracking.
+- **Operational dashboard** — Full React GUI with certificate inventory, bulk operations (multi-select renew/revoke/reassign), deployment timeline visualization, inline policy editing, agent fleet overview, expiration heatmaps, real-time short-lived credential tracking, discovery triage workflow, network scan management, and interactive approval/rejection flow.
 - **Observability** — JSON and Prometheus metrics endpoints, 5 stats API endpoints for dashboards, structured slog logging with request ID propagation. Compatible with Prometheus, Grafana Agent, Datadog Agent, and Victoria Metrics.
 - **Notifications** — threshold-based alerting with deduplication. Routes to email, webhooks, Slack, Microsoft Teams, PagerDuty, and OpsGenie.
 - **EST enrollment (RFC 7030)** — built-in Enrollment over Secure Transport server for device certificate enrollment. Supports WiFi/802.1X, MDM, and IoT use cases. PKCS#7 certs-only wire format, accepts PEM or base64-encoded DER CSRs, configurable issuer and profile binding.
@@ -589,10 +589,11 @@ All nine development milestones (M1–M9) are complete. The backend covers the f
 - **M21: Network Cert Discovery** ✅ — server-side active TLS scanning of CIDR ranges and ports, concurrent probing (50 goroutines), CIDR expansion with /20 safety cap, sentinel agent pattern for discovery pipeline reuse, CRUD API for scan targets, scheduler integration (6h default)
 - **M22: Prometheus Metrics** ✅ — `GET /api/v1/metrics/prometheus` returns Prometheus exposition format (`text/plain; version=0.0.4`), 11 metrics with `certctl_` prefix, compatible with Prometheus, Grafana Agent, Datadog Agent, Victoria Metrics
 - **M23: EST Server (RFC 7030)** ✅ — Enrollment over Secure Transport for device/WiFi certificate enrollment, 4 endpoints under /.well-known/est/, PKCS#7 certs-only wire format, base64-encoded DER CSR input, configurable issuer + profile binding, audit trail, 28 new tests
+- **M24: Discovery, Network Scan & Approval GUI** ✅ — discovery triage page for claiming/dismissing discovered certificates, network scan target management (CRUD with schedule/interval config), interactive approval workflow (approve/reject buttons on Jobs page with reason modal), 13 new frontend tests
 - **Compliance Mapping** ✅ — SOC 2 Type II, PCI-DSS 4.0, NIST SP 800-57 capability mapping documentation
-- **M24: S/MIME Certificate Support** (Planned — v2.0.2) — wire profile EKU constraints through the issuance pipeline so certctl can issue S/MIME (emailProtection), code signing, and custom EKU certificates, not just TLS
+- **M25: S/MIME Certificate Support** (Planned — v2.0.2) — wire profile EKU constraints through the issuance pipeline so certctl can issue S/MIME (emailProtection), code signing, and custom EKU certificates, not just TLS
-- **M25: Traefik + Caddy Targets** (Planned — v2.1.x) — Traefik (file provider, auto-reload on filesystem change) and Caddy (Admin API, hot-reload) deployment target connectors
+- **M26: Traefik + Caddy Targets** (Planned — v2.1.x) — Traefik (file provider, auto-reload on filesystem change) and Caddy (Admin API, hot-reload) deployment target connectors
-- **M26: Certificate Export** (Planned — v2.1.x) — single-certificate download in PFX/PKCS12, DER, and PEM formats with optional chain inclusion, GUI download button on certificate detail page
+- **M27: Certificate Export** (Planned — v2.1.x) — single-certificate download in PFX/PKCS12, DER, and PEM formats with optional chain inclusion, GUI download button on certificate detail page
 
 ### V3: certctl Pro
 

docs/architecture.md

@@ -128,7 +128,7 @@ The agent runs two background loops: a heartbeat (every 60 seconds) to signal it
 
 The web dashboard is the primary operational interface for certctl. It is built with Vite + React + TypeScript and uses TanStack Query for server state management (caching, background refetching, optimistic updates).
 
-**Current views**: certificate inventory (list with multi-select bulk operations + "New Certificate" creation modal + detail with deployment status timeline, inline policy/profile editor, version history, deploy, revoke, archive, and trigger renewal actions), agent fleet (list + detail with system info + OS/architecture grouping with charts), job queue (status, retry, cancel, approve/reject), notification inbox (threshold alert grouping, mark-as-read), audit trail (time range, actor, action filters + CSV/JSON export), policy management (rules with enable/disable toggle + delete + violations), issuers (list with test connection + delete), targets (list with 3-step configuration wizard + delete), owners (list with team resolution + delete), teams (list with delete), agent groups (list with dynamic match criteria badges + enable/disable + delete), certificate profiles (list with crypto constraints), short-lived credentials dashboard (TTL countdown, profile filtering, auto-refresh), summary dashboard with charts (expiration heatmap, renewal success rate, status distribution, issuance rate), and login page.
+**Current views** (21 pages): certificate inventory (list with multi-select bulk operations + "New Certificate" creation modal + detail with deployment status timeline, inline policy/profile editor, version history, deploy, revoke, archive, and trigger renewal actions), agent fleet (list + detail with system info + OS/architecture grouping with charts), job queue (status, retry, cancel, approve/reject for AwaitingApproval jobs), notification inbox (threshold alert grouping, mark-as-read), audit trail (time range, actor, action filters + CSV/JSON export), policy management (rules with enable/disable toggle + delete + violations), issuers (list with test connection + delete), targets (list with 3-step configuration wizard + delete), owners (list with team resolution + delete), teams (list with delete), agent groups (list with dynamic match criteria badges + enable/disable + delete), certificate profiles (list with crypto constraints), short-lived credentials dashboard (TTL countdown, profile filtering, auto-refresh), discovered certificates triage (claim/dismiss unmanaged certs discovered by agents or network scans), network scan targets management (CRUD for network scan targets + Scan Now button), summary dashboard with charts (expiration heatmap, renewal success rate, status distribution, issuance rate), and login page.
 
 The dashboard includes an **ErrorBoundary component** for graceful error recovery — if a view crashes, the boundary catches the error and displays a user-friendly message instead of breaking the entire dashboard. It also includes a **demo mode** that activates when the API is unreachable — it renders realistic mock data for screenshots and offline presentations.
 

docs/demo-advanced.md

@@ -901,6 +901,8 @@ curl -s -X POST $API/api/v1/jobs/JOB_ID/reject \
 
 **Why interactive approval:** Not every certificate renewal should be automatic. PCI-scoped certificates, certs with specific compliance requirements, or certificates being migrated between issuers benefit from a human checkpoint. The AwaitingApproval state creates that checkpoint without blocking the entire job pipeline.
 
+**In the dashboard:** Click "Jobs" in the sidebar, filter by status "AwaitingApproval", and you'll see a list of renewal jobs waiting for approval. Each job shows the certificate, issuer, and requested validity period. Click a job to open its detail view and see the Approve / Reject buttons with a reason text field. After approval or rejection, the job status updates in real-time and the audit trail records the decision.
+
 ---
 
 ## Part 13: Advanced Query Features
@@ -1101,6 +1103,28 @@ curl -s -X POST "$API/api/v1/discovered-certificates/$DISCOVERED_ID/dismiss" \
 
 **How it works:** Filesystem discovery: the agent scans `CERTCTL_DISCOVERY_DIRS` on startup and every 6 hours, extracts metadata (common name, SANs, issuer, expiration, key type, fingerprint) from all PEM and DER files, and POSTs findings to `POST /api/v1/agents/{id}/discoveries`. Network discovery: the server expands CIDR ranges (capped at /20 = 4096 IPs), connects to each IP:port via TLS, extracts the peer certificate chain, and stores results using `server-scanner` as a sentinel agent ID. Both sources deduplicate by fingerprint and store results with a status: **Unmanaged** (discovered, not yet managed), **Managed** (linked to a control plane cert), or **Dismissed** (operator decided not to manage). This gives you a triage workflow: discover → review → claim or dismiss.
 
+### Discovery & Network Scans in the Dashboard
+
+**Discovered Certificates Page:** Click "Discovery" in the sidebar to see a triage workflow. The page lists all discovered certificates grouped by status (Unmanaged, Managed, Dismissed). For each Unmanaged certificate, you see:
+- Common name and SANs
+- Issuer and subject DN
+- Expiration date
+- Fingerprint (helps dedup)
+- Source (agent ID or `server-scanner` for network scans)
+- Action buttons: Claim (manage this cert), Dismiss (ignore it)
+
+Click "Claim" to bring an unmanaged certificate under certctl's control. Click "Dismiss" to remove it from the triage queue.
+
+**Network Scans Page:** Click "Network Scans" in the sidebar to manage network scan targets. The page shows all configured scan targets with:
+- Target name and description
+- CIDR ranges and ports scanned
+- Enabled/disabled toggle
+- Scan interval and connection timeout
+- Last scan timestamp and result summary
+- Action buttons: Edit, Delete, Scan Now (immediate)
+
+Click "Scan Now" to trigger an immediate TLS probe of the target's IP ranges. Results appear within seconds in the Discovered Certificates page as entries with `agent_id=server-scanner`.
+
 **In the dashboard**, click "Discovered Certificates" in the sidebar to see what agents and network scans found — claim unmanaged certs to bring them under certctl's management, or dismiss them.
 
 ---

docs/quickstart.md

@@ -89,7 +89,7 @@ The dashboard comes pre-loaded with 15 demo certificates across multiple teams,
 
 The main dashboard shows total certificates, how many are expiring soon, how many have expired, the renewal success rate, and four charts: an **expiration heatmap** (90-day weekly buckets), **renewal success rate trends** (30-day line chart), **certificate status distribution** (donut chart), and **issuance rate** (30-day bar chart).
 
-Explore the sidebar: Certificates, Agents, Policies, Jobs, Audit Trail, Notifications, Profiles, Teams, Owners, Agent Groups, Fleet Overview, Short-Lived Credentials, Discovery.
+Explore the sidebar: Certificates, Agents, Policies, Jobs, Audit Trail, Notifications, Profiles, Teams, Owners, Agent Groups, Fleet Overview, Short-Lived Credentials, Discovery, and Network Scans.
 
 ### Scenarios to walk through
 

docs/testing-guide.md

@@ -3366,26 +3366,61 @@ Open `http://localhost:8443` in a browser.
 | 19.4.5 | Inline policy editor | Click edit on policy section | Dropdown selectors appear, save/cancel buttons | PASS if edit mode works |
 | 19.4.6 | Revoke button | Click revoke | Reason modal, status updates after | PASS if revocation completes |
 
-### 19.5 Other Pages
+### 19.5 Jobs Page — Approval Workflow
-
-| Test ID | Test | Page | Expected | Pass/Fail Criteria |
-|---------|------|------|----------|-------------------|
-| 19.5.1 | Target wizard | Targets → New Target | 3-step wizard (type → config → review) | PASS if all 3 steps work |
-| 19.5.2 | Audit filters | Audit | Time, actor, action filters work | PASS if filters change results |
-| 19.5.3 | Audit export | Audit → Export | CSV/JSON file downloads | PASS if file downloads |
-| 19.5.4 | Short-lived creds | Short-Lived | Certs with TTL < 1h, countdown timers | PASS if timers count down |
-| 19.5.5 | Agent list | Agents | OS/Arch column visible | PASS if metadata shown |
-| 19.5.6 | Agent detail | Click agent | System Information card | PASS if OS, arch, IP shown |
-| 19.5.7 | Fleet overview | Fleet Overview | OS/arch grouping charts | PASS if pie charts render |
-
-### 19.6 Cross-Cutting
 
 | Test ID | Test | Action | Expected | Pass/Fail Criteria |
 |---------|------|--------|----------|-------------------|
-| 19.6.1 | Sidebar nav | Click all sidebar links | All pages load without errors | PASS if no broken routes |
+| 19.5.1 | Approval banner | Navigate to Jobs with AwaitingApproval jobs | Amber banner shows count of pending approvals | PASS if banner visible with correct count |
-| 19.6.2 | Logout | Click logout | Returns to login screen | PASS if login page shown |
+| 19.5.2 | Approve button | Find AwaitingApproval job, click Approve | Job status changes to Running/Completed | PASS if status transitions |
-| 19.6.3 | 401 redirect | Expire/remove auth token | Auto-redirect to login | PASS if login page shown |
+| 19.5.3 | Reject button | Find AwaitingApproval job, click Reject | Modal opens with reason input | PASS if modal appears |
-| 19.6.4 | Theme consistency | Check page styling | Light content area, teal sidebar, branded colors, readable text | PASS if theme consistent across all pages |
+| 19.5.4 | Reject with reason | Enter reason, submit rejection | Job status changes, modal closes | PASS if job rejected |
+| 19.5.5 | Status filter | Select "Awaiting Approval" from status dropdown | Only AwaitingApproval jobs shown | PASS if filter works |
+| 19.5.6 | AwaitingCSR filter | Select "Awaiting CSR" from status dropdown | Only AwaitingCSR jobs shown | PASS if filter works |
+
+### 19.6 Discovery Triage Page
+
+| Test ID | Test | Action | Expected | Pass/Fail Criteria |
+|---------|------|--------|----------|-------------------|
+| 19.6.1 | Summary stats | Navigate to Discovery | Stats bar shows Unmanaged/Managed/Dismissed counts | PASS if all 3 counts visible |
+| 19.6.2 | Table loads | View Discovery page | Table populated with discovered certificates | PASS if certs listed |
+| 19.6.3 | Status filter | Select "Unmanaged" from status dropdown | Only Unmanaged certs shown | PASS if filter works |
+| 19.6.4 | Agent filter | Select agent from dropdown | Certs filtered by agent | PASS if filter works |
+| 19.6.5 | Claim button | Click Claim on Unmanaged cert | Modal opens with managed cert ID input | PASS if modal appears |
+| 19.6.6 | Claim submit | Enter cert ID, submit claim | Cert status changes to Managed, modal closes | PASS if status updates |
+| 19.6.7 | Dismiss button | Click Dismiss on Unmanaged cert | Cert status changes to Dismissed | PASS if status updates |
+| 19.6.8 | Scan history | Click "Show Scan History" | Collapsible panel shows scan records with agent, directories, counts | PASS if scan history visible |
+
+### 19.7 Network Scan Management Page
+
+| Test ID | Test | Action | Expected | Pass/Fail Criteria |
+|---------|------|--------|----------|-------------------|
+| 19.7.1 | Table loads | Navigate to Network Scans | Table with seed scan targets | PASS if targets listed |
+| 19.7.2 | New Target button | Click "+ New Target" | Create modal opens | PASS if modal visible |
+| 19.7.3 | Create target | Fill name, CIDRs, ports, submit | New target appears in table | PASS if target created |
+| 19.7.4 | Enable toggle | Click toggle on a target | Enabled state flips | PASS if toggle works |
+| 19.7.5 | Scan Now | Click Scan Now on a target | Scan triggered (check last_scan_at updates) | PASS if scan initiated |
+| 19.7.6 | Delete target | Click Delete on a target | Target removed from table | PASS if target gone |
+
+### 19.8 Other Pages
+
+| Test ID | Test | Page | Expected | Pass/Fail Criteria |
+|---------|------|------|----------|-------------------|
+| 19.8.1 | Target wizard | Targets → New Target | 3-step wizard (type → config → review) | PASS if all 3 steps work |
+| 19.8.2 | Audit filters | Audit | Time, actor, action filters work | PASS if filters change results |
+| 19.8.3 | Audit export | Audit → Export | CSV/JSON file downloads | PASS if file downloads |
+| 19.8.4 | Short-lived creds | Short-Lived | Certs with TTL < 1h, countdown timers | PASS if timers count down |
+| 19.8.5 | Agent list | Agents | OS/Arch column visible | PASS if metadata shown |
+| 19.8.6 | Agent detail | Click agent | System Information card | PASS if OS, arch, IP shown |
+| 19.8.7 | Fleet overview | Fleet Overview | OS/arch grouping charts | PASS if pie charts render |
+
+### 19.9 Cross-Cutting
+
+| Test ID | Test | Action | Expected | Pass/Fail Criteria |
+|---------|------|--------|----------|-------------------|
+| 19.9.1 | Sidebar nav | Click all sidebar links | All 21 pages load without errors | PASS if no broken routes |
+| 19.9.2 | Logout | Click logout | Returns to login screen | PASS if login page shown |
+| 19.9.3 | 401 redirect | Expire/remove auth token | Auto-redirect to login | PASS if login page shown |
+| 19.9.4 | Theme consistency | Check page styling | Light content area, teal sidebar, branded colors, readable text | PASS if theme consistent across all pages |
 
 ---
 

web/src/api/client.test.ts

@@ -61,6 +61,18 @@ import {
   getJobTrends,
   getIssuanceRate,
   getMetrics,
+  getDiscoveredCertificates,
+  getDiscoveredCertificate,
+  claimDiscoveredCertificate,
+  dismissDiscoveredCertificate,
+  getDiscoveryScans,
+  getDiscoverySummary,
+  getNetworkScanTargets,
+  getNetworkScanTarget,
+  createNetworkScanTarget,
+  updateNetworkScanTarget,
+  deleteNetworkScanTarget,
+  triggerNetworkScan,
 } from './client';
 
 // Mock global fetch
@@ -686,4 +698,104 @@ describe('API Client', () => {
       expect(result.status).toBe('ok');
     });
   });
+
+  // ─── Discovery ────────────────────────────────────
+
+  describe('Discovery', () => {
+    it('getDiscoveredCertificates calls with params', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ data: [], total: 0, page: 1, per_page: 50 }));
+      await getDiscoveredCertificates({ status: 'Unmanaged' });
+      expect(mockFetch.mock.calls[0][0]).toContain('/api/v1/discovered-certificates');
+      expect(mockFetch.mock.calls[0][0]).toContain('status=Unmanaged');
+    });
+
+    it('getDiscoveredCertificate calls with id', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ id: 'dc-1', common_name: 'test.example.com' }));
+      const result = await getDiscoveredCertificate('dc-1');
+      expect(mockFetch.mock.calls[0][0]).toBe('/api/v1/discovered-certificates/dc-1');
+      expect(result.common_name).toBe('test.example.com');
+    });
+
+    it('claimDiscoveredCertificate sends POST with managed cert id', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ message: 'claimed' }));
+      await claimDiscoveredCertificate('dc-1', 'mc-api-prod');
+      const [url, init] = mockFetch.mock.calls[0];
+      expect(url).toBe('/api/v1/discovered-certificates/dc-1/claim');
+      expect(init.method).toBe('POST');
+      expect(JSON.parse(init.body)).toEqual({ managed_certificate_id: 'mc-api-prod' });
+    });
+
+    it('dismissDiscoveredCertificate sends POST', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ message: 'dismissed' }));
+      await dismissDiscoveredCertificate('dc-1');
+      const [url, init] = mockFetch.mock.calls[0];
+      expect(url).toBe('/api/v1/discovered-certificates/dc-1/dismiss');
+      expect(init.method).toBe('POST');
+    });
+
+    it('getDiscoveryScans calls endpoint', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ data: [], total: 0, page: 1, per_page: 50 }));
+      await getDiscoveryScans();
+      expect(mockFetch.mock.calls[0][0]).toContain('/api/v1/discovery-scans');
+    });
+
+    it('getDiscoverySummary calls endpoint', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ Unmanaged: 5, Managed: 3, Dismissed: 1 }));
+      const result = await getDiscoverySummary();
+      expect(mockFetch.mock.calls[0][0]).toBe('/api/v1/discovery-summary');
+      expect(result.Unmanaged).toBe(5);
+    });
+  });
+
+  // ─── Network Scan Targets ────────────────────────
+
+  describe('Network Scan Targets', () => {
+    it('getNetworkScanTargets calls endpoint', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ data: [], total: 0, page: 1, per_page: 50 }));
+      await getNetworkScanTargets();
+      expect(mockFetch.mock.calls[0][0]).toContain('/api/v1/network-scan-targets');
+    });
+
+    it('getNetworkScanTarget calls with id', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ id: 'nst-1', name: 'DMZ' }));
+      const result = await getNetworkScanTarget('nst-1');
+      expect(mockFetch.mock.calls[0][0]).toBe('/api/v1/network-scan-targets/nst-1');
+      expect(result.name).toBe('DMZ');
+    });
+
+    it('createNetworkScanTarget sends POST', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ id: 'nst-new', name: 'Production' }));
+      await createNetworkScanTarget({ name: 'Production', cidrs: ['10.0.0.0/24'], ports: [443] });
+      const [url, init] = mockFetch.mock.calls[0];
+      expect(url).toBe('/api/v1/network-scan-targets');
+      expect(init.method).toBe('POST');
+      const body = JSON.parse(init.body);
+      expect(body.name).toBe('Production');
+      expect(body.cidrs).toEqual(['10.0.0.0/24']);
+    });
+
+    it('updateNetworkScanTarget sends PUT', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ id: 'nst-1', enabled: false }));
+      await updateNetworkScanTarget('nst-1', { enabled: false });
+      const [url, init] = mockFetch.mock.calls[0];
+      expect(url).toBe('/api/v1/network-scan-targets/nst-1');
+      expect(init.method).toBe('PUT');
+    });
+
+    it('deleteNetworkScanTarget sends DELETE', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({}, 204));
+      await deleteNetworkScanTarget('nst-1');
+      const [url, init] = mockFetch.mock.calls[0];
+      expect(url).toBe('/api/v1/network-scan-targets/nst-1');
+      expect(init.method).toBe('DELETE');
+    });
+
+    it('triggerNetworkScan sends POST to scan endpoint', async () => {
+      mockFetch.mockReturnValueOnce(mockJsonResponse({ message: 'scan triggered' }));
+      await triggerNetworkScan('nst-1');
+      const [url, init] = mockFetch.mock.calls[0];
+      expect(url).toBe('/api/v1/network-scan-targets/nst-1/scan');
+      expect(init.method).toBe('POST');
+    });
+  });
 });

web/src/api/client.ts

@@ -1,4 +1,4 @@
-import type { Certificate, CertificateVersion, Agent, Job, Notification, AuditEvent, PolicyRule, PolicyViolation, Issuer, Target, CertificateProfile, Owner, Team, AgentGroup, PaginatedResponse, DashboardSummary, CertificateStatusCount, ExpirationBucket, JobTrendDataPoint, IssuanceRateDataPoint, MetricsResponse } from './types';
+import type { Certificate, CertificateVersion, Agent, Job, Notification, AuditEvent, PolicyRule, PolicyViolation, Issuer, Target, CertificateProfile, Owner, Team, AgentGroup, PaginatedResponse, DashboardSummary, CertificateStatusCount, ExpirationBucket, JobTrendDataPoint, IssuanceRateDataPoint, MetricsResponse, DiscoveredCertificate, DiscoveryScan, DiscoverySummary, NetworkScanTarget } from './types';
 
 const BASE = '/api/v1';
 
@@ -258,6 +258,53 @@ export const approveRenewal = (jobId: string) =>
 export const rejectRenewal = (jobId: string, reason: string) =>
   fetchJSON<{ message: string }>(`${BASE}/jobs/${jobId}/reject`, { method: 'POST', body: JSON.stringify({ reason }) });
 
+// Discovery
+export const getDiscoveredCertificates = (params: Record<string, string> = {}) => {
+  const qs = new URLSearchParams({ page: '1', per_page: '50', ...params }).toString();
+  return fetchJSON<PaginatedResponse<DiscoveredCertificate>>(`${BASE}/discovered-certificates?${qs}`);
+};
+
+export const getDiscoveredCertificate = (id: string) =>
+  fetchJSON<DiscoveredCertificate>(`${BASE}/discovered-certificates/${id}`);
+
+export const claimDiscoveredCertificate = (id: string, managedCertificateId: string) =>
+  fetchJSON<{ message: string }>(`${BASE}/discovered-certificates/${id}/claim`, {
+    method: 'POST',
+    body: JSON.stringify({ managed_certificate_id: managedCertificateId }),
+  });
+
+export const dismissDiscoveredCertificate = (id: string) =>
+  fetchJSON<{ message: string }>(`${BASE}/discovered-certificates/${id}/dismiss`, { method: 'POST' });
+
+export const getDiscoveryScans = (params: Record<string, string> = {}) => {
+  const qs = new URLSearchParams({ page: '1', per_page: '50', ...params }).toString();
+  return fetchJSON<PaginatedResponse<DiscoveryScan>>(`${BASE}/discovery-scans?${qs}`);
+};
+
+export const getDiscoverySummary = () =>
+  fetchJSON<DiscoverySummary>(`${BASE}/discovery-summary`);
+
+// Network Scan Targets
+export const getNetworkScanTargets = (params: Record<string, string> = {}) => {
+  const qs = new URLSearchParams({ page: '1', per_page: '50', ...params }).toString();
+  return fetchJSON<PaginatedResponse<NetworkScanTarget>>(`${BASE}/network-scan-targets?${qs}`);
+};
+
+export const getNetworkScanTarget = (id: string) =>
+  fetchJSON<NetworkScanTarget>(`${BASE}/network-scan-targets/${id}`);
+
+export const createNetworkScanTarget = (data: Partial<NetworkScanTarget>) =>
+  fetchJSON<NetworkScanTarget>(`${BASE}/network-scan-targets`, { method: 'POST', body: JSON.stringify(data) });
+
+export const updateNetworkScanTarget = (id: string, data: Partial<NetworkScanTarget>) =>
+  fetchJSON<NetworkScanTarget>(`${BASE}/network-scan-targets/${id}`, { method: 'PUT', body: JSON.stringify(data) });
+
+export const deleteNetworkScanTarget = (id: string) =>
+  fetchJSON<{ message: string }>(`${BASE}/network-scan-targets/${id}`, { method: 'DELETE' });
+
+export const triggerNetworkScan = (id: string) =>
+  fetchJSON<{ message: string }>(`${BASE}/network-scan-targets/${id}/scan`, { method: 'POST' });
+
 // Stats
 export const getDashboardSummary = () =>
   fetchJSON<DashboardSummary>(`${BASE}/stats/summary`);

web/src/api/types.ts

@@ -244,6 +244,67 @@ export interface IssuanceRateDataPoint {
   issued_count: number;
 }
 
+// Discovery types
+export interface DiscoveredCertificate {
+  id: string;
+  fingerprint_sha256: string;
+  common_name: string;
+  sans: string[];
+  serial_number: string;
+  issuer_dn: string;
+  subject_dn: string;
+  not_before?: string;
+  not_after?: string;
+  key_algorithm: string;
+  key_size: number;
+  is_ca: boolean;
+  source_path: string;
+  source_format: string;
+  agent_id: string;
+  discovery_scan_id?: string;
+  managed_certificate_id?: string;
+  status: string;
+  first_seen_at: string;
+  last_seen_at: string;
+  dismissed_at?: string;
+  created_at: string;
+  updated_at: string;
+}
+
+export interface DiscoveryScan {
+  id: string;
+  agent_id: string;
+  directories: string[];
+  certificates_found: number;
+  certificates_new: number;
+  errors_count: number;
+  scan_duration_ms: number;
+  started_at: string;
+  completed_at?: string;
+}
+
+export interface DiscoverySummary {
+  Unmanaged: number;
+  Managed: number;
+  Dismissed: number;
+}
+
+// Network scan types
+export interface NetworkScanTarget {
+  id: string;
+  name: string;
+  cidrs: string[];
+  ports: number[];
+  enabled: boolean;
+  scan_interval_hours: number;
+  timeout_ms: number;
+  last_scan_at?: string;
+  last_scan_duration_ms?: number;
+  last_scan_certs_found?: number;
+  created_at: string;
+  updated_at: string;
+}
+
 export interface MetricsResponse {
   gauge: {
     certificate_total: number;

web/src/components/Layout.tsx

@@ -16,6 +16,8 @@ const nav = [
   { to: '/owners',        label: 'Owners',        icon: 'M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z' },
   { to: '/teams',         label: 'Teams',         icon: 'M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z' },
   { to: '/agent-groups',  label: 'Agent Groups',  icon: 'M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10 M9 3v2m6-2v2' },
+  { to: '/discovery',     label: 'Discovery',       icon: 'M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z' },
+  { to: '/network-scans', label: 'Network Scans',  icon: 'M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z M9 12l2 2 4-4' },
   { to: '/short-lived',   label: 'Short-Lived',    icon: 'M13 10V3L4 14h7v7l9-11h-7z' },
   { to: '/audit',         label: 'Audit Trail',   icon: 'M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z' },
 ];
@@ -67,7 +69,7 @@ export default function Layout() {
         </nav>
 
         <div className="px-5 py-3 border-t border-white/10 flex items-center justify-between">
-          <span className="text-[10px] text-brand-300/60 font-mono">v2.0.3</span>
+          <span className="text-[10px] text-brand-300/60 font-mono">v2.0.4</span>
           {authRequired && (
             <button
               onClick={logout}

web/src/components/StatusBadge.tsx

@@ -19,6 +19,10 @@ const statusStyles: Record<string, string> = {
   Online:              'badge-success',
   Offline:             'badge-danger',
   Stale:               'badge-warning',
+  // Discovery statuses
+  Unmanaged:           'badge-warning',
+  Managed:             'badge-success',
+  Dismissed:           'badge-neutral',
   // Notification statuses
   sent:                'badge-success',
   pending:             'badge-warning',

web/src/main.tsx

@@ -23,6 +23,8 @@ import AgentGroupsPage from './pages/AgentGroupsPage';
 import AuditPage from './pages/AuditPage';
 import ShortLivedPage from './pages/ShortLivedPage';
 import AgentFleetPage from './pages/AgentFleetPage';
+import DiscoveryPage from './pages/DiscoveryPage';
+import NetworkScanPage from './pages/NetworkScanPage';
 import './index.css';
 
 const queryClient = new QueryClient({
@@ -61,6 +63,8 @@ createRoot(document.getElementById('root')!).render(
                   <Route path="agent-groups" element={<AgentGroupsPage />} />
                   <Route path="audit" element={<AuditPage />} />
                   <Route path="short-lived" element={<ShortLivedPage />} />
+                  <Route path="discovery" element={<DiscoveryPage />} />
+                  <Route path="network-scans" element={<NetworkScanPage />} />
                 </Route>
               </Routes>
             </BrowserRouter>

web/src/pages/DiscoveryPage.tsx

@@ -0,0 +1,317 @@
+import { useState } from 'react';
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
+import {
+  getDiscoveredCertificates,
+  getDiscoverySummary,
+  getDiscoveryScans,
+  claimDiscoveredCertificate,
+  dismissDiscoveredCertificate,
+  getAgents,
+} from '../api/client';
+import PageHeader from '../components/PageHeader';
+import DataTable from '../components/DataTable';
+import type { Column } from '../components/DataTable';
+import StatusBadge from '../components/StatusBadge';
+import ErrorState from '../components/ErrorState';
+import { formatDateTime } from '../api/utils';
+import type { DiscoveredCertificate, DiscoveryScan } from '../api/types';
+
+function ClaimModal({ cert, onClose, onClaim }: { cert: DiscoveredCertificate; onClose: () => void; onClaim: (managedCertId: string) => void }) {
+  const [managedCertId, setManagedCertId] = useState('');
+  return (
+    <div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50" onClick={onClose}>
+      <div className="bg-white rounded-lg shadow-xl w-full max-w-md mx-4" onClick={e => e.stopPropagation()}>
+        <div className="px-6 py-4 border-b border-surface-border">
+          <h3 className="text-lg font-semibold text-ink">Claim Certificate</h3>
+          <p className="text-sm text-ink-muted mt-1">
+            Link <span className="font-mono text-xs">{cert.common_name}</span> to a managed certificate
+          </p>
+        </div>
+        <div className="px-6 py-4">
+          <label className="block text-sm font-medium text-ink mb-1">Managed Certificate ID</label>
+          <input
+            type="text"
+            value={managedCertId}
+            onChange={e => setManagedCertId(e.target.value)}
+            placeholder="e.g., mc-api-prod"
+            className="w-full border border-surface-border rounded px-3 py-2 text-sm text-ink bg-white font-mono focus:outline-none focus:ring-2 focus:ring-brand-500"
+          />
+          <p className="text-xs text-ink-faint mt-2">Enter the ID of the managed certificate this discovered cert belongs to.</p>
+        </div>
+        <div className="px-6 py-3 border-t border-surface-border flex justify-end gap-2">
+          <button onClick={onClose} className="px-4 py-2 text-sm text-ink-muted hover:text-ink rounded border border-surface-border">
+            Cancel
+          </button>
+          <button
+            onClick={() => onClaim(managedCertId)}
+            disabled={!managedCertId.trim()}
+            className="px-4 py-2 text-sm text-white bg-brand-600 hover:bg-brand-700 rounded disabled:opacity-50 disabled:cursor-not-allowed"
+          >
+            Claim
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function ScanHistoryPanel({ scans }: { scans: DiscoveryScan[] }) {
+  if (scans.length === 0) return <p className="text-sm text-ink-muted py-4 text-center">No scans recorded yet</p>;
+  return (
+    <div className="overflow-x-auto">
+      <table className="w-full text-sm">
+        <thead>
+          <tr className="text-left text-xs text-ink-faint border-b border-surface-border">
+            <th className="px-4 py-2">Agent</th>
+            <th className="px-4 py-2">Directories</th>
+            <th className="px-4 py-2">Found</th>
+            <th className="px-4 py-2">New</th>
+            <th className="px-4 py-2">Errors</th>
+            <th className="px-4 py-2">Duration</th>
+            <th className="px-4 py-2">Started</th>
+          </tr>
+        </thead>
+        <tbody>
+          {scans.map(s => (
+            <tr key={s.id} className="border-b border-surface-border/50 hover:bg-surface-hover">
+              <td className="px-4 py-2 font-mono text-xs">{s.agent_id}</td>
+              <td className="px-4 py-2 text-xs text-ink-muted">{s.directories?.join(', ') || '—'}</td>
+              <td className="px-4 py-2">{s.certificates_found}</td>
+              <td className="px-4 py-2 text-green-600">{s.certificates_new}</td>
+              <td className="px-4 py-2">{s.errors_count > 0 ? <span className="text-red-500">{s.errors_count}</span> : '0'}</td>
+              <td className="px-4 py-2 text-ink-muted">{s.scan_duration_ms}ms</td>
+              <td className="px-4 py-2 text-xs text-ink-muted">{formatDateTime(s.started_at)}</td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  );
+}
+
+export default function DiscoveryPage() {
+  const [statusFilter, setStatusFilter] = useState('');
+  const [agentFilter, setAgentFilter] = useState('');
+  const [claimingCert, setClaimingCert] = useState<DiscoveredCertificate | null>(null);
+  const [showScans, setShowScans] = useState(false);
+  const queryClient = useQueryClient();
+
+  const params: Record<string, string> = {};
+  if (statusFilter) params.status = statusFilter;
+  if (agentFilter) params.agent_id = agentFilter;
+
+  const { data, isLoading, error, refetch } = useQuery({
+    queryKey: ['discovered-certificates', params],
+    queryFn: () => getDiscoveredCertificates(params),
+    refetchInterval: 30000,
+  });
+
+  const { data: summary } = useQuery({
+    queryKey: ['discovery-summary'],
+    queryFn: getDiscoverySummary,
+    refetchInterval: 30000,
+  });
+
+  const { data: scansData } = useQuery({
+    queryKey: ['discovery-scans'],
+    queryFn: () => getDiscoveryScans(),
+    enabled: showScans,
+  });
+
+  const { data: agentsData } = useQuery({
+    queryKey: ['agents-for-filter'],
+    queryFn: () => getAgents({ per_page: '200' }),
+  });
+
+  const claimMutation = useMutation({
+    mutationFn: ({ id, managedCertId }: { id: string; managedCertId: string }) =>
+      claimDiscoveredCertificate(id, managedCertId),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['discovered-certificates'] });
+      queryClient.invalidateQueries({ queryKey: ['discovery-summary'] });
+      setClaimingCert(null);
+    },
+  });
+
+  const dismissMutation = useMutation({
+    mutationFn: dismissDiscoveredCertificate,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['discovered-certificates'] });
+      queryClient.invalidateQueries({ queryKey: ['discovery-summary'] });
+    },
+  });
+
+  const formatExpiry = (notAfter?: string) => {
+    if (!notAfter) return '—';
+    const d = new Date(notAfter);
+    const now = new Date();
+    const days = Math.floor((d.getTime() - now.getTime()) / (1000 * 60 * 60 * 24));
+    if (days < 0) return <span className="text-red-500">Expired {Math.abs(days)}d ago</span>;
+    if (days < 30) return <span className="text-amber-500">{days}d left</span>;
+    return <span className="text-ink-muted">{days}d left</span>;
+  };
+
+  const discoveryStatusStyle: Record<string, string> = {
+    Unmanaged: 'badge badge-warning',
+    Managed: 'badge badge-success',
+    Dismissed: 'badge badge-neutral',
+  };
+
+  const columns: Column<DiscoveredCertificate>[] = [
+    {
+      key: 'common_name',
+      label: 'Common Name',
+      render: (c) => (
+        <div>
+          <div className="font-medium text-sm text-ink">{c.common_name || '(no CN)'}</div>
+          {c.sans?.length > 0 && (
+            <div className="text-xs text-ink-faint truncate max-w-[200px]" title={c.sans.join(', ')}>
+              {c.sans.slice(0, 2).join(', ')}{c.sans.length > 2 ? ` +${c.sans.length - 2}` : ''}
+            </div>
+          )}
+        </div>
+      ),
+    },
+    {
+      key: 'status',
+      label: 'Status',
+      render: (c) => <span className={discoveryStatusStyle[c.status] || 'badge badge-neutral'}>{c.status}</span>,
+    },
+    {
+      key: 'source',
+      label: 'Source',
+      render: (c) => (
+        <div>
+          <div className="font-mono text-xs text-ink-muted">{c.agent_id}</div>
+          <div className="text-xs text-ink-faint truncate max-w-[180px]" title={c.source_path}>{c.source_path}</div>
+        </div>
+      ),
+    },
+    {
+      key: 'issuer',
+      label: 'Issuer',
+      render: (c) => <span className="text-xs text-ink-muted truncate max-w-[150px]" title={c.issuer_dn}>{c.issuer_dn?.split(',')[0] || '—'}</span>,
+    },
+    {
+      key: 'expiry',
+      label: 'Expiry',
+      render: (c) => <span className="text-xs">{formatExpiry(c.not_after)}</span>,
+    },
+    {
+      key: 'fingerprint',
+      label: 'Fingerprint',
+      render: (c) => <span className="font-mono text-[10px] text-ink-faint">{c.fingerprint_sha256?.substring(0, 16)}...</span>,
+    },
+    {
+      key: 'actions',
+      label: '',
+      render: (c) => (
+        c.status === 'Unmanaged' ? (
+          <div className="flex gap-2">
+            <button
+              onClick={(e) => { e.stopPropagation(); setClaimingCert(c); }}
+              className="text-xs text-brand-600 hover:text-brand-700 font-medium"
+            >
+              Claim
+            </button>
+            <button
+              onClick={(e) => { e.stopPropagation(); dismissMutation.mutate(c.id); }}
+              disabled={dismissMutation.isPending}
+              className="text-xs text-ink-faint hover:text-ink-muted"
+            >
+              Dismiss
+            </button>
+          </div>
+        ) : null
+      ),
+    },
+  ];
+
+  return (
+    <>
+      <PageHeader title="Certificate Discovery" subtitle={data ? `${data.total} discovered certificates` : undefined} />
+
+      {/* Summary stats bar */}
+      {summary && (
+        <div className="px-6 py-3 flex gap-4 border-b border-surface-border/50">
+          <div className="flex items-center gap-2">
+            <span className="w-2.5 h-2.5 rounded-full bg-amber-400"></span>
+            <span className="text-sm text-ink"><strong>{summary.Unmanaged || 0}</strong> Unmanaged</span>
+          </div>
+          <div className="flex items-center gap-2">
+            <span className="w-2.5 h-2.5 rounded-full bg-green-400"></span>
+            <span className="text-sm text-ink"><strong>{summary.Managed || 0}</strong> Managed</span>
+          </div>
+          <div className="flex items-center gap-2">
+            <span className="w-2.5 h-2.5 rounded-full bg-gray-400"></span>
+            <span className="text-sm text-ink"><strong>{summary.Dismissed || 0}</strong> Dismissed</span>
+          </div>
+          <div className="ml-auto">
+            <button
+              onClick={() => setShowScans(!showScans)}
+              className="text-xs text-brand-600 hover:text-brand-700 font-medium"
+            >
+              {showScans ? 'Hide' : 'Show'} Scan History
+            </button>
+          </div>
+        </div>
+      )}
+
+      {/* Scan history collapsible */}
+      {showScans && (
+        <div className="border-b border-surface-border/50 bg-surface-subtle">
+          <div className="px-6 py-2">
+            <h3 className="text-sm font-semibold text-ink mb-2">Recent Scans</h3>
+            <ScanHistoryPanel scans={scansData?.data || []} />
+          </div>
+        </div>
+      )}
+
+      {/* Filters */}
+      <div className="px-6 py-3 flex gap-3 border-b border-surface-border/50">
+        <select
+          value={statusFilter}
+          onChange={e => setStatusFilter(e.target.value)}
+          className="bg-white border border-surface-border rounded px-3 py-1.5 text-sm text-ink"
+        >
+          <option value="">All statuses</option>
+          <option value="Unmanaged">Unmanaged</option>
+          <option value="Managed">Managed</option>
+          <option value="Dismissed">Dismissed</option>
+        </select>
+        <select
+          value={agentFilter}
+          onChange={e => setAgentFilter(e.target.value)}
+          className="bg-white border border-surface-border rounded px-3 py-1.5 text-sm text-ink"
+        >
+          <option value="">All agents</option>
+          {agentsData?.data?.map(a => (
+            <option key={a.id} value={a.id}>{a.name || a.id}</option>
+          ))}
+        </select>
+      </div>
+
+      {/* Table */}
+      <div className="flex-1 overflow-y-auto">
+        {error ? (
+          <ErrorState error={error as Error} onRetry={() => refetch()} />
+        ) : (
+          <DataTable
+            columns={columns}
+            data={data?.data || []}
+            isLoading={isLoading}
+            emptyMessage="No discovered certificates. Agents will report findings once discovery scanning is configured."
+          />
+        )}
+      </div>
+
+      {claimingCert && (
+        <ClaimModal
+          cert={claimingCert}
+          onClose={() => setClaimingCert(null)}
+          onClaim={(managedCertId) => claimMutation.mutate({ id: claimingCert.id, managedCertId })}
+        />
+      )}
+    </>
+  );
+}

web/src/pages/JobsPage.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
-import { getJobs, cancelJob } from '../api/client';
+import { getJobs, cancelJob, approveRenewal, rejectRenewal } from '../api/client';
 import PageHeader from '../components/PageHeader';
 import DataTable from '../components/DataTable';
 import type { Column } from '../components/DataTable';
@@ -9,9 +9,48 @@ import ErrorState from '../components/ErrorState';
 import { formatDateTime } from '../api/utils';
 import type { Job } from '../api/types';
 
+function RejectModal({ job, onClose, onReject }: { job: Job; onClose: () => void; onReject: (reason: string) => void }) {
+  const [reason, setReason] = useState('');
+  return (
+    <div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50" onClick={onClose}>
+      <div className="bg-white rounded-lg shadow-xl w-full max-w-md mx-4" onClick={e => e.stopPropagation()}>
+        <div className="px-6 py-4 border-b border-surface-border">
+          <h3 className="text-lg font-semibold text-ink">Reject Job</h3>
+          <p className="text-sm text-ink-muted mt-1">
+            Rejecting job <span className="font-mono text-xs">{job.id}</span> for certificate <span className="font-mono text-xs">{job.certificate_id}</span>
+          </p>
+        </div>
+        <div className="px-6 py-4">
+          <label className="block text-sm font-medium text-ink mb-1">Reason</label>
+          <textarea
+            value={reason}
+            onChange={e => setReason(e.target.value)}
+            placeholder="Why is this renewal being rejected?"
+            className="w-full border border-surface-border rounded px-3 py-2 text-sm text-ink bg-white focus:outline-none focus:ring-2 focus:ring-brand-500"
+            rows={3}
+          />
+        </div>
+        <div className="px-6 py-3 border-t border-surface-border flex justify-end gap-2">
+          <button onClick={onClose} className="px-4 py-2 text-sm text-ink-muted hover:text-ink rounded border border-surface-border">
+            Cancel
+          </button>
+          <button
+            onClick={() => onReject(reason)}
+            disabled={!reason.trim()}
+            className="px-4 py-2 text-sm text-white bg-red-600 hover:bg-red-700 rounded disabled:opacity-50 disabled:cursor-not-allowed"
+          >
+            Reject
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}
+
 export default function JobsPage() {
   const [statusFilter, setStatusFilter] = useState('');
   const [typeFilter, setTypeFilter] = useState('');
+  const [rejectingJob, setRejectingJob] = useState<Job | null>(null);
   const queryClient = useQueryClient();
 
   const params: Record<string, string> = {};
@@ -29,6 +68,21 @@ export default function JobsPage() {
     onSuccess: () => queryClient.invalidateQueries({ queryKey: ['jobs'] }),
   });
 
+  const approveMutation = useMutation({
+    mutationFn: approveRenewal,
+    onSuccess: () => queryClient.invalidateQueries({ queryKey: ['jobs'] }),
+  });
+
+  const rejectMutation = useMutation({
+    mutationFn: ({ id, reason }: { id: string; reason: string }) => rejectRenewal(id, reason),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['jobs'] });
+      setRejectingJob(null);
+    },
+  });
+
+  const awaitingCount = data?.data?.filter(j => j.status === 'AwaitingApproval').length || 0;
+
   const columns: Column<Job>[] = [
     {
       key: 'id',
@@ -53,14 +107,33 @@ export default function JobsPage() {
       key: 'actions',
       label: '',
       render: (j) => (
-        j.status === 'Pending' || j.status === 'Running' ? (
+        <div className="flex gap-2">
-          <button
+          {j.status === 'AwaitingApproval' && (
-            onClick={(e) => { e.stopPropagation(); cancelMutation.mutate(j.id); }}
+            <>
-            className="text-xs text-red-400 hover:text-red-300"
+              <button
-          >
+                onClick={(e) => { e.stopPropagation(); approveMutation.mutate(j.id); }}
-            Cancel
+                disabled={approveMutation.isPending}
-          </button>
+                className="text-xs text-green-600 hover:text-green-700 font-medium"
-        ) : null
+              >
+                Approve
+              </button>
+              <button
+                onClick={(e) => { e.stopPropagation(); setRejectingJob(j); }}
+                className="text-xs text-red-500 hover:text-red-600 font-medium"
+              >
+                Reject
+              </button>
+            </>
+          )}
+          {(j.status === 'Pending' || j.status === 'Running') && (
+            <button
+              onClick={(e) => { e.stopPropagation(); cancelMutation.mutate(j.id); }}
+              className="text-xs text-red-400 hover:text-red-300"
+            >
+              Cancel
+            </button>
+          )}
+        </div>
       ),
     },
   ];
@@ -68,6 +141,27 @@ export default function JobsPage() {
   return (
     <>
       <PageHeader title="Jobs" subtitle={data ? `${data.total} jobs` : undefined} />
+
+      {/* Pending approval banner */}
+      {awaitingCount > 0 && (
+        <div className="mx-6 mt-3 px-4 py-2.5 bg-amber-50 border border-amber-200 rounded-lg flex items-center gap-2">
+          <svg className="w-4 h-4 text-amber-500 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
+            <path strokeLinecap="round" strokeLinejoin="round" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z" />
+          </svg>
+          <span className="text-sm text-amber-800">
+            <strong>{awaitingCount}</strong> job{awaitingCount !== 1 ? 's' : ''} awaiting approval
+          </span>
+          {statusFilter !== 'AwaitingApproval' && (
+            <button
+              onClick={() => setStatusFilter('AwaitingApproval')}
+              className="text-xs text-amber-700 hover:text-amber-900 underline ml-1"
+            >
+              Show only
+            </button>
+          )}
+        </div>
+      )}
+
       <div className="px-6 py-3 flex gap-3 border-b border-surface-border/50">
         <select
           value={statusFilter}
@@ -76,6 +170,8 @@ export default function JobsPage() {
         >
           <option value="">All statuses</option>
           <option value="Pending">Pending</option>
+          <option value="AwaitingApproval">Awaiting Approval</option>
+          <option value="AwaitingCSR">Awaiting CSR</option>
           <option value="Running">Running</option>
           <option value="Completed">Completed</option>
           <option value="Failed">Failed</option>
@@ -100,6 +196,14 @@ export default function JobsPage() {
           <DataTable columns={columns} data={data?.data || []} isLoading={isLoading} emptyMessage="No jobs found" />
         )}
       </div>
+
+      {rejectingJob && (
+        <RejectModal
+          job={rejectingJob}
+          onClose={() => setRejectingJob(null)}
+          onReject={(reason) => rejectMutation.mutate({ id: rejectingJob.id, reason })}
+        />
+      )}
     </>
   );
 }

web/src/pages/NetworkScanPage.tsx

@@ -0,0 +1,268 @@
+import { useState } from 'react';
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
+import {
+  getNetworkScanTargets,
+  createNetworkScanTarget,
+  updateNetworkScanTarget,
+  deleteNetworkScanTarget,
+  triggerNetworkScan,
+} from '../api/client';
+import PageHeader from '../components/PageHeader';
+import DataTable from '../components/DataTable';
+import type { Column } from '../components/DataTable';
+import ErrorState from '../components/ErrorState';
+import { formatDateTime } from '../api/utils';
+import type { NetworkScanTarget } from '../api/types';
+
+function CreateScanTargetModal({ onClose, onCreate }: {
+  onClose: () => void;
+  onCreate: (data: Partial<NetworkScanTarget>) => void;
+}) {
+  const [name, setName] = useState('');
+  const [cidrs, setCidrs] = useState('');
+  const [ports, setPorts] = useState('443');
+  const [interval, setInterval] = useState('6');
+  const [timeout, setTimeout] = useState('5000');
+
+  const handleSubmit = () => {
+    const cidrList = cidrs.split('\n').map(s => s.trim()).filter(Boolean);
+    const portList = ports.split(',').map(s => parseInt(s.trim(), 10)).filter(n => !isNaN(n));
+    onCreate({
+      name,
+      cidrs: cidrList,
+      ports: portList,
+      scan_interval_hours: parseInt(interval, 10),
+      timeout_ms: parseInt(timeout, 10),
+      enabled: true,
+    });
+  };
+
+  return (
+    <div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50" onClick={onClose}>
+      <div className="bg-white rounded-lg shadow-xl w-full max-w-lg mx-4" onClick={e => e.stopPropagation()}>
+        <div className="px-6 py-4 border-b border-surface-border">
+          <h3 className="text-lg font-semibold text-ink">New Scan Target</h3>
+          <p className="text-sm text-ink-muted mt-1">Define a network range to scan for TLS certificates</p>
+        </div>
+        <div className="px-6 py-4 space-y-4">
+          <div>
+            <label className="block text-sm font-medium text-ink mb-1">Name</label>
+            <input
+              type="text"
+              value={name}
+              onChange={e => setName(e.target.value)}
+              placeholder="e.g., Production DMZ"
+              className="w-full border border-surface-border rounded px-3 py-2 text-sm text-ink bg-white focus:outline-none focus:ring-2 focus:ring-brand-500"
+            />
+          </div>
+          <div>
+            <label className="block text-sm font-medium text-ink mb-1">CIDR Ranges (one per line)</label>
+            <textarea
+              value={cidrs}
+              onChange={e => setCidrs(e.target.value)}
+              placeholder={"10.0.1.0/24\n10.0.2.0/24\n192.168.1.100/32"}
+              className="w-full border border-surface-border rounded px-3 py-2 text-sm text-ink bg-white font-mono focus:outline-none focus:ring-2 focus:ring-brand-500"
+              rows={3}
+            />
+            <p className="text-xs text-ink-faint mt-1">Maximum /20 per CIDR (4096 IPs)</p>
+          </div>
+          <div className="grid grid-cols-3 gap-3">
+            <div>
+              <label className="block text-sm font-medium text-ink mb-1">Ports</label>
+              <input
+                type="text"
+                value={ports}
+                onChange={e => setPorts(e.target.value)}
+                placeholder="443,8443"
+                className="w-full border border-surface-border rounded px-3 py-2 text-sm text-ink bg-white font-mono focus:outline-none focus:ring-2 focus:ring-brand-500"
+              />
+            </div>
+            <div>
+              <label className="block text-sm font-medium text-ink mb-1">Interval (hrs)</label>
+              <input
+                type="number"
+                value={interval}
+                onChange={e => setInterval(e.target.value)}
+                min="1"
+                className="w-full border border-surface-border rounded px-3 py-2 text-sm text-ink bg-white focus:outline-none focus:ring-2 focus:ring-brand-500"
+              />
+            </div>
+            <div>
+              <label className="block text-sm font-medium text-ink mb-1">Timeout (ms)</label>
+              <input
+                type="number"
+                value={timeout}
+                onChange={e => setTimeout(e.target.value)}
+                min="1000"
+                step="1000"
+                className="w-full border border-surface-border rounded px-3 py-2 text-sm text-ink bg-white focus:outline-none focus:ring-2 focus:ring-brand-500"
+              />
+            </div>
+          </div>
+        </div>
+        <div className="px-6 py-3 border-t border-surface-border flex justify-end gap-2">
+          <button onClick={onClose} className="px-4 py-2 text-sm text-ink-muted hover:text-ink rounded border border-surface-border">
+            Cancel
+          </button>
+          <button
+            onClick={handleSubmit}
+            disabled={!name.trim() || !cidrs.trim()}
+            className="px-4 py-2 text-sm text-white bg-brand-600 hover:bg-brand-700 rounded disabled:opacity-50 disabled:cursor-not-allowed"
+          >
+            Create
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default function NetworkScanPage() {
+  const [showCreate, setShowCreate] = useState(false);
+  const queryClient = useQueryClient();
+
+  const { data, isLoading, error, refetch } = useQuery({
+    queryKey: ['network-scan-targets'],
+    queryFn: () => getNetworkScanTargets(),
+    refetchInterval: 30000,
+  });
+
+  const createMutation = useMutation({
+    mutationFn: createNetworkScanTarget,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['network-scan-targets'] });
+      setShowCreate(false);
+    },
+  });
+
+  const deleteMutation = useMutation({
+    mutationFn: deleteNetworkScanTarget,
+    onSuccess: () => queryClient.invalidateQueries({ queryKey: ['network-scan-targets'] }),
+  });
+
+  const toggleMutation = useMutation({
+    mutationFn: ({ id, enabled }: { id: string; enabled: boolean }) =>
+      updateNetworkScanTarget(id, { enabled }),
+    onSuccess: () => queryClient.invalidateQueries({ queryKey: ['network-scan-targets'] }),
+  });
+
+  const scanMutation = useMutation({
+    mutationFn: triggerNetworkScan,
+    onSuccess: () => queryClient.invalidateQueries({ queryKey: ['network-scan-targets'] }),
+  });
+
+  const columns: Column<NetworkScanTarget>[] = [
+    {
+      key: 'name',
+      label: 'Name',
+      render: (t) => (
+        <div>
+          <div className="font-medium text-sm text-ink">{t.name}</div>
+          <div className="font-mono text-xs text-ink-faint">{t.id}</div>
+        </div>
+      ),
+    },
+    {
+      key: 'cidrs',
+      label: 'CIDRs',
+      render: (t) => (
+        <div className="font-mono text-xs text-ink-muted">
+          {t.cidrs?.slice(0, 2).join(', ')}{(t.cidrs?.length || 0) > 2 ? ` +${t.cidrs.length - 2}` : ''}
+        </div>
+      ),
+    },
+    {
+      key: 'ports',
+      label: 'Ports',
+      render: (t) => <span className="font-mono text-xs text-ink-muted">{t.ports?.join(', ')}</span>,
+    },
+    {
+      key: 'interval',
+      label: 'Interval',
+      render: (t) => <span className="text-sm text-ink-muted">{t.scan_interval_hours}h</span>,
+    },
+    {
+      key: 'last_scan',
+      label: 'Last Scan',
+      render: (t) => (
+        <div>
+          <div className="text-xs text-ink-muted">{t.last_scan_at ? formatDateTime(t.last_scan_at) : 'Never'}</div>
+          {t.last_scan_certs_found != null && (
+            <div className="text-xs text-ink-faint">{t.last_scan_certs_found} certs found</div>
+          )}
+        </div>
+      ),
+    },
+    {
+      key: 'enabled',
+      label: 'Enabled',
+      render: (t) => (
+        <button
+          onClick={(e) => { e.stopPropagation(); toggleMutation.mutate({ id: t.id, enabled: !t.enabled }); }}
+          className={`relative w-9 h-5 rounded-full transition-colors ${t.enabled ? 'bg-brand-500' : 'bg-gray-300'}`}
+        >
+          <span className={`absolute top-0.5 left-0.5 w-4 h-4 bg-white rounded-full shadow transition-transform ${t.enabled ? 'translate-x-4' : ''}`} />
+        </button>
+      ),
+    },
+    {
+      key: 'actions',
+      label: '',
+      render: (t) => (
+        <div className="flex gap-2">
+          <button
+            onClick={(e) => { e.stopPropagation(); scanMutation.mutate(t.id); }}
+            disabled={scanMutation.isPending}
+            className="text-xs text-brand-600 hover:text-brand-700 font-medium"
+          >
+            Scan Now
+          </button>
+          <button
+            onClick={(e) => { e.stopPropagation(); deleteMutation.mutate(t.id); }}
+            disabled={deleteMutation.isPending}
+            className="text-xs text-red-400 hover:text-red-500"
+          >
+            Delete
+          </button>
+        </div>
+      ),
+    },
+  ];
+
+  return (
+    <>
+      <PageHeader
+        title="Network Scanning"
+        subtitle={data ? `${data.total} scan targets` : undefined}
+        action={
+          <button
+            onClick={() => setShowCreate(true)}
+            className="px-4 py-2 text-sm text-white bg-brand-600 hover:bg-brand-700 rounded-lg shadow-sm"
+          >
+            + New Target
+          </button>
+        }
+      />
+
+      <div className="flex-1 overflow-y-auto">
+        {error ? (
+          <ErrorState error={error as Error} onRetry={() => refetch()} />
+        ) : (
+          <DataTable
+            columns={columns}
+            data={data?.data || []}
+            isLoading={isLoading}
+            emptyMessage="No scan targets configured. Create one to start discovering certificates on your network."
+          />
+        )}
+      </div>
+
+      {showCreate && (
+        <CreateScanTargetModal
+          onClose={() => setShowCreate(false)}
+          onCreate={(d) => createMutation.mutate(d)}
+        />
+      )}
+    </>
+  );
+}