import React, {useEffect} from "react"
import { useHistory } from '@docusaurus/router';

export default ({ version, versions, setVersion, gitlabId, includePrerelease = false }) => {

  const selectStyle = {
    border: "1px solid rgba(128, 126, 163, 0.8)",
    borderRadius: "3px",
    height: "36px",
    lineHeight: "20px",
  }

  const history = useHistory()
  const params = new URLSearchParams()

  return <div>
    API Version anzeigen: <select
      style={selectStyle}
      value={version}
      onChange={e => {
        setVersion(e.target.value)
        params.append("version", e.target.value)
        history.push({search: params.toString()})
      }}>
      {versions && versions.map ? versions.map((v, i) => (
        <option value={v} key={i}>
          {v}
        </option>
      )) : ''}
    </select>
  </div>
}