// ./src/stories/TableRows.js

import React from 'react';
import {QueueRow} from "./QueueRow";

/**
 * A list of queues.
 *
 * @param rows
 * @returns {JSX.Element}
 * @constructor
 */
const TableRows = ({rows = []}) => {
    return (
        <table>
            <thead className="bg-gray-200 border-b">
            <tr>
                <th scope="col" className="text-sm font-medium text-gray-900 px-6 py-4 text-left">
                    #
                </th>
                <th scope="col" className="text-sm font-medium text-gray-900 px-6 py-4 text-left">
                    Nom
                </th>
                <th scope="col" className="text-sm font-medium text-gray-900 px-6 py-4 text-left">
                    ARN
                </th>
                <th scope="col" className="text-sm font-medium text-gray-900 px-6 py-4 text-left">
                Messages
                </th>
            </tr>
            </thead>
            <tbody>
            {rows.map((row, index) => {
                return <QueueRow key={index}
                                 index={index + 1}
                                 arn={row.props.arn}
                                 itemCount={row.props.itemCount}
                                 qName={row.props.qName}
                                 url={row.props.url}/>
            })}
            </tbody>
            <React.StrictMode/>
        </table>
    );
}

export {
    TableRows,
}