From 6c77927d11d43d5ce476bf09521ce039a79e1121 Mon Sep 17 00:00:00 2001
From: ssrahn <41595254+ssrahn@users.noreply.github.com>
Date: Thu, 31 Aug 2023 11:37:47 +0200
Subject: [PATCH] Show pagination buttons only if usable (#775)

---
 vueapp/components/PaginationButtons.vue | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/vueapp/components/PaginationButtons.vue b/vueapp/components/PaginationButtons.vue
index 10c4ce176..6710e4f7c 100644
--- a/vueapp/components/PaginationButtons.vue
+++ b/vueapp/components/PaginationButtons.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="oc--pagination">
+    <div class="oc--pagination" v-if="showPagination">
         <button v-if="paging.lastPage >= 0"
             v-bind:disabled="paging.currPage <= 0"
             @click="setPage(paging.currPage-1)"
@@ -46,14 +46,14 @@
             v-model="limit"
             :title="$gettext('Videos pro Seite')"
         >
-            <option value="5">5</option>
+            <option :value="minPaginationLimit">{{minPaginationLimit}}</option>
             <option value="15">15</option>
             <option value="30">30</option>
             <option value="50">50</option>
         </select>
     </div>
 
-    <div class="oc--pagination-mobile">
+    <div class="oc--pagination-mobile" v-if="showPagination">
         <button v-if="paging.lastPage >= 0"
             v-bind:disabled="paging.currPage <= 0"
             @click="setPage(0)"
@@ -102,7 +102,7 @@
             v-model="limit"
             :title="$gettext('Videos pro Seite')"
         >
-            <option value="5">5</option>
+            <option :value="minPaginationLimit">{{minPaginationLimit}}</option>
             <option value="15">15</option>
             <option value="30">30</option>
             <option value="50">50</option>
@@ -126,7 +126,8 @@ export default {
 
     data() {
         return {
-            limit: 15
+            limit: 15,
+            minPaginationLimit: 5
         }
     },
 
@@ -184,6 +185,10 @@ export default {
             }
 
             return numbers;
+        },
+
+        showPagination() {
+            return this.paging.items > this.minPaginationLimit;
         }
     },