Make pagination configurable in configuration (#533)

* Make pagination configurable in configuration

* Set pagination defaults in store

* Add documentation of pagination

configuration_sample.php

@@ -23,6 +23,7 @@ return [
         'guest_redirection' => '', // useful for external auth adapters
         'search_simultaneous' => 5,
         'filter_entries' => [],
+        'pagination' => ['', 5, 10, 15],
     ],
 
     'services' => [

docs/configuration/basic.md

@@ -31,6 +31,10 @@ Note: if you've made a mistake in configuration file (forgot to close a quote?)
         // neither of above => it is a file and could be in every folder, example: '.htaccess'
         // both of above => full folder path has to match, example: '/homes/web/filegator/.npm/'
         'filter_entries' => ['Recycle.bin/', 'File System Information/', '.DS_Store', '@eaDir/', '#recycle/'],
+
+        // Use '' for the unlimited pagination and integers for the items per page. The first item is used as the
+        // default pagination and the choices are ordered by the order in the array.
+        'pagination' => ['', 5, 10, 15],
     ],
 ```
 

frontend/store.js

@@ -8,7 +8,9 @@ Vue.use(Vuex)
 export default new Vuex.Store({
   state: {
     initialized: false,
-    config: [],
+    config: {
+      pagination: ['', 5, 10, 15],
+    },
     user: {
       role: 'guest',
       permissions: [],
@@ -50,7 +52,7 @@ export default new Vuex.Store({
       }
     },
     setConfig(state, data) {
-      state.config = data
+      state.config = {...state.config, ...data}
     },
     setUser(state, data) {
       state.user = data

frontend/views/Browser.vue

@@ -191,7 +191,7 @@ export default {
   data() {
     return {
       dropZone: false,
-      perPage: '',
+      perPage: this.$store.state.config.pagination[0],
       currentPage: 1,
       checked: [],
       isLoading: false,

frontend/views/Users.vue

@@ -65,7 +65,7 @@ export default {
   components: { Menu, Pagination },
   data() {
     return {
-      perPage: '',
+      perPage: this.$store.state.config.pagination[0],
       currentPage: 1,
       isLoading: false,
       defaultSort: ['name', 'desc'],

frontend/views/partials/Pagination.vue

@@ -1,17 +1,12 @@
 <template>
   <div>
     <b-select :value="perpage" size="is-small" @input="$emit('selected', $event)">
-      <option value="">
-        {{ lang('No pagination') }}
-      </option>
-      <option value="5">
-        {{ lang('Per page', 5) }}
-      </option>
-      <option value="10">
-        {{ lang('Per page', 10) }}
-      </option>
-      <option value="15">
-        {{ lang('Per page', 15) }}
+      <option
+        v-for="page in this.$store.state.config.pagination"
+        :key="page"
+        :value="page"
+      >
+        {{ page === '' ? lang('No pagination') : lang('Per page', page) }}
       </option>
     </b-select>
   </div>