Rating Breakdown

Average rating with a star, total review count, and five rows showing per-star counts with an amber proportional bar.

4.6
1,284 reviews
5
980
4
208
3
62
2
24
1
10

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Dashboard19 } from "@/components/beste/piece/dashboard19";

<Dashboard19
  average={4.6}
  total={1284}
  reviewsLabel="reviews"
  rows={[
    {
      "stars": 5,
      "count": 980
    },
    {
      "stars": 4,
      "count": 208
    },
    {
      "stars": 3,
      "count": 62
    },
    {
      "stars": 2,
      "count": 24
    },
    {
      "stars": 1,
      "count": 10
    }
  ]}
/>

More Dashboard pieces

View all Dashboard
api.prod.example99.94%
60 days agoToday

Uptime Status

dashboard16

Status-page timeline where every day is a thin vertical tile colored by up, degraded, outage, or no-data state.

Live requests
2,418+24 / sec

Live Counter

dashboard17

Real-time counter with a pinging status dot in the tone color, a large monospace value, and a per-second rate.

Sessions
This weekLast week

Compare Lines

dashboard18

Dual-line sparkline overlaying the current period in tone and the previous period as a faint dashed baseline with a legend.

2Critical
6Warning
14Info

Alert Summary

dashboard20

Three-tile alert overview with semantic icons and counts for critical, warning, and info severities.

68%
Storage used34 GB of 50 GB

Progress Circle

dashboard21

Radial progress gauge with a tone-colored arc, the percentage centered, and a caption line beside it.

Weekly sessions
186/ 220
34 to targetmax 300

Bullet Chart

dashboard22

Actual-vs-target bar with a tone-colored actual fill on a muted track and a thin foreground tick marking the target.