<template>
  <v-pagination
    v-if="pagination.last"
    :model-value="modelValue"
    :length="pagination.last"
    rounded="circle"
    @update:model-value="onPageUpdated"
  />
</template>

<script setup lang="ts">
import type { PropType } from 'vue'
import type { Pagination } from '~/types/data'

defineProps({
  modelValue: {
    type: Number,
    required: true,
  },
  pagination: {
    type: Object as PropType<Pagination>,
    required: true,
  },
})

const emit = defineEmits(['update:modelValue'])

const onPageUpdated = (newPage: number) => {
  emit('update:modelValue', newPage)
}
</script>

<style scoped lang="scss"></style>
