FleetOps — Tickets → INC operations dashboard

Context

The FleetOps SPA's Tickets tab is currently a full-bleed MapLibre map showing combined INC (red) + CRQ (blue) ticket circles plus live FleetNow vehicles, fed by the legacy GET /webhook/tickets (→ reporting.fn_tickets_for_map). Meanwhile, the 16_fleettickets repo has designed and documented a richer INC operations dashboard (Phase 2): an open-ticket layer + windowed closed overlay + derived SLA states + ticket metric cards, served by a new reporting.fn_inc_dashboard(...) function and exposed at GET /webhook/inc-dashboard.

We are overhauling the SPA to that documented design. Per the user: erase the existing INC + CRQ ticket view and rebuild INC first (CRQ deferred). INC is fully documented; CRQ reuses the same machinery later.

Decisions (confirmed with user):

• Endpoint first, then SPA — build/verify the API endpoint (+ DB function) and confirm it returns real data, then overhaul the SPA against the live endpoint.
• Layout: dashboard cards + map (matches the existing Logistics/Fuel tabs) — top filterbar (cluster / status / window), a metric-cards row, a large map card, and by-status / by-cluster tables below.

Reference docs (source of truth)

• 16_fleettickets/docs/dashboard-api-contract.md — endpoint params, response shape, field semantics (mttr = minutes, sla_state derived, coords [lng,lat], map-vs-metrics gap).
• 16_fleettickets/docs/phase-2-dashboard.md — fn_inc_dashboard signature + metrics.

Phase A API endpoint — repo tracksolid_timescale_grafana_prod

File: ~/Downloads/projects/tracksolid_timescale_grafana_prod/dashboard_api_rev.py. Deployed by scp + ssh to the remote host; the staging instance (fleetapi.fivetitude.com) runs read-only as dashboard_ro. These steps touch a live server and may need the user to run the scp/ssh deploy via ! <cmd>.

A1. Verify / apply the DB function

• Confirm reporting.fn_inc_dashboard exists in the live DB. If absent, apply via 16_fleettickets/run_migrations.py (needs the write DATABASE_URL; applies 09_inc_dashboard_fn.sql, and 08/10 if not already in tickets.schema_migrations). Migrations are idempotent + ledgered, so re-running is safe.
• Sanity check in psql: SELECT reporting.fn_inc_dashboard(); → valid JSON (open/closed FeatureCollections, metrics, window.preset='today', freshness).

A2. Add the /webhook/inc-dashboard handler

Mirror the existing tickets() handler (dashboard_api_rev.py:275-304): one passthrough SQL call, JSON body returned unchanged. Reuse get_conn, _clean.

from fastapi import FastAPI, Request, Query   # add Query to existing import (line 46)

@app.get("/webhook/inc-dashboard")
def inc_dashboard(
    cluster: str | None = None,
    status:  str | None = None,
    window:  str = "today",
    from_:   str | None = Query(None, alias="from"),   # 'from' is reserved
    to:      str | None = None,
):
    # Validation per the contract:
    #  - window not in {today,week,month,custom}        -> 400
    #  - window == 'custom' with neither from nor to    -> 400
    #  - from/to unparseable, or from >= to             -> 400
    # If either from/to is present, the SQL treats it as custom (window overridden).
    try:
        with get_conn() as conn, conn.cursor() as cur:
            cur.execute(
                "SELECT reporting.fn_inc_dashboard(%s, %s, %s, %s, %s)",
                (_clean(cluster), _clean(status), window,
                 _clean(from_), _clean(to)),
            )
            payload = cur.fetchone()[0] or {}
        return JSONResponse(payload)          # passthrough, unchanged
    except Exception:
        log.exception("inc-dashboard failed")
        return JSONResponse({"error": {"type": "unknown",
            "message": "INC dashboard is unavailable. Try again in a few seconds."}})

• Pass from/to as ISO-8601 strings; PostgreSQL casts text → timestamptz on the function call. Validate parseability API-side (e.g. datetime.fromisoformat) to return clean 400s rather than a 500 from the DB.
• Leave the legacy /webhook/tickets handler in place (CRQ / fallback may use it).

A3. Deploy + verify

• Deploy to staging: scp dashboard_api_rev.py → host, scp the staging deploy script, ssh … bash ~/deploy_dashboard_api_staging.sh (recreates the container).
• Verify against https://fleetapi.fivetitude.com:
  • GET /webhook/inc-dashboard → 200, documented shape, open/closed FCs.
  • ?window=month, ?cluster=MUIGAI%20INN, ?status=ACCEPTED, ?from=…%2B03:00&to=…%2B03:00 → counts sane; open not time-filtered.
  • ?window=bogus → 400; ?window=custom (no from/to) → 400.

Phase B SPA overhaul — 15_fleetops/src/index.html (single file)

B1. Erase the existing INC/CRQ view

