feat: implement Component Audit UI with completeness scoring and inline editing #5

New Issue

forbes · 2026-02-06T18:21:10Z

forbes commented

2026-02-06 18:21:10 +00:00

Summary

Implement the Component Audit tool as designed in docs/COMPONENT_AUDIT.md. The API scoring logic already exists in internal/api/audit_handlers.go — this issue covers building the web UI and completing any remaining backend work.

Background

The parts database has grown organically. Many items have only a part number, description, and category. The property schema defines dozens of fields per category but most items have few populated. There is no way to see which items are missing data or to prioritize what needs filling in.

Design Reference

Full design specification: docs/COMPONENT_AUDIT.md

What Already Exists

Backend (`internal/api/audit_handlers.go`)

HandleAuditCompleteness() — query items, compute scores against schema, return paginated JSON
HandleAuditItemDetail() — single item with field-by-field breakdown
Weighted scoring for purchased vs manufactured parts
BOM existence checking for manufactured parts
Assembly computed fields (cost rollup, weight rollup, component count)
Tier classification: critical (0-25%), low (25-50%), partial (50-75%), good (75-99%), complete (100%)
Routes registered: GET /api/audit/completeness, GET /api/audit/completeness/{partNumber}

What Needs Building

Phase 1: Audit Page UI

New template: internal/api/templates/audit.html

Same base template, Catppuccin Mocha theme
Add "Audit" tab to navigation bar (4th tab after Items, Projects, Schemas)
Summary bar with tier counts (colored segments, clickable to filter)
Sortable, filterable table: Score, PN, Description, Category, Missing field count
Filters: Project, Category, Max Score, search
Pagination

Phase 2: Inline Edit Panel

Split-panel detail view on row click (same pattern as items page)
Shows all applicable fields for the category grouped into sections:
- Required fields
- Procurement fields (manufacturer, supplier, cost, sourcing link)
- Category-specific properties
Empty fields highlighted with red left border, filled fields with green
Score bar at top updates as fields are filled
Field save on blur/Enter via existing PUT /api/items/{pn} and revision property update endpoints
Live score recalculation after save

Phase 3: Tracking and Reporting

Store periodic score snapshots in new audit_snapshots table
Dashboard chart showing completeness improvement over time
Per-project completeness summary
CSV export of audit results

Phase 4: Batch AI Assistance

Server-side OpenRouter integration for bulk property inference
Select items with sourcing links but missing properties
AI extracts structured property values from product descriptions
Review table: item, field, current value, suggested value
Engineer checks/unchecks suggestions, applies selected
Rate limiting and cost control (queue batches, show estimated cost)

Database Changes

Phase 1-2: None

Completeness computed at query time from existing data.

Phase 3: New table

CREATE TABLE IF NOT EXISTS audit_snapshots (
    id          UUID PRIMARY KEY DEFAULT gen_random_uuid(),
    captured_at TIMESTAMPTZ NOT NULL DEFAULT now(),
    total_items INTEGER NOT NULL,
    avg_score   DECIMAL(5,4) NOT NULL,
    by_tier     JSONB NOT NULL,
    by_category JSONB NOT NULL,
    by_project  JSONB NOT NULL
);

Tasks

Add Audit tab to base.html navigation
Create audit.html template with summary bar and table
Add HandleAuditPage handler and register GET /audit route
Implement sortable/filterable table with pagination
Implement inline edit panel with field grouping
Add live score recalculation after field saves
Add audit_snapshots migration and snapshot capture
Add CSV export for audit results
Implement batch AI property extraction (Phase 4)

## Summary Implement the Component Audit tool as designed in `docs/COMPONENT_AUDIT.md`. The API scoring logic already exists in `internal/api/audit_handlers.go` — this issue covers building the web UI and completing any remaining backend work. ## Background The parts database has grown organically. Many items have only a part number, description, and category. The property schema defines dozens of fields per category but most items have few populated. There is no way to see which items are missing data or to prioritize what needs filling in. ## Design Reference Full design specification: `docs/COMPONENT_AUDIT.md` ## What Already Exists ### Backend (`internal/api/audit_handlers.go`) - `HandleAuditCompleteness()` — query items, compute scores against schema, return paginated JSON - `HandleAuditItemDetail()` — single item with field-by-field breakdown - Weighted scoring for purchased vs manufactured parts - BOM existence checking for manufactured parts - Assembly computed fields (cost rollup, weight rollup, component count) - Tier classification: critical (0-25%), low (25-50%), partial (50-75%), good (75-99%), complete (100%) - Routes registered: `GET /api/audit/completeness`, `GET /api/audit/completeness/{partNumber}` ### What Needs Building ## Phase 1: Audit Page UI New template: `internal/api/templates/audit.html` - Same base template, Catppuccin Mocha theme - Add "Audit" tab to navigation bar (4th tab after Items, Projects, Schemas) - Summary bar with tier counts (colored segments, clickable to filter) - Sortable, filterable table: Score, PN, Description, Category, Missing field count - Filters: Project, Category, Max Score, search - Pagination ### Phase 2: Inline Edit Panel - Split-panel detail view on row click (same pattern as items page) - Shows all applicable fields for the category grouped into sections: - Required fields - Procurement fields (manufacturer, supplier, cost, sourcing link) - Category-specific properties - Empty fields highlighted with red left border, filled fields with green - Score bar at top updates as fields are filled - Field save on blur/Enter via existing `PUT /api/items/{pn}` and revision property update endpoints - Live score recalculation after save ### Phase 3: Tracking and Reporting - Store periodic score snapshots in new `audit_snapshots` table - Dashboard chart showing completeness improvement over time - Per-project completeness summary - CSV export of audit results ### Phase 4: Batch AI Assistance - Server-side OpenRouter integration for bulk property inference - Select items with sourcing links but missing properties - AI extracts structured property values from product descriptions - Review table: item, field, current value, suggested value - Engineer checks/unchecks suggestions, applies selected - Rate limiting and cost control (queue batches, show estimated cost) ## Database Changes ### Phase 1-2: None Completeness computed at query time from existing data. ### Phase 3: New table ```sql CREATE TABLE IF NOT EXISTS audit_snapshots ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), captured_at TIMESTAMPTZ NOT NULL DEFAULT now(), total_items INTEGER NOT NULL, avg_score DECIMAL(5,4) NOT NULL, by_tier JSONB NOT NULL, by_category JSONB NOT NULL, by_project JSONB NOT NULL ); ``` ## Tasks - [ ] Add Audit tab to `base.html` navigation - [ ] Create `audit.html` template with summary bar and table - [ ] Add `HandleAuditPage` handler and register `GET /audit` route - [ ] Implement sortable/filterable table with pagination - [ ] Implement inline edit panel with field grouping - [ ] Add live score recalculation after field saves - [ ] Add audit_snapshots migration and snapshot capture - [ ] Add CSV export for audit results - [ ] Implement batch AI property extraction (Phase 4)

forbes referenced this issue

2026-02-06 20:43:00 +00:00

epic: migrate frontend from Go templates to React + Vite + TypeScript #6

forbes referenced this issue from a commit

2026-02-07 14:48:56 +00:00

feat(web): implement Component Audit UI with inline editing

forbes closed this issue

2026-02-07 14:48:56 +00:00

forbes referenced this issue from a commit

2026-02-07 19:40:25 +00:00

feat(web): implement Component Audit UI with inline editing

forbes referenced this issue