'use client'

import {ShoppingCartIcon} from 'lucide-react'
import {useTranslations} from 'next-intl'

import useCartStore, {CartItem} from '@/store/cart-store'
import {Button} from '@/ui/button'

export default function CardBuyButton({
	item,
	isIcon
}: {
	item: CartItem
	isIcon?: boolean
}) {
	const t = useTranslations('cart')
	const addItemToCart = useCartStore(state => state.addItemToCart)

	return (
		<Button
			className={`mr-1.5 ${isIcon ? '' : 'w-[80px]'} z-50 grow-0 shadow-white hover:shadow-md hover:shadow-brand-violet/50`}
			onClick={() => addItemToCart(item)}
		>
			{isIcon ? (
				<ShoppingCartIcon role='button' className='bw-cart-btn p-1' />
			) : (
				t('buy')
			)}
		</Button>
	)
}