Skip to content

Add pagination component and update its usage

ryanlong requested to merge 120-pagination into main

Created by: deepakduggirala

Description

Add pagination component and update its usage in Dataset and Workflow pages.

  • responsive design
  • two v-models: page and page_size
  • props: total results, current items, page size options

Usage:

  <Pagination
    class="mt-5 px-1 lg:px-3"
    v-model:page="query_params.page"
    v-model:page_size="query_params.page_size"
    :total_results="total_results"
    :curr_items="workflows.length"
    :page_size_options="PAGE_SIZE_OPTIONS"
  />

Related Issue(s)

Closes #120 (closed)

Changes Made

List the main changes made in this PR. Be as specific as possible.

  • Feature added
  • Bug fixed
  • Code refactored
  • Documentation updated
  • Other changes: [describe]

Screenshots (if applicable) Small Mobile image

Large Mobile image

Tablet image

Laptop - large image

Checklist

Before submitting this PR, please make sure that:

  • Your code passes linting and coding style checks.
  • Documentation has been updated to reflect the changes.
  • You have reviewed your own code and resolved any merge conflicts.
  • You have requested a review from at least one team member.
  • Any relevant issue(s) have been linked to this PR.

Additional Information

Add any other information or context that may be relevant to this PR. This can include potential impacts, known issues, or future work related to this change.

Merge request reports