import React from 'react'

import { AlertProps } from './Alert.types'

import { handleAlertType } from './Alert.helpers'

const Alert = ({ type, content, className }: AlertProps) => {
  const { bg, border, icon, text } = handleAlertType(type)

  return (
    <div className={`${bg} ${border} ${className} flex items-center ${icon} mb-4 p-2 rounded ${text} text-sm`}>
      {content}
    </div>
  )
}

export default Alert
