import React from 'react'

export default function CameraSelector({ cameras, recordedMap, current, onSwitch }) {
  return (
    <select
      value={current.cam_id || ''}
      onChange={(e) => onSwitch(e.target.value, current.mode || 'recorded')}
      className="bg-bg border border-line text-text px-3 py-1.5 rounded text-[13px] min-w-[280px]
                 focus:outline-none focus:border-accent"
    >
      <option value="" disabled>— select camera —</option>
      {cameras.map(c => (
        <option key={c.id} value={c.id}>
          {c.id} · {c.label} ({c.district}){recordedMap[c.id] ? ' · rec' : ''}
        </option>
      ))}
    </select>
  )
}