import classnames from 'classnames'
import type { FC } from 'react'
import NormalButton from '../normalButton'
import styles from './index.module.scss'

interface ButtonPropsType {
  isActive: boolean
  onClick?: Function
  children?: React.ReactNode
  customClassName?: string
}

const FilterButton: FC<ButtonPropsType> = (props) => {
  const { onClick, children, isActive = false, customClassName } = props
  const handleClick = () => {
    onClick?.()
  }
  return (
    <NormalButton
      customTextClassName={styles['filterButton--text']}
      customClassName={classnames(styles.filterButton, isActive && styles['filterButton--active'], customClassName)}
      onClick={handleClick}
    >
      {children}
    </NormalButton>
  )
}
export default FilterButton
