import React, { useState } from 'react'
import { Head } from '@inertiajs/react'
import ModalInput from '@/Components/ModalInput'
import DeleteButton from '@/Components/DeleteButton'

export default function PaymentType({ tableName, paymentType, fields }) {
    const [selectedPaymentType, setSelectedPaymentType] = useState(null)



    return (
        <div>
            <Head title="Daftar Payment Type" />
            <h1>Data Payment Type</h1>

            <ModalInput fields={fields} tableName="payment_types" initialData={selectedPaymentType} onClose={() => setSelectedPaymentType(null)} />
            <label htmlFor="modal_input" className='btn btn-secondary' onClick={() => setSelectedPaymentType(null)}>Tambah Payment Type</label>

            {paymentType ? paymentType.map((item, i) => {
                return (
                    <div key={i}>
                        <p>Payment type: {item.payment_type}</p>
                    </div>
                )
            }) : ""}
        </div>
    )
}