How to hide pagination buttons when b-table is empty

My b-table is currently empty and I can still see the pagination buttons

How do I hide pagination when there is nothing to display in the table

<template lang="pug">
b-table.announcements__table.is-flex.is-flex-grow-1.is-flex-direction-column(
  :current-page.sync='currentPage',
  :data='announcementItems',
  :loading='isLoading',
  :mobile-cards='false',
  :pagination-rounded='true',
  :per-page='pageSize',
  :show-header='false',
  :total='count',
  aria-current-label='Current page',
  aria-next-label='Next page',
  aria-page-label='Page',
  aria-previous-label='Previous page',
  backend-pagination,
  empty,
  hoverable,
  paginated,
  pagination-size='is-small',
  @page-change='onPageChange'
)
  b-table-column(
    label='Updated At',
    v-slot='props',
    cell-class='announcement__item__updated__at has-text-weight-light'
  ) {{ formatAnnouncementUpdatedAt(props.row.updated_at) }}
  b-table-column(
    label='Title',
    v-slot='props',
    cell-class='announcement__item__title'
  ) 
    .is-size-6.has-text-left.has-text-weight-medium {{ props.row.announcement_title }}
    .is-size-7.has-text-left {{ props.row.announcement_description }}
  template(#empty='')
    .has-text-centered No announcements found for "{{ currentSearch }}"
</template>

<b-table 
:paginated="enablePagination ? true : false"
...>

you can toggle the value of enablePagination basis if your table data 'announcementItems' is empty or if 'isLoading'