Aktualizace balicku, strnakovani, uprava hlavni stranky

src/pages/profile/poi/PointsOfInterestPage.vue

@@ -6,28 +6,38 @@ import BasicListSkeleton from "components/basicSkeletons/BasicListSkeleton.vue";
 import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
 import {usePointsOfInterestStore} from "stores/PointsOfInterest";
 import {storeToRefs} from "pinia";
+import {loadPage, paginationLimit} from "src/composables/pagination";
 
-usePointsOfInterestStore().fetch();
 useAppStore().setPageTitle("Zajímavá místa");
 
-const {isQueryRunning, pointsOfInterest} = storeToRefs(usePointsOfInterestStore());
+const loadNextPage = (appendItems) => loadPage({
+  fetchFunc: usePointsOfInterestStore().fetch,
+  appendItems
+});
+loadNextPage(false);
+
+const {isQueryRunning, totalItemsCount, pointsOfInterest} = storeToRefs(usePointsOfInterestStore());
 </script>
 
 <template>
   <BasicListSkeleton :items="10" v-if="isQueryRunning && !pointsOfInterest.length"/>
   <BasicInfoBanner
-      v-else-if="!isQueryRunning && pointsOfInterest.length === 0"
-      :route-add="{name: 'addPoi'}"
-      label-add="Přidat"
+    v-else-if="!isQueryRunning && pointsOfInterest.length === 0"
+    :route-add="{name: 'addPoi'}"
+    label-add="Přidat"
   >
     Nemáš tu uložené žádné zajímavé místo. Přidej si let, nastav si tam ručně trasu a jednotlivé body se zobrazí
     i v tomto seznamu.
   </BasicInfoBanner>
 
   <POIList
-      v-else
-      :public="false"
-      :items="pointsOfInterest"
+    v-else
+    :public="false"
+    :items="pointsOfInterest"
+    :total-items-count="totalItemsCount"
+    :is-query-running="isQueryRunning"
+    :items-per-page="paginationLimit"
+    @load-more="loadNextPage(true)"
   />
 
   <FAB :router-link="{name: 'addPOI'}" mode="add"/>