'use client'

import { useState } from 'react'
import { useRouter } from 'next/navigation'

export default function SuitableSearch() {
  const router = useRouter()
  const [selectedValue, setSelectedValue] = useState('')

  return (
    <>
      <select onChange={(e) => setSelectedValue(e.target.value)}>
        <option value="">선택 고고</option>
        <option value="瓦">瓦</option>
        <option value="スレート">スレート</option>
        <option value="アスファルトシングル">アスファルトシングル</option>
      </select>
      <button onClick={() => router.push(`/suitable/${selectedValue}`)}>검색</button>
    </>
  )
}