Aktualizace balicku, strnakovani, uprava hlavni stranky

src/pages/public/pilotProfile/FlightsListPage.vue

@@ -7,12 +7,12 @@ import {useFlightsStore} from "stores/Flights";
 import {storeToRefs} from "pinia";
 import {commonKeywords, metaData} from "src/composables/meta";
 import {useMeta} from "quasar";
-import {useUserStore} from "stores/User";
+import {loadPage, paginationLimit} from "src/composables/pagination";
 
 const props = defineProps({
   pilot: {
     type: Object,
-    required: true,
+    required: true
   }
 });
 
@@ -29,24 +29,32 @@ useAppStore().setBreadcrumbs([
   {label: `@${props.pilot.publicUsername}`},
 ])
 
-useFlightsStore().fetchPublic({username: props.pilot.publicUsername});
-const {flights, isQueryRunning: areFlightsLoading} = storeToRefs(useFlightsStore());
-const loggedUser = storeToRefs(useUserStore()).user;
+const loadNextFlightsPage = (appendItems) => loadPage({
+  fetchFunc: useFlightsStore().fetchPublic,
+  filters: {username: props.pilot.publicUsername},
+  appendItems
+});
+loadNextFlightsPage(false);
+
+const {flights, totalItemsCount, isQueryRunning: areFlightsLoading} = storeToRefs(useFlightsStore());
 </script>
 
 <template>
   <PublicFlightEventSwitcher :username="pilot?.publicUsername"/>
 
-  <FlightsListSkeleton v-if="areFlightsLoading && flights?.length === 0"/>
+  <FlightsListSkeleton :items="paginationLimit" v-if="areFlightsLoading && flights?.length === 0"/>
 
   <q-banner class="bg-primary text-white" v-else-if="!areFlightsLoading && flights.length === 0">
     Tento pilot zatím nepublikoval žádný let.
   </q-banner>
 
   <FlightsList
-      v-else
-      :items="flights"
-      :public="true"
-      class="q-mb-md"
+    v-else
+    :items="flights"
+    :total-items-count="totalItemsCount"
+    :is-query-running="areFlightsLoading"
+    :items-per-page="paginationLimit"
+    :public="true"
+    @load-more="loadNextFlightsPage(true)"
   />
 </template>