diff options
Diffstat (limited to 'app/assets/javascripts/ci/runner/components/runner_pagination.vue')
-rw-r--r-- | app/assets/javascripts/ci/runner/components/runner_pagination.vue | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/app/assets/javascripts/ci/runner/components/runner_pagination.vue b/app/assets/javascripts/ci/runner/components/runner_pagination.vue new file mode 100644 index 00000000000..a5bf3074dd1 --- /dev/null +++ b/app/assets/javascripts/ci/runner/components/runner_pagination.vue @@ -0,0 +1,50 @@ +<script> +import { GlKeysetPagination } from '@gitlab/ui'; + +export default { + components: { + GlKeysetPagination, + }, + inheritAttrs: false, + props: { + pageInfo: { + required: false, + type: Object, + default: () => ({}), + }, + }, + computed: { + paginationProps() { + return { ...this.pageInfo, ...this.$attrs }; + }, + isShown() { + const { hasPreviousPage, hasNextPage } = this.pageInfo; + return hasPreviousPage || hasNextPage; + }, + }, + methods: { + prevPage() { + this.$emit('input', { + before: this.pageInfo.startCursor, + }); + }, + nextPage() { + this.$emit('input', { + after: this.pageInfo.endCursor, + }); + }, + }, +}; +</script> + +<template> + <div v-if="isShown" class="gl-text-center"> + <gl-keyset-pagination + v-bind="paginationProps" + :prev-text="s__('Pagination|Prev')" + :next-text="s__('Pagination|Next')" + @prev="prevPage" + @next="nextPage" + /> + </div> +</template> |