<commit_before>import * as React from 'react';
import {Button, ButtonGroup, FormGroup, FormControl} from 'react-bootstrap';
import styles from "./paginationControls.module.scss";
import { If, Then, Else } from 'react-if';
import {observable} from "mobx";
import {observer} from "mobx-react";

export const SHOW_ALL_PAGE_SIZE = -1;

export interface IPaginationControlsProps {
    currentPage?:number;
    itemsPerPage?:number;
    itemsPerPageOptions?:number[];
    showAllOption?:boolean;
    textBetweenButtons?:string;
    firstButtonContent?: string | JSX.Element;
    previousButtonContent?: string | JSX.Element;
    nextButtonContent?: string | JSX.Element;
    lastButtonContent?: string | JSX.Element;
    showFirstPage?:boolean;
    showLastPage?:boolean;
    showItemsPerPageSelector?:boolean;
    onChangeItemsPerPage?:(itemsPerPage:number)=>void;
    onFirstPageClick?:()=>void;
    onPreviousPageClick?:()=>void;
    onNextPageClick?:()=>void;
    onLastPageClick?:()=>void;
    onChangeCurrentPage?:(newPage:number)=>void;
    className?:string;
    style?:{ [k: string]: string | number },
    firstPageDisabled?:boolean;
    previousPageDisabled?:boolean;
    nextPageDisabled?:boolean;
    lastPageDisabled?:boolean;
    pageNumberEditable?:boolean;
}

@observer
export class PaginationControls extends React.Component<IPaginationControlsProps, {}> {
    public static defaultProps = {
        itemsPerPage: SHOW_ALL_PAGE_SIZE,
        itemsPerPageOptions: [10, 25, 50, 100],
        showAllOption: true,
        textBetweenButtons: "text btwn buttons",
        firstButtonContent: (<i className='fa fa-angle-double-left'/>),
        previousButtonContent: (<i className='fa fa-angle-left'/>),
        nextButtonContent: (<i className='fa fa-angle-right'/>),
        lastButtonContent: (<i className='fa fa-angle-double-right'/>),
        showItemsPerPageSelector:true,
        showFirstPage:false,
        showLastPage:false,
        className: "",
        style:{},
        previousPageDisabled:false,
        nextPageDisabled:false,
        pageNumberEditable: false
    };

    constructor(props:IPaginationControlsProps) {
        super(props);
        this.handleChangeItemsPerPage = this.handleChangeItemsPerPage.bind(this);
        this.handleChangeCurrentPage = this.handleChangeCurrentPage.bind(this);
        this.handleOnBlur = this.handleOnBlur.bind(this);
    }

    private pageNumberInput: HTMLSpanElement;

    private jumpToPage() {

        if (this.props.onChangeCurrentPage) {
            this.props.onChangeCurrentPage(parseInt(this.pageNumberInput.innerText, 10));
        }

        this.pageNumberInput.innerText = (this.props.currentPage as number).toString();
    }

    handleChangeItemsPerPage(evt:React.FormEvent<HTMLSelectElement>) {

        if (this.props.onChangeItemsPerPage) {
            this.props.onChangeItemsPerPage(parseInt((evt.target as HTMLSelectElement).value,10));
        }
    }

    handleChangeCurrentPage(evt:React.KeyboardEvent<HTMLSpanElement>) {

        const newKey = evt.key;

        if (newKey === "Enter") {
            evt.preventDefault();
            evt.currentTarget.blur();
            return;
        }

        if (evt.currentTarget.innerText.length === 3) {<commit_msg>patient pagination doesn't handle cohorts greater than three digits<commit_after>import * as React from 'react';
import {Button, ButtonGroup, FormGroup, FormControl} from 'react-bootstrap';
import styles from "./paginationControls.module.scss";
import { If, Then, Else } from 'react-if';
import {observable} from "mobx";
import {observer} from "mobx-react";

export const SHOW_ALL_PAGE_SIZE = -1;

export const MAX_DIGITS = 6;

export interface IPaginationControlsProps {
    currentPage?:number;
    itemsPerPage?:number;
    itemsPerPageOptions?:number[];
    showAllOption?:boolean;
    textBetweenButtons?:string;
    firstButtonContent?: string | JSX.Element;
    previousButtonContent?: string | JSX.Element;
    nextButtonContent?: string | JSX.Element;
    lastButtonContent?: string | JSX.Element;
    showFirstPage?:boolean;
    showLastPage?:boolean;
    showItemsPerPageSelector?:boolean;
    onChangeItemsPerPage?:(itemsPerPage:number)=>void;
    onFirstPageClick?:()=>void;
    onPreviousPageClick?:()=>void;
    onNextPageClick?:()=>void;
    onLastPageClick?:()=>void;
    onChangeCurrentPage?:(newPage:number)=>void;
    className?:string;
    style?:{ [k: string]: string | number },
    firstPageDisabled?:boolean;
    previousPageDisabled?:boolean;
    nextPageDisabled?:boolean;
    lastPageDisabled?:boolean;
    pageNumberEditable?:boolean;
}

@observer
export class PaginationControls extends React.Component<IPaginationControlsProps, {}> {
    public static defaultProps = {
        itemsPerPage: SHOW_ALL_PAGE_SIZE,
        itemsPerPageOptions: [10, 25, 50, 100],
        showAllOption: true,
        textBetweenButtons: "text btwn buttons",
        firstButtonContent: (<i className='fa fa-angle-double-left'/>),
        previousButtonContent: (<i className='fa fa-angle-left'/>),
        nextButtonContent: (<i className='fa fa-angle-right'/>),
        lastButtonContent: (<i className='fa fa-angle-double-right'/>),
        showItemsPerPageSelector:true,
        showFirstPage:false,
        showLastPage:false,
        className: "",
        style:{},
        previousPageDisabled:false,
        nextPageDisabled:false,
        pageNumberEditable: false
    };

    constructor(props:IPaginationControlsProps) {
        super(props);
        this.handleChangeItemsPerPage = this.handleChangeItemsPerPage.bind(this);
        this.handleChangeCurrentPage = this.handleChangeCurrentPage.bind(this);
        this.handleOnBlur = this.handleOnBlur.bind(this);
    }

    private pageNumberInput: HTMLSpanElement;

    private jumpToPage() {

        if (this.props.onChangeCurrentPage) {
            this.props.onChangeCurrentPage(parseInt(this.pageNumberInput.innerText, 10));
        }

        this.pageNumberInput.innerText = (this.props.currentPage as number).toString();
    }

    handleChangeItemsPerPage(evt:React.FormEvent<HTMLSelectElement>) {

        if (this.props.onChangeItemsPerPage) {
            this.props.onChangeItemsPerPage(parseInt((evt.target as HTMLSelectElement).value,10));
        }
    }

    handleChangeCurrentPage(evt:React.KeyboardEvent<HTMLSpanElement>) {

        const newKey = evt.key;

        if (newKey === "Enter") {
            evt.preventDefault();
            evt.currentTarget.blur();
            return;
        }

        if (evt.currentTarget.innerText.length === MAX_DIGITS) {
{'fraction_non_alphanumeric': 0.11760254275768124, 'fraction_numerical': 0.00454063871651279, 'mean_word_length': 3.624212736179146, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 29, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7150023', 'n_tokens_mistral': 1925, 'n_tokens_neox': 1886, 'n_words': 334}