Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/openstatusHQ/openstatus. 🫖 Status page with uptime monitoring & API monitoring as code 🫖 openstatus.dev
bun drizzle-orm monitoring monitoring-as-code nextjs observability on-call open-source shadcn-ui status-page statuspage synthetic-monitoring tinybird turso uptime uptime-checker uptime-monitor
Something went wrong. Try again.
796 B · 26 lines
TSX
123456789101112131415161718192021222324252627import { Progress } from "@openstatus/ui/components/ui/progress";
interface BillingProgressProps { label: string; value: number; max: number;}
export function BillingProgress({ label, value, max }: BillingProgressProps) { return ( <div className="flex flex-col gap-2"> <div className="flex flex-col gap-0.5"> <div className="text-muted-foreground flex justify-between text-sm"> <div className="font-medium">{label}</div> <div className="font-mono"> <span className="text-foreground"> {new Intl.NumberFormat("de-DE").format(value)} </span> /{new Intl.NumberFormat("de-DE").format(max)} </div> </div> <Progress value={(value / max) * 100} /> </div> </div> );}