import {useParams} from "react-router-dom";
import {PageHeader} from "../../../component/PageHeader.tsx";
import {ListSearchForm} from "../../../component/ListSearchForm.tsx";
import {Pagination} from "../../../component/pagination/Pagination.tsx";
import {useLoadingToast} from "../../../hook/useLoadingToast.ts";
import {BoardArticleListTable} from "../components/article/BoardArticleListTable.tsx";
import {BoardArticleImageListTable} from "../components/article/BoardArticleImageListTable.tsx";
import {useBoardArticleListPage} from "../hook/page/useBoardArticleListPage.ts";

export const BoardArticleListPage = () => {
    const {bbsId = ''} = useParams();
    const {
        header,
        status,
        search,
        table,
        pagination,
    } = useBoardArticleListPage(bbsId);

    useLoadingToast(status);

    return (
        <>
            <PageHeader {...header}/>
            <ListSearchForm
                {...search}
                totalLabel="게시글"
            />
            {table.typeCode === "BBST05" ? (
                <BoardArticleImageListTable items={table.items}/>
            ) : (
                <BoardArticleListTable {...table}/>
            )}
            <Pagination {...pagination}/>
        </>
    );
}