Typescript on pagination.

[Mirare23]

So im trying to get pagecount on responsed. Here's what i do

const { data: BlogResponses } = await useAsyncData("blog", () => find<IAttributes>("blogs", { populate: "*", sort: "id:desc", pagination: { page: 1, pageSize: 10, withCount: true }, fields: ["title", "description", "slug", "Date", "Is_recomended"], }) )

onMounted(() => { maxPage.value = BlogResponses.value?.meta.pagination.pageCount })

Im getting typescript error that pageCount is not exist. i checked the types on the modules it provide this

What i did wrong? im new to TS .

[olrtg]

Hey @Mirare23! hope you're doing great!

You cannot access properties that you don't know you're going to get, Typescript only knows that in both cases you're going to get total because is the common property between the two types. In order to tell TypeScript which one (the page or offset pagination object) you have in your response you have to "narrow" the type, to give you an example, in my project I do this:

<template>
  <div
    v-if="
      articles && // articles (or data) can be null so I'm checking that first
      'pageCount' in articles.meta.pagination && // here I'm checking for one of the properties of the `MetaResponsePaginationByPage` to tell TS I have that shape
      articles.meta.pagination.pageCount > 1 // now you can access the `MetaResponsePaginationByPage` properties without TS errors (all the child elements can access this shape too)
    "
    class="flex justify-end px-3 py-3.5 border-t border-gray-200 dark:border-gray-700"
  >
    <UPagination
      v-model="page"
      :page-count="articles.meta.pagination.pageSize"
      :total="articles.meta.pagination.total"
    />
  </div>
</template>

Hope it helps!