30 lines
1.0 KiB
TypeScript
30 lines
1.0 KiB
TypeScript
import React from 'react';
|
|
|
|
interface RatingBadgeProps {
|
|
rating: number;
|
|
size?: 'sm' | 'md' | 'lg';
|
|
className?: string;
|
|
}
|
|
|
|
export function RatingBadge({ rating, size = 'md', className = '' }: RatingBadgeProps) {
|
|
const getColor = (val: number) => {
|
|
if (val >= 2500) return 'text-yellow-400 bg-yellow-400/10 border-yellow-400/20';
|
|
if (val >= 2000) return 'text-purple-400 bg-purple-400/10 border-purple-400/20';
|
|
if (val >= 1500) return 'text-primary-blue bg-primary-blue/10 border-primary-blue/20';
|
|
if (val >= 1000) return 'text-performance-green bg-performance-green/10 border-performance-green/20';
|
|
return 'text-gray-400 bg-gray-400/10 border-gray-400/20';
|
|
};
|
|
|
|
const sizeMap = {
|
|
sm: 'px-1.5 py-0.5 text-[10px]',
|
|
md: 'px-2 py-1 text-xs',
|
|
lg: 'px-3 py-1.5 text-sm',
|
|
};
|
|
|
|
return (
|
|
<div className={`inline-flex items-center justify-center font-mono font-bold rounded border ${sizeMap[size]} ${getColor(rating)} ${className}`}>
|
|
{rating.toLocaleString()}
|
|
</div>
|
|
);
|
|
}
|