import type * as React from 'react'
import { cn } from '@admin/utils/shared/cn'

interface PlaceholderCardProps {
  icon?: React.ReactNode
  title: string
  description?: string
  action?: React.ReactNode
  className?: string
}

export function PlaceholderCard({
  icon,
  title,
  description,
  action,
  className
}: PlaceholderCardProps) {
  return (
    <div
      className={cn(
        'flex h-75 flex-col items-center justify-center gap-5 rounded-sm border border-dashed border-border bg-background',
        className
      )}
    >
      {icon}
      <div className="space-y-2 text-center">
        <p className="font-medium">{title}</p>
        {description && <p className="text-sm text-muted-foreground">{description}</p>}
      </div>
      {action}
    </div>
  )
}