Files
var-monorepo/packages/shared-components/components/Badge.tsx
2025-06-26 20:40:23 -07:00

29 lines
765 B
TypeScript

import { BADGES } from "@repo/db";
import { cn } from "../../../apps/hub/helper/cn";
import * as React from "react";
const badgeImageMapping = {
[BADGES.P1]: "p-1.png",
[BADGES.P2]: "p-2.png",
[BADGES.P3]: "p-3.png",
[BADGES.D1]: "d-1.png",
[BADGES.D2]: "d-2.png",
[BADGES.D3]: "d-3.png",
[BADGES.DAY1]: "day-1-member.png",
[BADGES.V1Veteran]: "v1-veteran.png",
};
export const Badge = ({ badge, className }: { badge: BADGES; className?: string }) => {
return (
<span className={cn("h-fit p-1 flex justify-center items-center", className)}>
<img
src={`${process.env.NEXT_PUBLIC_HUB_URL}/badges/${badgeImageMapping[badge]}`}
alt="Badge"
width="80"
height="auto"
className="block h-auto max-h-[80px] w-auto"
/>
</span>
);
};