import type {BoardListItem} from "../../type/board.types.ts";
import type {SearchParams} from "../../../../../type/searchParams.ts";
import {EmptyRow} from "../../../../component/EmptyRow.tsx";
import {BoardListTableHeader} from "./BoardListTableHeader.tsx";
import {BoardListTableRow} from "./BoardListTableRow.tsx";

interface BoardListTableProps {
    items: BoardListItem[]
    params: SearchParams
    onChange: (params: SearchParams) => void
    totalItems: number
    currentPage: number
    totalPages: number
    onDetail: (bbsId: string) => void
    onArticleList: (bbsId: string) => void
    onPreview: (bbsId: string) => void
}

export function BoardListTable({
                                   items,
                                   params,
                                   onChange,
                                   totalItems,
                                   currentPage,
                                   totalPages,
                                   onDetail,
                                   onArticleList,
                                   onPreview
                               }: BoardListTableProps) {

    return (
        <div className="table table_type_cols">
            <table>
                <BoardListTableHeader params={params} onChange={onChange}/>
                <tbody>
                {items.length > 0 ?
                    items.map((item, index) => (
                        <BoardListTableRow
                            key={item.bbsId}
                            item={item}
                            index={index}
                            searchParams={params}
                            totalItems={totalItems}
                            currentPage={currentPage}
                            totalPages={totalPages}
                            onDetail={onDetail}
                            onArticleList={onArticleList}
                            onPreview={onPreview}
                        />))
                    : (<EmptyRow colSpan={9}/>)
                }
                </tbody>
            </table>
        </div>
    )
}