import React, {useEffect} from "react"
import useAsync from '@hooks/useAsync'
import getVersionList from "@lib/utils/getVersionList";

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

  const {execute, status, error, value: versions} = useAsync(getVersionList, {
    projectId: gitlabId,
    includePrerelease,
  }, false)

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

  useEffect(() => {
    execute()
  }, [])

  return <div>
    Andere Version anzeigen: <select
      style={selectStyle}
      value={version}
      onChange={e => setVersion(e.target.value)}>
      {versions && versions.map ? versions.map((v, i) => (
        <option value={v} key={i}>
          {v}
        </option>
      )) : ''}
    </select>
  </div>
}