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.
1.3 kB · 59 lines
TSX
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960import type { ChartConfig } from "@openstatus/ui/components/ui/chart";import { cn } from "@openstatus/ui/lib/utils";import type { NameType, ValueType,} from "recharts/types/component/DefaultTooltipContent";
interface ChartTooltipNumberProps { chartConfig: ChartConfig; value: ValueType; name: NameType;}
export function ChartTooltipNumber({ value, name, chartConfig,}: ChartTooltipNumberProps) { return ( <ChartTooltipNumberRaw value={value} label={chartConfig[name as keyof typeof chartConfig]?.label || name} style={ { "--color-bg": `var(--color-${name})`, } as React.CSSProperties } /> );}
export function ChartTooltipNumberRaw({ value, label, style, className,}: { value: ValueType; label: React.ReactNode; style?: React.CSSProperties; className?: string;}) { return ( <> <div className={cn( "h-2.5 w-2.5 shrink-0 rounded-[2px] bg-(--color-bg)", className, )} style={style} /> <span>{label}</span> <div className="text-foreground ml-auto flex items-baseline gap-0.5 font-mono font-medium tabular-nums"> {value} <span className="text-muted-foreground font-normal">ms</span> </div> </> );}