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 {BoartArticleListTable} 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 {
        title,
        breadcrumb,
        searchOptions,
        searchParams,
        list,
        bbsTyCode,
        totalItems,
        currentPage,
        totalPages,
        size,
        isLoading,
        error,
        successMessage,
        isAllChecked,
        isPartiallyChecked,
        isChecked,
        handleCheck,
        handleCheckAll,
        handleSearchChange,
        handlePageChange,
    } = useBoardArticleListPage(bbsId);

    useLoadingToast({
        isLoading,
        error,
        successMessage
    });

    const homeUrl = '#'

    return (
        <>
            <PageHeader title={title} breadcrumb={breadcrumb} homeUrl={homeUrl}/>
            <ListSearchForm
                totalItems={totalItems}
                searchParams={searchParams}
                onChange={handleSearchChange}
                searchOptions={searchOptions}
                totalLabel={"게시글"}
            />
            {bbsTyCode === "BBST05" ?
                <BoardArticleImageListTable
                    items={list}
                /> :
                <BoartArticleListTable
                    items={list}
                    params={searchParams}
                    onChange={handleSearchChange}
                    isAllChecked={isAllChecked}
                    isPartiallyChecked={isPartiallyChecked}
                    isChecked={isChecked}
                    onCheck={handleCheck}
                    onCheckAll={handleCheckAll}
                    totalPages={totalPages}
                    currentPage={currentPage}
                    totalItems={totalItems}
                />
            }
            <Pagination
                totalItems={totalItems}
                totalPages={totalPages}
                currentPage={currentPage}
                size={size}
                onPageChange={handlePageChange}
            />
        </>
    );
}