import { FC } from 'react'
import { clx } from '../helpers/utils'

type Props = {
    variant: 'success' | 'error' | 'warning',
    text: string,
}

const StatusWithText: FC<Props> = (props: Props) => {
    return (
        <div className={clx(
            'w-fit py-1 px-2 text-xs h-fit rounded-full',
            props.variant === 'success' && 'bg-green-100 text-success',
            props.variant === 'error' && 'bg-red-100 text-red-400',
            props.variant === 'warning' && 'bg-yellow-100 text-yellow-400',
        )}>
            {props.text}
        </div>
    )
}

export default StatusWithText