import React from 'react'
import './index.module.less'
import { searchOptions } from '../../store/searchTypeSelect'
import { useStore } from '../../store'

import { Select } from 'antd'

const SearchTypeSelect: React.FC = () => {
  const [store, useObserver] = useStore()

  const { setSearchType } = store.searchTypeSelect

  return useObserver(() => {
    const { hideAdvantageFilter } = store.main.config
    const { searchType } = store.searchTypeSelect

    if (hideAdvantageFilter) return null

    return (
      <Select className="nd-search-type-select" value={searchType} onChange={setSearchType}>
        {searchOptions.map(({ label, value }) => (
          <Select.Option key={value} value={value}>
            {label}
          </Select.Option>
        ))}
      </Select>
    )
  })
}

export default SearchTypeSelect
