import React from 'react';
// import {useState} from 'react';

import {TableRows} from "./TableRows";
// import {QueueRow} from "./QueueRow";

export function HomePage() {
    // TODO : fetch API to get all the rows
    const rows = [];

    return (
            <div className="App">
                <div className="flex flex-col">
                    <div className="overflow-x-auto sm:mx-0.5 lg:mx-0.5">
                        <div className="py-2 inline-block min-w-full sm:px-6 lg:px-8">
                            <div className="overflow-hidden">
                                <h1 className="font-mono font-bold text-2xl mb-10">Available Queues</h1>
                                {rows ? <TableRows rows={rows}/> : <p>No queues available</p>}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
    )
}
