/**
 * @file Paginator.js
 * @author Radim Buráň (xburan03@stud.fit.vutbr.cz)
 */

import {Box, Pagination} from "@mui/material";
import React, {useEffect} from "react";

function Paginator(props) {
    const page = props.page;
    const pageCount = props.pageCount;
    const pageChanged = props.pageChanged;
    const bottomPinned = props.bottomPinned || false;

    useEffect(() => {
        if (pageCount > 0 && page > pageCount) {
            pageChanged(pageCount);
        }
    }, [pageCount]);

    const pageChangedHandler = (event, value) =>{
        pageChanged(value);
    }

    const getPaginationComponent = () => {
        return (<div className={"Center"}>
                    <Pagination count={pageCount} page={page} onChange={pageChangedHandler} shape={"rounded"} sx={{paddingTop: 1}}/>
                </div>);
    }

    if (pageCount > 1) {
        return (<>
            {bottomPinned ?
                <>
                    <Box sx={{height: 40}}></Box>
                    <Box sx={{position: "absolute", bottom: 30, left: 0, right: 0}}>
                        {getPaginationComponent()}
                    </Box>
                </>
                :
                getPaginationComponent()
            }
        </>);
    }
    else {
        return (<div/>);
    }
}

export default Paginator;