Helpdesk reports
ProHow support is going, from the tickets: new and solved, median first reply and time to solve, satisfaction, where tickets come from, what is open by priority, and the same per agent.
pnpm dlx shadcn@latest add @caliper/helpdesk-reportsReports
The last 30 days
- New tickets
- 59
- 49 solved
- First reply, median
- 1 h 33 min
- 4 still waiting
- Time to solve, median
- 12 h
- 8 open now
- Satisfaction
- 79%
- 42 ratings
95% of first replies met their target in this period (52 of 55).
| Point | Created | Solved | Event |
|---|---|---|---|
| 15 Sept | 2 | 1 | |
| 16 Sept | 2 | 2 | |
| 17 Sept | 1 | 2 | |
| 18 Sept | 1 | 1 | |
| 19 Sept | 2 | 2 | |
| 20 Sept | 1 | 1 | |
| 21 Sept | 2 | 1 | |
| 22 Sept | 2 | 1 | |
| 23 Sept | 1 | 2 | |
| 24 Sept | 1 | 2 | |
| 25 Sept | 1 | 1 | |
| 26 Sept | 2 | 2 | |
| 27 Sept | 3 | 1 | |
| 28 Sept | 1 | 2 | |
| 29 Sept | 2 | 1 | |
| 30 Sept | 1 | 2 | |
| 1 Oct | 2 | 1 | |
| 2 Oct | 2 | 2 | |
| 3 Oct | 2 | 3 | |
| 4 Oct | 1 | 1 | |
| 5 Oct | 1 | 1 | |
| 6 Oct | 3 | 2 | |
| 7 Oct | 1 | 1 | |
| 8 Oct | 2 | 3 | |
| 9 Oct | 2 | 3 | |
| 10 Oct | 3 | 1 | |
| 11 Oct | 2 | 4 | |
| 12 Oct | 3 | 1 | |
| 13 Oct | 5 | 2 | |
| 14 Oct | 5 | 0 |
Where tickets come from
- Email27
- Chat11
- Phone10
- Web form11
Open by priority
- Urgent1
- High3
- Normal3
- Low1
Top tags
- invoices7
- access6
- rules6
- vat5
- export5
- billing5
By agent
| Agent | Open | Solved | First reply | Satisfaction |
|---|---|---|---|---|
| Maya Chen | 4 | 13 | 1 h 6 min | 83% |
| Tomás Ferreira | 0 | 14 | 2 h | 83% |
| Priya Raman | 1 | 12 | 1 h 33 min | 70% |
| Kiara Murayama | 0 | 10 | 1 h 47 min | 75% |
When to use #
Use it for
- Support leads reviewing the week or the month.
Skip it when
- Product usage; use the metrics dashboard.
Installation #
pnpm dlx shadcn@latest add @caliper/helpdesk-reports
Adds its 10 files to components/ui/, each with its own stylesheet, and installs their packages. Pro installs with your access token, set up once per project. See Pro access. The first part also adds Caliper UI’s tokens; import them once as in Installation.
Usage #
Import it from your copy of the source. The example behind the preview comes with the source.
import { HelpdeskReports } from "@/components/ui/helpdesk-reports"
The worked example comes with Pro
The 112-line example behind the preview opens here with a Pro or Team licence.
API reference #
HelpdeskReports
component
Accessibility #
It exposes img semantics, with aria-label kept in step with state.
No custom key handling; Tab and the native activation keys do the work.
Motion #
Transitions use the shared duration and easing tokens. Under prefers-reduced-motion those tokens collapse to instant and travel distances go to zero, so state changes still happen without movement.