import React from 'react';
import { Button } from "@/Components/ui/button";
import { Store, ShoppingCart, Loader2 } from "lucide-react";
import { useTranslation } from '@/hooks/useTranslation';

export default function ActionButtons({ isOwner, product, handleStartOrder, handleAddToCart, addingToCart }) {
    const { t } = useTranslation();

    if (isOwner) {
        return (
            <div className="mt-auto pt-6 border-t">
                <div className="w-full bg-primary/10 text-primary border border-primary/20 rounded-xl p-3 text-center text-sm font-bold flex items-center justify-center gap-2">
                    <Store className="w-4 h-4" /> {t('You own this product')}
                </div>
            </div>
        );
    }

    return (
        <div className="mt-auto pt-6 border-t grid grid-cols-1 sm:grid-cols-2 gap-3">
            <Button 
                size="lg" 
                onClick={handleStartOrder} 
                disabled={product.stock === 0}
                className="bg-orange-500 hover:bg-orange-600 text-white rounded-xl text-base font-bold shadow-md shadow-orange-500/20 active:scale-[0.98] transition-all"
            >
                {t('Buy Now')}
            </Button>
            <Button 
                size="lg" 
                variant="outline" 
                onClick={handleAddToCart} 
                disabled={addingToCart || product.stock === 0}
                className="rounded-xl text-base font-bold gap-2 border-primary/50 text-primary hover:bg-primary/5 active:scale-[0.98] transition-all"
            >
                {addingToCart ? <Loader2 className="w-5 h-5 animate-spin" /> : <ShoppingCart className="w-5 h-5" />}
                {t('Add to Cart')}
            </Button>
        </div>
    );
}