<template>
  <Loadmore
    v-if="
    loader.loadStatus.value == 'loading' 
    || (loader.loadStatus.value == 'nomore' && !$slots.empty)" 
    :status="loader.loadStatus.value" 
  />
  <slot v-else-if="loader.loadStatus.value == 'empty' && $slots.empty" name="empty" />
  <Loadmore 
    v-else-if="loader.loadStatus.value == 'error'"
    status="loadmore" 
    :loadmoreText="loader.loadError.value" 
    @loadmore="handleRetry" 
  />
</template>

<script setup lang="ts">
import type { PropType } from 'vue';
import type { ISimplePageListLoader } from '../composeabe/SimplePageListLoader';
import Loadmore from '@/components/display/loading/Loadmore.vue';

const props = defineProps({	
  loader: {
    type: Object as PropType<ISimplePageListLoader<any, any>>,
    default: null,
  },
})

function handleRetry() {
  props.loader.loadData();
}
</script>