Violations

Overview

The Violations page (/{tenant}/violations) lists food safety issues detected by the AI system. Violations are created by the detection pipeline, not manually; users can view, filter, and open details.

What is a violation?

A violation includes:

• ID — Unique identifier
• Timestamp — When it was detected (ISO datetime)
• Location — Which location (kitchen, warehouse, etc.)
• Camera — Which camera captured it
• Detections — One or more detections, each with:
  • Bounding box — Coordinates of the detected area in the image
  • Tags — Labels (e.g. no_hat, dirty_surface)
  • Confidence — Detection confidence score
• Tags — Aggregated high-level tags for the violation (used for filtering)

The detail view shows a signed image URL so you can see the snapshot associated with the violation.

Period filter

A dropdown in the toolbar controls the time window for all violation data on the page. Options:

The selected period affects the violations table, the stats sidebar, and the By Use Case tab.

Stats sidebar

The panel on the right side of the page shows three sections for the selected period:

By Use Case

A list of every active detection use case with the number of violations detected in the selected period, ordered by count (highest first).

By Hour

A bar chart showing how violations are distributed across the 24 hours of the day for the selected period.

By Location

A donut chart showing the proportion of violations per location for the selected period. A legend beneath the chart lists up to 4 locations with their counts.

Views

The toolbar has two tab buttons to switch the main panel:

Table view (default)

A paginated table of violations. Columns include: timestamp, location, camera, tags, and a view action.

Filters:

• Location — Filter by location
• Tags — Filter by one or more detection tags
• Date / time range — Narrow to a specific window within the selected period

Pagination: page and perPage query params.

By Use Case view

A card grid — one card per detection use case — showing:

• Use case logo and name
• Category label
• Total violation count for the selected period, colour-coded:
  • Muted — 0 violations
  • Blue — 1–4 violations
  • Yellow — 5–19 violations
  • Red — 20 or more violations
• Timestamp of the most recent violation

Violation details sheet

Clicking a use case card opens a slide-in panel on the right with all violations for that use case:

• The period filter is inherited from the parent page but can be changed independently within the sheet
• A Location dropdown lets you narrow results to a specific location
• A paginated table lists violations sorted by timestamp (newest first)
• Columns can be sorted by clicking the column header

Violation detail

Opening a violation (row action or “View”) opens a detail view (modal or page) showing:

• Full violation metadata (timestamp, location, camera)
• Image — From the signed image URL
• Detections — Bounding boxes overlaid on the image, with tags per detection
• Tags — All tags associated with the violation

Violations are read-only; they are generated by the backend AI pipeline and cannot be created or edited in the app.

URLs and query params

Optional query params: locationId, tags (single or multiple), page, perPage

Example: /{tenant}/violations?locationId=loc-123&tags=no_hat&page=1&perPage=20

Replace {tenant} with the tenant slug (e.g. acme).