'use client'

import { useRouter } from 'next/navigation'

interface SurveyOption {
  id: string
  title: string
}

export function SurveySelect({ surveys, value }: { surveys: SurveyOption[]; value: string }) {
  const router = useRouter()

  return (
    <select
      className="admin-survey-select"
      aria-label="Selección de encuesta"
      value={value}
      onChange={(e) => {
        const id = e.target.value
        router.push(id ? `/admin/responses?survey_id=${id}` : '/admin/responses')
      }}
    >
      <option value="">Todos los surveys</option>
      {surveys.map((s) => (
        <option key={s.id} value={s.id}>
          {s.title}
        </option>
      ))}
    </select>
  )
}