import { __, sprintf } from '@wordpress/i18n';
import type { JSX } from 'react';
import { formatNumber } from '../../shared/lib/numbers';
import { setParams } from '../../shared/lib/router';
import { Button } from '../../shared/ui/Button';

const SECOND_PAGE = 2;

function previousPageParam( page: number ): string | undefined {
	if ( page > SECOND_PAGE ) {
		return String( page - 1 );
	}

	return undefined;
}

type LinksPagerProps = {
	page: number;
	pageCount: number;
};

export function LinksPager( {
	page,
	pageCount,
}: LinksPagerProps ): JSX.Element {
	return (
		<span className="pager">
			<Button
				variant="quiet"
				size="sm"
				disabled={ page <= 1 }
				onClick={ () => {
					setParams( { page: previousPageParam( page ) } );
				} }
			>
				{ __( 'Previous', 'aiplaz-link-checkup' ) }
			</Button>
			<span>
				{ sprintf(
					/* translators: 1: current page, 2: number of pages */
					__( 'Page %1$s of %2$s', 'aiplaz-link-checkup' ),
					formatNumber( page ),
					formatNumber( pageCount )
				) }
			</span>
			<Button
				variant="quiet"
				size="sm"
				disabled={ page >= pageCount }
				onClick={ () => {
					setParams( { page: String( page + 1 ) } );
				} }
			>
				{ __( 'Next', 'aiplaz-link-checkup' ) }
			</Button>
		</span>
	);
}