feat: update page size options to handle null values and improve dynamic selection

Author: kulikp1

adminforth/spa/src/afcl/Select.vue

@@ -119,7 +119,7 @@ import { ref, computed, onMounted, onUnmounted, watch, nextTick,type PropType, t
 import { IconCaretDownSolid } from '@iconify-prerendered/vue-flowbite';
 import { useElementSize } from '@vueuse/core'
 
-type ISingleSelectModelValue = string | number | boolean;
+type ISingleSelectModelValue = string | number | boolean | null;
 
 const props = defineProps({
   options: Array,

adminforth/spa/src/components/ResourceListTable.vue

@@ -431,13 +431,7 @@ const emits = defineEmits([
 ]);
 
 const pageSizeOptionsComputed = computed(() => {
-  let options = props.pageSizeOptions; 
-  
-  if (!options || options.length === 0) {
-    return [];
-  }
-
-  let combinedOptions = [...options];
+  let combinedOptions = [...props.pageSizeOptions]; 
 
   if (props.pageSize && !combinedOptions.includes(props.pageSize)) {
     combinedOptions.push(props.pageSize);
@@ -450,7 +444,7 @@ const pageSizeOptionsComputed = computed(() => {
   }));
 });
 
-const pageSizeInternal = ref(props.pageSize);
+const pageSizeInternal = ref<number | null>(null);
 
 const selectDynamicWidth = computed(() => {
   const length = pageSizeInternal.value?.toString().length || 2;

adminforth/spa/src/views/ListView.vue

@@ -173,7 +173,7 @@
       @update:records="getListInner"
       @update:pageSize="(newSize) => { pageSize = newSize; page = 1; }"
       :sort="sort"
-      :pageSizeOptions="resolvedPageSizeOptions"
+      :pageSizeOptions="Array.isArray(coreStore.resource?.options?.listPageSizeOptions) ? coreStore.resource?.options?.listPageSizeOptions : []"
       :pageSize="pageSize"
       :totalRows="totalRows"
       :checkboxes="checkboxes"
@@ -238,8 +238,6 @@ import {
 import Filters from '@/components/Filters.vue';
 import { useAdminforth } from '@/adminforth';
 
-const adminforth = useAdminforth();
-
 const filtersShow = ref(false);
 const { list, alert } = useAdminforth();
 const coreStore = useCoreStore();
@@ -411,28 +409,12 @@ function clearAutoRefresher() {
   }
 }
 
-const resolvedPageSizeOptions = ref<number[]>([]);
-
 async function init() {
   
   await coreStore.fetchResourceFull({
     resourceId: route.params.resourceId as string
   });
 
-  const optionsRaw = coreStore.resource?.options?.listPageSizeOptions;
-
-  if (typeof optionsRaw === 'function') {
-    resolvedPageSizeOptions.value = await optionsRaw({
-      adminUser: coreStore.adminUser,
-      adminforth: adminforth
-    });
-  } else if (Array.isArray(optionsRaw)) {
-    resolvedPageSizeOptions.value = optionsRaw;
-  } else {
-    resolvedPageSizeOptions.value = [];
-  }
-
-
   syncPageSize();
 
   isPageLoaded.value = true;