website refactor
This commit is contained in:
27
apps/website/ui/LeagueCover.tsx
Normal file
27
apps/website/ui/LeagueCover.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
/**
|
||||
* LeagueCover
|
||||
*
|
||||
* Pure UI component for displaying league cover images.
|
||||
* Renders an image with fallback on error.
|
||||
*/
|
||||
|
||||
export interface LeagueCoverProps {
|
||||
leagueId: string;
|
||||
alt: string;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export function LeagueCover({ leagueId, alt, className = '' }: LeagueCoverProps) {
|
||||
return (
|
||||
// eslint-disable-next-line @next/next/no-img-element
|
||||
<img
|
||||
src={`/media/leagues/${leagueId}/cover`}
|
||||
alt={alt}
|
||||
className={`w-full h-48 object-cover ${className}`}
|
||||
onError={(e) => {
|
||||
// Fallback to default cover
|
||||
(e.target as HTMLImageElement).src = '/default-league-cover.png';
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user