<select class="form-select" aria-label="items Per Page" id="itemsPerPage">
    <option value="10">10 {{ 'results'|trans }}</option>
    <option value="20">20 {{ 'results'|trans }}</option>
    <option value="50">50 {{ 'results'|trans }}</option>
    <option value="100">100 {{ 'results'|trans }}</option>
</select>
<script>
    let select = document.querySelector("select#itemsPerPage");
    window.addEventListener('load', () =>
        select.value = {{ current }}
    );
    select.addEventListener('change', () => {
        let url = new URL(window.location.href);
        let params = url.searchParams;
        params.set('page', '1');
        params.set('item_per_page', select.value);
        url.search = params.toString();
        window.location.href = url.toString();
    });
</script>
