Skip to content

626 paginate endless scrolling on saves #628

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 8 commits into from
Nov 25, 2024

Conversation

tfnribeiro
Copy link
Contributor

@tfnribeiro tfnribeiro commented Nov 11, 2024

  • Works similarly to the one used in FindArticles, by updating the list with extra articles until we do not get anything from the API.
  • Each call takes about 1.4s - 1.6s in my development environment (to fetch 20 articles). Before, this user had about 76 articles taking 6.3s to fetch all.

Requires the PR in the API: zeeguu/api#292

Note: I removed the isMounted check as it is an anti-pattern (we want to see the warning in case it's an issue). We should try to follow a pattern similar to the one shown here: https://legacy.reactjs.org/blog/2015/12/16/ismounted-antipattern.html

@tfnribeiro tfnribeiro linked an issue Nov 11, 2024 that may be closed by this pull request
Copy link

netlify bot commented Nov 11, 2024

Deploy Preview for voluble-nougat-015dd1 ready!

Name Link
🔨 Latest commit 484ce10
🔍 Latest deploy log https://app.netlify.com/sites/voluble-nougat-015dd1/deploys/674485038a74e600088a1fa0
😎 Deploy Preview https://deploy-preview-628--voluble-nougat-015dd1.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

- Works similarly to the one used in FindArticles, by updating the list with extra articles until we do not get anything from the API.
- Each call takes about 1.4s - 1.6s in my development environment (to fetch 20 articles). Before, this user had about 76 articles taking 6.3s to fetch all.
@tfnribeiro tfnribeiro force-pushed the 626-paginate-endless-scrolling-on-saves branch from c9b8881 to 25df96f Compare November 11, 2024 11:01
@mircealungu mircealungu self-requested a review November 18, 2024 09:40
Copy link
Member

@mircealungu mircealungu left a comment

Choose a reason for hiding this comment

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

looks good.
small question about extracting common functionality between two components. if you say it's not worth it, we merge.

setIsWaitingForNewArticles(false);
}

function handleScroll() {
Copy link
Member

Choose a reason for hiding this comment

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

there's a bit of duplication now between OwnArticles and FindArticles. I think we can live with it, but at the same time, if there was an easy way to extract a useArticlePagination hook from the two it might be good to do. But if it's too complicated, then it's fine.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Indeed, I had thought about this - but I was a bit unsure about how to do it in a way that would allow for different behaviours depending on which component we are using the pagination from.

I have just pushed what I ended up coding - let me know what you think

Copy link
Member

@mircealungu mircealungu left a comment

Choose a reason for hiding this comment

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

cool stuff @tfnribeiro !

@mircealungu mircealungu merged commit acdefb8 into master Nov 25, 2024
3 of 4 checks passed
@mircealungu mircealungu deleted the 626-paginate-endless-scrolling-on-saves branch November 25, 2024 14:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Paginate / Endless Scrolling on saves
2 participants