Remove from src/index.html:

• Markup: the full-bleed map section #view-tickets (lines ~374-390).
• JS — drop: loadTickets() (calls /webhook/tickets), the CRQ circle layer, combined INC/CRQ summary handling, showTicketPopup() (rebuild for INC), TICKET_COLORS, ticketStats.crq.
• CSS: keep the map/marker/popup blocks (lines ~182-252) — reused; rename #tk-* selectors only if the new markup changes ids.

B2. Keep + reuse (do NOT reinvent)

The vehicle overlay machinery stays — the contract says the SPA overlays FleetNow:

• loadLive() (/webhook/live-positions, 15s poll), upsertVeh(), showVehPopup(), vehState(), ccColor(), pastel(), plateTail(), BASEMAP, COST_CENTRE_COLORS, CC_PALETTE, escapeHtml, updateVehScale(), initTicketsMap() (rename → initIncMap()), the layers-panel builder, the MapLibre popup CSS, and the warm-dark palette.
• Filterbar markup/behaviour pattern from the Logistics/Fuel tabs (.filterbar, custom-range show/hide at index.html:467-471, .card/.span* grid, table renderers, num()/intg()).

B3. New markup — #view-tickets (dashboard cards + map)

• Filterbar: Cluster select, Status select, Window select (Today / This week / This month / Custom) + custom start/end date inputs (reuse the .ff.custom show/hide), Apply, refresh ↻.
• <main> 12-col grid:
  • Metric cards row: Open now, Closed in window, Open SLA (breached / at-risk / ok / unknown), Closed SLA (compliant / breached), Avg MTTR (minutes → show as h), Closure rate (per_day_avg + a small Chart.js sparkline from closure_rate.series).
  • Map card (.span12, tall): MapLibre map with layer toggles + SLA legend.
  • By status table + By cluster table (.span6 each) from metrics.by_status / metrics.by_cluster.
  • Freshness line (exported_at / records_ingested / ingested_at) under the map.

B4. New JS — INC data + map

• State: incQs() builds query (cluster, status, window, and from/to when custom). loadInc() → fetch(${API_BASE}/webhook/inc-dashboard?…).
• Dropdowns: populate Cluster / Status from the first unfiltered response's metrics.by_cluster / metrics.by_status keys (no dedicated filters endpoint exists); keep stable thereafter.
• Map layers on one or two GeoJSON sources:
  • Open INC — circle layer colored by sla_state (breached=--danger, at_risk=--warn, ok=--live, unknown=--parked); data = open.features.
  • Closed INC — distinct dimmed style (e.g. hollow grey), data = closed.features; toggleable (default off).
  • Vehicles — existing DOM markers via loadLive().
  • Layer panel: Open INC / Closed INC / Vehicles toggles + SLA color legend.
• Popups: open → ticket_id, normalized_status, cluster · region, assigned_team/owner, sla_state + hours_open, geo_source (note "approx — cluster" when geo_source==='cluster'). closed → add closed_at, mttr (min→h), sla_status.
• Header KPI strip: repurpose renderTicketKpis() → renderIncKpis() showing INC metrics (Open now, Breached, Closed in window, Avg MTTR). Update switchTab() so the tickets case calls initIncMap() + loadInc() (lazy, like Fuel).
• Filters: Apply/↻/window-change → loadInc(). Keep the 15s vehicle poll; loadInc() is on-demand (open layer changes at most hourly).
• Caveat to honor: open.features.length may be < metrics.open_now (un-geocoded rows) — drive map from features, drive cards/tables from metrics.

Verification (end-to-end)

1. API (Phase A): curl matrix above against fleetapi.fivetitude.com — shapes, filters, 400s. Compare metrics.open_now to SELECT count(*) FROM tickets.inc WHERE is_actionable (and inc_open_sla SLA distribution).
2. SPA (Phase B): serve src/ locally (python3 -m http.server in src/, or the Caddy Docker image) with API_BASE=https://fleetapi.fivetitude.com. Open the Tickets tab and confirm:
   • Metric cards + header KPIs populate; by-status / by-cluster tables match metrics.
   • Map shows SLA-colored open INC + live vehicles; toggling Closed INC overlays the windowed closed set; SLA legend correct.
   • Changing Cluster / Status / Window + Apply refetches and updates cards, tables, and both layers; custom range shows date inputs and bounds the closed overlay.
   • Hover popups show the documented fields (open vs closed).
   • No console calls to /webhook/tickets; only /webhook/inc-dashboard + /webhook/live-positions.

Out of scope (future)

• CRQ rebuild (deferred; reuses the same pattern once a CRQ feed/function exists).
• Open-backlog-over-time / observed transitions (needs 16_fleettickets history capture — not built). Nearest-vehicle dispatch off geog.

Generated as the implementation plan for the FleetOps Tickets → INC overhaul.