mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 18:05:11 +03:00
This PR migrates the whole monorepo to use Tailwind v4: - Removed `@tailwindcss/container-queries` plugin since it's included by default in v4, - Bump all instances of Tailwind to v4. Made minimal changes to the shared config to remove non-supported features (`alpha` mentions), - Migrate all apps to be compatible with v4 configs, - Fix the `typography.css` import in 3 apps, - Add missing rules which were included by default in v3, - Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot of classes - Rename all misnamed classes according to https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all apps. --------- Co-authored-by: Jordi Enric <jordi.err@gmail.com>
32 lines
762 B
TypeScript
32 lines
762 B
TypeScript
import { cn } from 'ui'
|
|
|
|
interface QueryInsightsHealthMetricProps {
|
|
label: string
|
|
value: number | string | undefined
|
|
className?: string
|
|
isLoading?: boolean
|
|
}
|
|
|
|
export const QueryInsightsHealthMetric = ({
|
|
label,
|
|
value,
|
|
className,
|
|
isLoading,
|
|
}: QueryInsightsHealthMetricProps) => {
|
|
return (
|
|
<div
|
|
className={cn(
|
|
'font-mono text-xs flex items-center justify-between px-4 py-2 h-10',
|
|
className
|
|
)}
|
|
>
|
|
<span className="text-foreground-lighter tracking-wider truncate uppercase">{label}</span>
|
|
{isLoading ? (
|
|
<div className="h-3 w-12 rounded-sm bg-surface-300 animate-pulse" />
|
|
) : (
|
|
<span className="text-foreground font-medium tabular-nums">{value}</span>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|