Simple `useFind` that will preload data, allow for loading more & reseting

useCommentFind.ts

import { Ref, ComputedRef } from 'vue'

interface ICommentFindOptions {
  increment: number,
  initialSize?: number
}

interface ICommentFindResult {
  data: ComputedRef<Comment[]>
  hasMoreComments: ComputedRef<boolean>
  haveLoaded: Ref<boolean>

  initial: () => void
  loadMore: () => void,
  reset: () => void
}

export const useCommentFind = (params: ComputedRef<any>, options: ICommentFindOptions) : ICommentFindResult => {
  const haveLoaded = ref(false)
  const {
    increment,
    initialSize = 100
  } = options
  const commentStore = useCommentStore()
  const {
    data,
    total,
    limit,
    toPage,
    find
  } = commentStore.useFind(params)

  const initial = async () => {
    await find({ query: {}, $skip: 0, $limit: initialSize })
    haveLoaded.value = true
  }

  const loadMore = async () => {
    limit.value += increment

    if (limit.value >= initialSize) {
      const preloadAmt = initialSize + limit.value
      await find({ query: {}, $skip: 0, $limit: preloadAmt })
    }
    
    haveLoaded.value = true
  }

  const reset = async () => {
    limit.value = increment
    await toPage(1)
    haveLoaded.value = true
  }

  const hasMoreComments = computed(() => total.value > limit.value)

  return {
    data,
    hasMoreComments,
    haveLoaded,

    initial,
    loadMore,
    reset
  }
}