Some checks are pending
Deploy to Cloudflare Workers (OpenNext) / deploy (push) Waiting to run
62 lines
1.6 KiB
TypeScript
62 lines
1.6 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import Image from "next/image";
|
|
import type { LastYearWinner } from "@/content/last-year-winners";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const GRV_LOGO = "/branding/logo-icon.png";
|
|
|
|
type Props = {
|
|
company: LastYearWinner;
|
|
className?: string;
|
|
};
|
|
|
|
export function LastYearWinnerMark({ company, className }: Props) {
|
|
const [failed, setFailed] = useState(false);
|
|
const src = company.logoSrc ?? GRV_LOGO;
|
|
const showImage = !failed && src;
|
|
const logoOnly = !company.name;
|
|
|
|
return (
|
|
<div
|
|
className={cn(
|
|
"flex h-10 shrink-0 items-center gap-2 rounded-lg border border-white/25 bg-white/90 px-2.5 shadow-sm",
|
|
logoOnly && "px-2",
|
|
className
|
|
)}
|
|
title={company.name}
|
|
>
|
|
<div className="relative flex size-7 shrink-0 items-center justify-center overflow-hidden rounded-md bg-white">
|
|
{showImage ? (
|
|
<Image
|
|
src={src}
|
|
alt=""
|
|
width={28}
|
|
height={28}
|
|
className="size-7 object-contain p-0.5"
|
|
onError={() => setFailed(true)}
|
|
/>
|
|
) : company.initials ? (
|
|
<span className="text-[10px] font-bold leading-none text-[#1a5c38]">
|
|
{company.initials}
|
|
</span>
|
|
) : (
|
|
<Image
|
|
src={GRV_LOGO}
|
|
alt=""
|
|
width={28}
|
|
height={28}
|
|
className="size-7 object-contain p-0.5"
|
|
/>
|
|
)}
|
|
</div>
|
|
{company.name ? (
|
|
<span className="max-w-[7.5rem] truncate text-[11px] font-medium text-[#1a5c38]">
|
|
{company.name}
|
|
</span>
|
|
) : null}
|
|
</div>
|
|
);
|
|
}
|