import BookingWrapper from "./Index";
export default {
    title: 'Component/Layout/BookingWrapper',
    tags: ["autodocs"],
    component: BookingWrapper,
    argTypes: {
        onSeatClick: { action: 'Seat clicked' },
       
    }
}

export const Default = {
    args: {
        selectedSeats: [
            {
                userid: 1,
                selected: [
                    { row: 1, seat: 1 }, { row: 1, seat: 2 }
                ]
            },
            {
                userid: 2,
                selected: [
                    { row: 2, seat: 1 }, { row: 2, seat: 2 }, { row: 5, seat: 1 }
                ]
            }
        ],
         seatData: [
            {
                row_id: 1,
                columnData: [
                    { id: 0, status: 'aisle' },
                    { id: 1, status: 'reserved' },
                    { id: 2, status: 'available' },
                    { id: 3, status: 'reserved' },
                    { id: 4, status: 'available' },
                    { id: 0, status: 'aisle' },
                    { id: 5, status: 'available' },
                    { id: 6, status: 'reserved' },
                    { id: 7, status: 'available' },
                    { id: 8, status: 'reserved' },
                    { id: 0, status: 'aisle' },
                ]
            },
            {
                row_id: 2,
                columnData: [
                    { id: 1, status: 'available' },
                    { id: 2, status: 'available' },
                    { id: 3, status: 'available' },
                    { id: 4, status: 'available' },
                    { id: 5, status: 'available' },
                    { id: 0, status: 'aisle' },
                    { id: 6, status: 'available' },
                    { id: 7, status: 'available' },
                    { id: 8, status: 'available' },
                    { id: 9, status: 'available' },
                    { id: 10, status: 'available' },
                ]
            },
            {
                row_id: 3,
                columnData: [
                    { id: 1, status: 'available' },
                    { id: 2, status: 'available' },
                    { id: 3, status: 'available' },
                    { id: 4, status: 'available' },
                    { id: 5, status: 'available' },
                    { id: 0, status: 'aisle' },
                    { id: 6, status: 'available' },
                    { id: 7, status: 'available' },
                    { id: 8, status: 'available' },
                    { id: 9, status: 'available' },
                    { id: 10, status: 'available' },
                ]
            },
            {
                row_id: 4,
                columnData: [
                    { id: 1, status: 'available' },
                    { id: 2, status: 'available' },
                    { id: 3, status: 'available' },
                    { id: 4, status: 'available' },
                    { id: 5, status: 'available' },
                    { id: 0, status: 'aisle' },
                    { id: 6, status: 'available' },
                    { id: 7, status: 'available' },
                    { id: 8, status: 'available' },
                    { id: 9, status: 'available' },
                    { id: 10, status: 'available' },
                ]
            },
            {
                row_id: 5,
                columnData: [
                    { id: 1, status: 'available' },
                    { id: 2, status: 'available' },
                    { id: 3, status: 'available' },
                    { id: 4, status: 'available' },
                    { id: 5, status: 'available' },
                    { id: 0, status: 'aisle' },
                    { id: 6, status: 'available' },
                    { id: 7, status: 'available' },
                    { id: 8, status: 'available' },
                    { id: 9, status: 'available' },
                    { id: 10, status: 'available' },
                ]
            },
            {
                row_id: 6,
                columnData: [
                    { id: 1, status: 'available' },
                    { id: 2, status: 'available' },
                    { id: 3, status: 'available' },
                    { id: 4, status: 'available' },
                    { id: 5, status: 'available' },
                    { id: 0, status: 'aisle' },
                    { id: 6, status: 'available' },
                    { id: 7, status: 'available' },
                    { id: 8, status: 'available' },
                    { id: 9, status: 'available' },
                    { id: 10, status: 'available' },
                ]
            },
            {
                row_id: 7,
                columnData: [
                    { id: 1, status: 'available' },
                    { id: 2, status: 'available' },
                    { id: 3, status: 'available' },
                    { id: 4, status: 'available' },
                    { id: 5, status: 'available' },
                    { id: 0, status: 'aisle' },
                    { id: 6, status: 'available' },
                    { id: 7, status: 'available' },
                    { id: 8, status: 'available' },
                    { id: 9, status: 'available' },
                    { id: 10, status: 'available' },
                ]
            },
            {
                row_id: 8,
                columnData: [
                    { id: 0, status: 'aisle' },
                    { id: 1, status: 'reserved' },
                    { id: 2, status: 'available' },
                    { id: 3, status: 'reserved' },
                    { id: 4, status: 'available' },
                    { id: 0, status: 'aisle' },
                    { id: 5, status: 'available' },
                    { id: 6, status: 'reserved' },
                    { id: 7, status: 'available' },
                    { id: 8, status: 'reserved' },
                    { id: 9, status: 'available' },
                ]
            },

        ]
    }
}