import type { ConfigItemInfo } from '@/api/psaContext'

interface Props {
  configs: ConfigItemInfo[]
}

export function TicketConfigs({ configs }: Props) {
  if (configs.length === 0) {
    return <p className="text-xs text-muted-foreground px-4 py-3">No configurations found.</p>
  }

  return (
    <div className="divide-y divide-default">
      {configs.map((config, i) => (
        <div key={i} className="px-4 py-3 space-y-1.5">
          <p className="text-sm font-medium text-primary">{config.device_identifier}</p>
          <div className="grid grid-cols-2 gap-2 text-xs text-muted-foreground">
            {config.type && <span>Type: {config.type}</span>}
            {config.os_type && <span>OS: {config.os_type}</span>}
            {config.ip_address && <span>IP: {config.ip_address}</span>}
            {config.serial_number && <span>Serial: {config.serial_number}</span>}
            {config.model_number && <span>Model: {config.model_number}</span>}
          </div>
        </div>
      ))}
    </div>
  )
}