Skip to content

ui: port scanners panel to new design#6

Open
Moriz82 wants to merge 1 commit into
mainfrom
worktree-agent-aafc58fe
Open

ui: port scanners panel to new design#6
Moriz82 wants to merge 1 commit into
mainfrom
worktree-agent-aafc58fe

Conversation

@Moriz82

@Moriz82 Moriz82 commented Apr 20, 2026

Copy link
Copy Markdown
Owner

Summary

  • Rewrites frontend/src/panels/ScannersPanel.tsx to match the new-UI ScannersScreen design: header with " plugins · enabled" sub, Check-updates / Update-all toolbar, filter pills + search, and a repeat(auto-fill, minmax(280px, 1fr)) grid of scanner cards with glyph, name, <type> · v<version>, status pill, description, and Configure/Run (or Install/Update) buttons.
  • Adds frontend/src/styles/screens.css with new-UI design tokens (--bg-*, --fg-*, --silk, --sp-*, --line-*, etc.) scoped under .screen so legacy panels keep their existing look, plus .insp-glyph, .status-pill, .scanners-grid, modal, and filter selectors.
  • Wires to real backend: /api/plugins, /api/plugins/check-updates, /api/plugins/update-all, /api/templates, /api/ingestors, /api/scanners/{id}/run (SSE progress), /api/scanners/{id}/stop, plus per-plugin install/update/uninstall.
  • Preserves every feature from the previous panel: category filter, search, streaming scan progress, templates download (all/selected), fingerprint/CVE data flows (via existing backend endpoints), uninstall, and the ingestor/hints metadata, now surfaced inside the Configure modal.

Test plan

  • npx tsc --noEmit — no new errors in ScannersPanel.tsx
  • npm run build — passes (dist/ emitted)
  • Playwright MCP: login → Scanners tab → 8 cards render from real /api/plugins, Configure opens modal with templates + source + binary path, Run opens target-input modal; no console errors.

🤖 Generated with Claude Code

Replaces the legacy Plugin Store / Vulnerability scanners / Run Scanner
cards on the Scanners tab with the new-UI design: a grid of scanner
cards (auto-fill 280px) with glyph, name, type·version, status pill,
description, and Configure / Run (or Install / Update) actions. Header
shows "<n> plugins · <m> enabled" and a "Check updates" / "Update all"
toolbar. Configure and Run open modals that preserve templates,
source/binary metadata, target input, streaming progress, and the
uninstall action — no mock data, all wired to /api/plugins,
/api/plugins/check-updates, /api/plugins/update-all, /api/templates,
and /api/scanners/{id}/run.

Adds frontend/src/styles/screens.css with the new-UI tokens scoped
under .screen so the rest of the app keeps its existing chrome until
other panels are ported.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant