nsc-events-nextjs-6-288-home-page-events-pagination

[cshimm]

Note: This branch depends on SeattleColleges/nsc-events-nestjs#110. Until it is merged to main, please make sure to checkout branch bug-110-remove-duplicate-get-handler in the nsc-events-nestjs repo before testing this feature.

Resolves #288

A "Load more events" button has been added and on click, 5 new events will be loaded until the end of the events list has been reached. When all of the events have been rendered, the Load More Events button will not be rendered anymore.

Video demonstrating pagination both logged in and logged out:

2024-04-29.23-10-19.mp4

[taylorpapke]

Works for me while logged in and out. It loads up to 5 more events every time I click the button:

[IsaacJrTypes]

Looks good. Making a note that we are using the api directly over the use effect library. Great negation technique lol

[tinpham5614]

Looks good to me.
It would be great if you could provide some comments for ease of reading and understanding of the logic. For example in line 34.

[cshimm]

Thanks @tinpham5614. I changed the variable name to activeEvents and added a comment above the filter line for clarity. I could also change it to !event.isArchived && !event.isHidden if that is even clearer.

[Ali-7s]

Not sure why but I'm met with this error:

[cshimm]

@Ali-7s Yea I had to re-address this issue so I'm still working on it. Once it's ready I'll take it out of draft mode and open it to review.

[cshimm]

Re-opened. Please checkout branch bug-110-remove-duplicate-get-handler in the nsc-events-nestjs repository to test.

[nickolasram]

I’ll “request changes” just so this doesn’t get prematurely merged while we check out the updates

Branch has been updated since review

[taylorpapke]

Still works:

[tinpham5614]

It works as expected.

[cshimm]

@tinpham5614 @nickolasram @heosman Can you guys review this PR in the nestjs repo @SeattleColleges/nsc-events-nestjs/#111 ? Since the pagination depends on it, it won't appear to work currently if you're on the main branch in the nestjs repo.