Page size selectable by user

Kreyu · Oct 5, 2024 · 1904a7d · 1904a7d
1 parent 7dd6709
commit 1904a7d
Show file tree

Hide file tree

Showing 8 changed files with 129 additions and 8 deletions.
diff --git a/docs/src/docs/features/pagination.md b/docs/src/docs/features/pagination.md
@@ -222,6 +222,71 @@ class ProductDataTableType extends AbstractDataTableType
 }
 ```
 
+## Configuring items per page
+
+The per-page limit choices can be configured using the `per_page_choices` option.
+Those choices will be rendered inside a select field, next to the pagination controls.
+
+::: code-group
+```yaml [Globally (YAML)]
+kreyu_data_table:
+  defaults:
+    pagination:
+      per_page_choices: [10, 25, 50, 100]
+```
+
+```php [Globally (PHP)]
+use Symfony\Config\KreyuDataTableConfig;
+
+return static function (KreyuDataTableConfig $config) {
+    $defaults = $config->defaults();
+    $defaults->pagination()
+        ->perPageChoices([10, 25, 50, 100)
+    ;
+};
+```
+
+```php [For data table type]
+use Kreyu\Bundle\DataTableBundle\Type\AbstractDataTableType;
+use Symfony\Component\OptionsResolver\OptionsResolver;
+
+class ProductDataTableType extends AbstractDataTableType
+{
+    public function configureOptions(OptionsResolver $resolver): void
+    {
+        $resolver->setDefaults([
+            'per_page_choices' => [10, 25, 50, 100],
+        ]);
+    }
+}
+```
+
+```php [For specific data table]
+use App\DataTable\Type\ProductDataTableType;
+use Kreyu\Bundle\DataTableBundle\DataTableFactoryAwareTrait;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+
+class ProductController extends AbstractController
+{
+    use DataTableFactoryAwareTrait;
+
+    public function index()
+    {
+        $dataTable = $this->createDataTable(
+            type: ProductDataTableType::class, 
+            query: $query,
+            options: [
+                'per_page_choices' => [10, 25, 50, 100],
+            ],
+        );
+    }
+}
+```
+:::
+
+Setting the `per_page_choices` to an empty array will hide the per-page select field.
+
+
 ## Events
 
 The following events are dispatched when `paginate()` method of the [`DataTableInterface`](https://github.com/Kreyu/data-table-bundle/blob/main/src/DataTableInterface.php) is called:

diff --git a/docs/src/reference/configuration.md b/docs/src/reference/configuration.md
@@ -37,6 +37,7 @@ kreyu_data_table:
       persistence_adapter: kreyu_data_table.pagination.persistence.adapter.cache
       # if persistence is enabled and symfony/security-bundle is installed, null otherwise 
       persistence_subject_provider: kreyu_data_table.persistence.subject_provider.token_storage
+      per_page_choices: [10, 25, 50, 100]
     filtration:
       enabled: true
       persistence_enabled: false
@@ -92,6 +93,7 @@ return static function (KreyuDataTableConfig $config) {
         ->persistenceAdapter('kreyu_data_table.pagination.persistence.adapter.cache')
         // if persistence is enabled and symfony/security-bundle is installed, null otherwise
         ->persistenceSubjectProvider('kreyu_data_table.persistence.subject_provider.token_storage')
+        ->perPageChoices([10, 25, 50, 100])
     ;
 
     $defaults->filtration()

diff --git a/src/DependencyInjection/Configuration.php b/src/DependencyInjection/Configuration.php
@@ -83,6 +83,10 @@ public function getConfigTreeBuilder(): TreeBuilder
                                 ->scalarNode('persistence_subject_provider')
                                     ->defaultNull()
                                 ->end()
+                                ->arrayNode('per_page_choices')
+                                    ->integerPrototype()->end()
+                                    ->defaultValue([10, 25, 50, 100])
+                                ->end()
                             ->end()
                         ->end()
                         ->arrayNode('filtration')

diff --git a/src/Resources/translations/KreyuDataTable.en.yaml b/src/Resources/translations/KreyuDataTable.en.yaml
@@ -26,6 +26,7 @@ Hidden columns: Hidden columns
 
 # Pagination
 Showing %current_page_first_item_index% - %current_page_last_item_index% of %total_item_count%: Showing %current_page_first_item_index% - %current_page_last_item_index% of %total_item_count%
+Items per page: Items per page
 
 # Export
 Export: Export

diff --git a/src/Resources/translations/KreyuDataTable.pl.yaml b/src/Resources/translations/KreyuDataTable.pl.yaml
@@ -29,6 +29,7 @@ Hidden columns: Ukryte kolumny
 
 # Pagination
 Showing %current_page_first_item_index% - %current_page_last_item_index% of %total_item_count%: Wyniki %current_page_first_item_index% - %current_page_last_item_index% z %total_item_count%
+Items per page: Wyników na stronę
 
 # Export
 Export: Eksport

diff --git a/src/Resources/views/themes/base.html.twig b/src/Resources/views/themes/base.html.twig
@@ -139,14 +139,17 @@
 {# Pagination #}
 
 {% block kreyu_data_table_pagination %}
-    {% if page_count > 1 %}
-        {{ block('pagination_widget', theme) }}
-    {% endif %}
+    {{ block('pagination_widget', theme) }}
 {% endblock %}
 
 {% block pagination_widget %}
     {{ block('pagination_counters', theme) }}
-    {{ block('pagination_controls', theme) }}
+
+    {% if page_count > 1 %}
+        {{ block('pagination_controls', theme) }}
+    {% endif %}
+
+    {{ block('pagination_per_page', theme) }}
 {% endblock %}
 
 {% block pagination_controls %}
@@ -187,6 +190,34 @@
     {%- endif -%}
 {% endblock %}
 
+{% block pagination_per_page %}
+    {% set choices = data_table.vars.per_page_choices %}
+
+    {% if choices is not empty %}
+        {{ block('pagination_per_page_message', theme) }}
+        {{ block('pagination_per_page_form', theme) }}
+    {% else %}
+        <div></div>
+    {% endif %}
+{% endblock %}
+
+{% block pagination_per_page_message 'Items per page'|trans %}
+
+{% block pagination_per_page_form %}
+    <form>
+        {% set select_attr = {
+            name: data_table.vars.per_page_parameter_name,
+            onchange: 'this.form.submit()',
+        }|merge(select_attr|default({})) %}
+
+        <select {% with { attr: select_attr } %}{{ block('attributes') }}{% endwith %}>
+            {% for choice in choices %}
+                <option value="{{ choice }}"{{ item_number_per_page == choice ? ' selected' }}>{{ choice }}</option>
+            {% endfor %}
+        </select>
+    </form>
+{% endblock %}
+
 {% block pagination_counters %}
     <span {{- block('attributes') -}}>
         {{- block('pagination_counters_message', theme) -}}

diff --git a/src/Resources/views/themes/bootstrap_5.html.twig b/src/Resources/views/themes/bootstrap_5.html.twig
@@ -439,19 +439,34 @@
 
 {% block pagination_widget %}
     <div class="card-footer">
-        <div class="pagination d-flex gap-3 flex-wrap justify-content-center align-items-center">
+        <div class="pagination d-flex flex-wrap justify-content-between align-items-center flex-lg-row flex-column gap-2">
             {{ parent() }}
-            <div class="d-flex col"></div>
         </div>
     </div>
 {% endblock %}
 
 {% block pagination_counters %}
-    <div class="d-flex col">{{ parent() }}</div>
+    <div class="d-flex col justify-content-start">{{ parent() }}</div>
 {% endblock %}
 
 {% block pagination_controls %}
-    <div class="d-flex">{{ parent() }}</div>
+    <div class="d-flex col justify-content-center">{{ parent() }}</div>
+{% endblock %}
+
+{% block pagination_per_page %}
+    <div class="d-flex col justify-content-end">
+        {{ parent() }}
+    </div>
+{% endblock %}
+
+{% block pagination_per_page_message %}
+    <div class="me-2 d-flex align-items-center">{{ parent() }}</div>
+{% endblock %}
+
+{% block pagination_per_page_form %}
+    {% with { select_attr: { class: 'col form-select' } } %}
+        {{ parent() }}
+    {% endwith %}
 {% endblock %}
 
 {% block pagination_page %}

diff --git a/src/Type/DataTableType.php b/src/Type/DataTableType.php
@@ -103,6 +103,7 @@ public function buildView(DataTableView $view, DataTableInterface $dataTable, ar
             'filtration_data' => $dataTable->getFiltrationData(),
             'sorting_data' => $dataTable->getSortingData(),
             'has_batch_actions' => !empty($dataTable->getBatchActions()),
+            'per_page_choices' => $options['per_page_choices'],
         ]);
 
         $view->headerRow = $this->createHeaderRowView($view, $dataTable, $visibleColumns);
@@ -168,6 +169,7 @@ public function configureOptions(OptionsResolver $resolver): void
                 'pagination_persistence_enabled' => $this->defaults['pagination']['persistence_enabled'] ?? false,
                 'pagination_persistence_adapter' => $this->defaults['pagination']['persistence_adapter'] ?? null,
                 'pagination_persistence_subject_provider' => $this->defaults['pagination']['persistence_subject_provider'] ?? null,
+                'per_page_choices' => $this->defaults['pagination']['per_page_choices'] ?? [10, 25, 50, 100],
                 'filtration_enabled' => $this->defaults['filtration']['enabled'] ?? false,
                 'filtration_persistence_enabled' => $this->defaults['filtration']['persistence_enabled'] ?? false,
                 'filtration_persistence_adapter' => $this->defaults['filtration']['persistence_adapter'] ?? null,