"use client"

import { ImageOffIcon } from "lucide-react"

import { cn } from "@/lib/utils"

export function BrokenImage({
  label,
  className,
}: {
  label: string
  className?: string
}) {
  return (
    <div
      role="img"
      aria-label={label}
      title={label}
      className={cn(
        "flex size-12 shrink-0 items-center justify-center rounded-md border bg-muted text-muted-foreground",
        className
      )}
    >
      <ImageOffIcon className="size-4" aria-hidden />
    </div>
  )
}