Skip to content

Commit

Permalink
Paginate response data tests (#180)
Browse files Browse the repository at this point in the history
* Work on unit test for RenderlessPagination component

* Add RenderlessPagination tests

* Formatting

* Fix pagination data parsing

* Add test for parsing laravel-data pagination
  • Loading branch information
gilbitron authored Nov 15, 2023
1 parent 7ff8351 commit 0547110
Show file tree
Hide file tree
Showing 2 changed files with 306 additions and 53 deletions.
130 changes: 77 additions & 53 deletions src/RenderlessPagination.vue
Original file line number Diff line number Diff line change
Expand Up @@ -5,53 +5,73 @@ export default {
props: {
data: {
type: Object,
default: () => {}
default: () => {},
},
limit: {
type: Number,
default: 0
default: 0,
},
keepLength: {
type: Boolean,
default: false
default: false,
},
},
computed: {
isApiResource () {
isApiResource() {
return !!this.data.meta;
},
currentPage () {
return this.isApiResource ? this.data.meta.current_page : this.data.current_page;
},
firstPageUrl () {
return this.isApiResource ? this.data.links.first : null;
},
from () {
return this.isApiResource ? this.data.meta.from : this.data.from;
},
lastPage () {
return this.isApiResource ? this.data.meta.last_page : this.data.last_page;
},
lastPageUrl () {
return this.isApiResource ? this.data.links.last : null;
},
nextPageUrl () {
return this.isApiResource ? this.data.links.next : this.data.next_page_url;
},
perPage () {
return this.isApiResource ? this.data.meta.per_page : this.data.per_page;
},
prevPageUrl () {
return this.isApiResource ? this.data.links.prev : this.data.prev_page_url;
},
to () {
return this.isApiResource ? this.data.meta.to : this.data.to;
},
total () {
return this.isApiResource ? this.data.meta.total : this.data.total;
},
pageRange () {
currentPage() {
return this.isApiResource
? this.data.meta.current_page
: this.data.current_page ?? null;
},
firstPageUrl() {
return this.isApiResource
? this.data.links.first
: this.data.first_page_url ?? null;
},
from() {
return this.isApiResource
? this.data.meta.from
: this.data.from ?? null;
},
lastPage() {
return this.isApiResource
? this.data.meta.last_page
: this.data.last_page ?? null;
},
lastPageUrl() {
return this.isApiResource
? this.data.links.last
: this.data.last_page_url ?? null;
},
nextPageUrl() {
return this.isApiResource
? this.data.links.next
: this.data.next_page_url ?? null;
},
perPage() {
return this.isApiResource
? this.data.meta.per_page
: this.data.per_page ?? null;
},
prevPageUrl() {
return this.isApiResource
? this.data.links.prev
: this.data.prev_page_url ?? null;
},
to() {
return this.isApiResource
? this.data.meta.to
: this.data.to ?? null;
},
total() {
return this.isApiResource
? this.data.meta.total
: this.data.total ?? null;
},
pageRange() {
if (this.limit === -1) {
return 0;
}
Expand All @@ -67,7 +87,7 @@ export default {
var left = current - delta;
var right = current + delta;
var leftPad = (delta + 2) * 2;
var rightPad = ((delta + 2) * 2) - 1;
var rightPad = (delta + 2) * 2 - 1;
var range = [];
var pages = [];
var l;
Expand All @@ -86,7 +106,11 @@ export default {
range.push(i);
}
// Item is after max right padding
else if (size && i > last - rightPad && current > last - rightPad + 2) {
else if (
size &&
i > last - rightPad &&
current > last - rightPad + 2
) {
range.push(i);
}
}
Expand All @@ -104,26 +128,26 @@ export default {
});
return pages;
}
},
},
methods: {
previousPage () {
this.selectPage((this.currentPage - 1));
previousPage() {
this.selectPage(this.currentPage - 1);
},
nextPage () {
this.selectPage((this.currentPage + 1));
nextPage() {
this.selectPage(this.currentPage + 1);
},
selectPage (page) {
selectPage(page) {
if (page === '...' || page === this.currentPage) {
return;
}
this.$emit('pagination-change-page', page);
}
},
},
render () {
render() {
return this.$slots.default({
data: this.data,
limit: this.limit,
Expand All @@ -139,27 +163,27 @@ export default {
prevPageUrl: this.prevPageUrl,
to: this.to,
total: this.total,
pageRange: this.pageRange
pageRange: this.pageRange,
},
prevButtonEvents: {
click: (e) => {
e.preventDefault();
this.previousPage();
}
},
},
nextButtonEvents: {
click: (e) => {
e.preventDefault();
this.nextPage();
}
},
},
pageButtonEvents: page => ({
pageButtonEvents: (page) => ({
click: (e) => {
e.preventDefault();
this.selectPage(page);
}
})
},
}),
});
}
}
},
};
</script>
Loading

1 comment on commit 0547110

@vercel
Copy link

@vercel vercel bot commented on 0547110 Nov 15, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.