import { PaymentList } from '@/lib/payment-lib';
interface Payment {
    payment_code: string;
    name: string;
    acquire: string;
    payment_type: string;
    payment_date: any;
}

interface PaymentTypeProps {
    paymentType: Payment;
    setPaymentType: React.Dispatch<React.SetStateAction<Payment>>;
}

const PaymentTypeForm: React.FC<PaymentTypeProps> = ({ paymentType, setPaymentType }) => {
    const paymentList = PaymentList();

    const handleChangePayment = (e: React.ChangeEvent<HTMLSelectElement>) => {
        const selectedStatus = e.target.value;
        const paymentSelected = paymentList.find((payment: any) => payment.payment_code === selectedStatus);

        if (paymentSelected) {
            setPaymentType((prev) => ({
                ...prev,
                payment_code: paymentSelected.payment_code,
                name: paymentSelected.label,
                acquire: paymentSelected.acquire,
                payment_type: paymentSelected.payment_type,
            }));
        }
    };
    return (
        <div className="panel mb-5">
            <label htmlFor="payment-method">Payment Via</label>
            <select id="payment-method" name="payment-method" className="form-select" value={paymentType.payment_code} onChange={handleChangePayment}>
                <option value=" ">Select Payment</option>
                {paymentList.map((payment: any) => (
                    <option key={payment.payment_code} value={payment.payment_code}>
                        {payment.label} | {payment.acquire}
                    </option>
                ))}
            </select>
        </div>
    );
};
export default PaymentTypeForm;