/**
 *
 *
 * @author Evgeniy Rusanpv
 * @date 29.11.2022
 */

import * as React from 'react';
import {OptionList} from '../option_list/OptionList';
import {Pagination} from '../table/pagination/Pagination';
import {SIZE} from '../../constants';
import {IOption} from '../select/Select.types';
import * as styles from './paginatedOptionsList.m.scss';

interface IProps {
    value?: string;
    size?: SIZE;
    options: IOption [];
    goToPage: (pageNum: number) => void;
    pagesCount: number;
    onSelect: (value: IOption | null) => void;
    showUnsetOption?: boolean;
    unsetText?: string;
    page: number;
}

export class PaginatedOptionsList extends React.PureComponent<IProps> {
    override render () {
        return (
            <div className={styles.dropdownBody}>
                <OptionList
                    options={this.props.options}
                    value={this.props.value}
                    showUnsetOption={this.props.showUnsetOption}
                    unsetText={this.props.unsetText}
                    onSelect={this.props.onSelect}/>
                {this.props.pagesCount > 1 && (
                    <div className={styles.paginationContainer}>
                        <Pagination
                            onPageChange={this.props.goToPage}
                            page={this.props.page}
                            showFirstLastButtons={false}
                            showPageJump={false}
                            pages={this.props.pagesCount}
                        />
                    </div>
                )}
            </div>
        );
    }

}
