Implementing Server Side Paginations | Laravel/Inertia/Vue Course

[@ahmadkhaled7497]

17:57
Why you'd use split method when Laravel simply provides the page number via the Label attribute?
You've already passed the Link object containing all the info, so the page number is simply there buddy.

[@TapanSharma.]

yeah, I probably missed that, thanks for pointing it out

[@TapanSharma.]

This Series is actually a part of new Course: Laravel with Inertia.js and Vue 3, where we'll be building multiple practical projects along the way.
You can checkout the course here (coupon code applied): www.udemy.com/course/laravel-with-inertia-and-vue/?couponCode=INERTIA

[@danang.a.rahmanda]

do you have the repositories of this series? so I can compare with my code and improve my code to better version to learn new things

[@TapanSharma.]

Yeah, here's the repo: github.com/tapan288/inertia-vue-tutorial

[@3ms772]

your approach to extracting the string url manually is bad, it has many potential issues

[@TapanSharma.]

What do you think would be a good approach in your opinion? I'll make a video about it

[@3ms772]

@@TapanSharma. I am surprised you didn't say "it's just an educational video there's no need take it seriously" which would've been a good answer also, but anyway.
the problem with your approach is that it modifys the whole url which means that if there's any value after the page parameter it will also be prased, and if there's any other parameter before the page parameter it will also cause an error, so i came up with these solutions that will only modify the required paramter:
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
```php
function getValueAfterStringUntilNaN(text, separator) {
const index = text.indexOf(separator);
if (index !== -1) {
let value = "";
for (let i = index + separator.length; i < text.length; i++) {
if (!isNaN(text[i])) {
value += text[i];
} else {
break;
}
}
return value;
} else {
return null;
}
}
const pageNumberUpdated = (link) => {
const currentPage = getValueAfterStringUntilNaN(link.url, "page=");
router.visit(link.url.split(currentPage)[0] + currentPage);
}
```
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
however, it's very unreadable so i thought there must be better approach, and then i found out that javascript has built-in functions to deal with url's, so i came up with this which is way more readable and potentially better:
////////////////////////////////////////////////////////////////////////////////////////
```php
const nextPage = (link) => {
const url = new URL(link.url);
const params = url.searchParams;
url.searchParams.set('page', params.get('page'));
router.visit(url.href);
}
```
/////////////////////////////////////////////////////////////////////////////////////