const STATUSES = [
  'Open',
  'Occupied',
  'Assigned',
  'Awaiting',
  'Added Info',
  'In Test',
  'Halted',
  'Aborted',
  'Cancelled',
  'Closed'
]

export default function StatusDropdown({ value, onChange }) {
  return (
    <div className="dropdown">
      <button className="btn" style={{ background: 'inherit', color: 'inherit' }}>
        {value?.toUpperCase() || 'OPEN'}
      </button>
      <div className="dropdown-content">
        {STATUSES.map(status => (
          <span 
            key={status}
            className="dropdown-item"
            onClick={() => onChange(status)}
          >
            {status}
          </span>
        ))}
      </div>
    </div>
  )
}