dmenu-admin/src/pages/orders/components/OrderActions.tsx

import Button from '@/components/Button'
import { type FC, useState, useEffect } from 'react'

interface OrderActionsProps {
    showVerifyCashPaymentButton: boolean
    showSendToKitchenButton: boolean
    showCancelButton: boolean
    isPreparing: boolean
    isCourierDelivery: boolean
    isDineInOrCarDelivery: boolean
    isCustomerPickup: boolean
    isCanceled: boolean
    isVerifyingPayment: boolean
    isChangingStatus: boolean
    onVerifyCashPayment: () => void
    onSendToKitchen: () => void
    onDeliverToCourier: () => void
    onDeliverToWaiter: () => void
    onDeliverToReceptionist: () => void
    onCancelOrder: () => void
}

const OrderActions: FC<OrderActionsProps> = ({
    showVerifyCashPaymentButton,
    showSendToKitchenButton,
    showCancelButton,
    isPreparing,
    isCourierDelivery,
    isDineInOrCarDelivery,
    isCustomerPickup,
    isCanceled,
    isVerifyingPayment,
    isChangingStatus,
    onVerifyCashPayment,
    onSendToKitchen,
    onDeliverToCourier,
    onDeliverToWaiter,
    onDeliverToReceptionist,
    onCancelOrder
}) => {
    const [loadingAction, setLoadingAction] = useState<string | null>(null)

    useEffect(() => {
        if (!isChangingStatus && !isVerifyingPayment) {
            setLoadingAction(null)
        }
    }, [isChangingStatus, isVerifyingPayment])

    const handleSendToKitchen = () => {
        setLoadingAction('sendToKitchen')
        onSendToKitchen()
    }

    const handleDeliverToCourier = () => {
        setLoadingAction('deliverToCourier')
        onDeliverToCourier()
    }

    const handleDeliverToWaiter = () => {
        setLoadingAction('deliverToWaiter')
        onDeliverToWaiter()
    }

    const handleDeliverToReceptionist = () => {
        setLoadingAction('deliverToReceptionist')
        onDeliverToReceptionist()
    }

    const handleCancelOrder = () => {
        setLoadingAction('cancelOrder')
        onCancelOrder()
    }

    if (isCanceled) return null

    return (
        <div className='mt-6 flex flex-col gap-3'>
            {showVerifyCashPaymentButton && (
                <Button
                    label='تایید پرداخت'
                    onClick={onVerifyCashPayment}
                    isloading={isVerifyingPayment}
                    className='bg-green-600 hover:bg-green-700'
                />
            )}

            {showSendToKitchenButton && (
                <Button
                    label='ارسال به آشپزخانه'
                    onClick={handleSendToKitchen}
                    isloading={isChangingStatus && loadingAction === 'sendToKitchen'}
                    className='bg-orange-600 hover:bg-orange-700'
                />
            )}

            {isPreparing && isCourierDelivery && (
                <Button
                    label='تحویل به پیک'
                    onClick={handleDeliverToCourier}
                    isloading={isChangingStatus && loadingAction === 'deliverToCourier'}
                    className='bg-blue-600 hover:bg-blue-700'
                />
            )}

            {isPreparing && isDineInOrCarDelivery && (
                <Button
                    label='تحویل به گارسون'
                    onClick={handleDeliverToWaiter}
                    isloading={isChangingStatus && loadingAction === 'deliverToWaiter'}
                    className='bg-purple-600 hover:bg-purple-700'
                />
            )}

            {isPreparing && isCustomerPickup && (
                <Button
                    label='تحویل به رسپشنیست'
                    onClick={handleDeliverToReceptionist}
                    isloading={isChangingStatus && loadingAction === 'deliverToReceptionist'}
                    className='bg-indigo-600 hover:bg-indigo-700'
                />
            )}

            {showCancelButton && (
                <Button
                    label='لغو سفارش'
                    onClick={handleCancelOrder}
                    isloading={isChangingStatus && loadingAction === 'cancelOrder'}
                    className='bg-red-600 hover:bg-red-700'
                />
            )}
        </div>
    )
}

export default OrderActions