Guest User

Untitled

a guest
Jan 20th, 2019
78
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.78 KB | None | 0 0
  1. import { IJsonapiModel, IJsonapiView, Response } from 'datx-jsonapi';
  2. import { useEffect, useMemo, useState } from 'react';
  3.  
  4. interface IResponseWithNext<T extends IJsonapiModel> extends Response<T> {
  5. next: Promise<Response<T>>;
  6. }
  7.  
  8. function responseHasNext(response: IResponseWithNext<IJsonapiModel>): true;
  9. function responseHasNext(response?: Response<IJsonapiModel>): false;
  10. function responseHasNext(response?: Response<IJsonapiModel> | IResponseWithNext<IJsonapiModel>): boolean {
  11. return Boolean(
  12. response &&
  13. response.pageInfo &&
  14. typeof response.pageInfo.currentPage === 'number' &&
  15. typeof response.pageInfo.totalPages === 'number' &&
  16. response.pageInfo.currentPage < response.pageInfo.totalPages &&
  17. 'next' in response,
  18. );
  19. }
  20.  
  21. export const useInfiniteScroll = (view?: IJsonapiView) => {
  22. const [state, setState] = useState({
  23. latestResponse: view ? view.latestResponse : undefined,
  24. loading: false,
  25. view,
  26. });
  27.  
  28. if (view && view !== state.view) {
  29. setState((oldState) => ({ ...oldState, view }));
  30. }
  31. if (view && view.latestResponse !== state.latestResponse) {
  32. setState((oldState) => ({ ...oldState, latestResponse: view.latestResponse }));
  33. }
  34.  
  35. const loadMore = () => {
  36. if (state.view && responseHasNext(state.view.latestResponse) && !state.loading) {
  37. setState((oldState) => ({ ...oldState, loading: true }));
  38. (state.view.latestResponse as IResponseWithNext<IJsonapiModel>).next
  39. .then(() => {
  40. setState((oldState) => ({ ...oldState, loading: false }));
  41. }, () => {
  42. setState((oldState) => ({ ...oldState, loading: false }));
  43. });
  44. }
  45. };
  46.  
  47. return useMemo(() => ({
  48. hasMore: state.latestResponse ? responseHasNext(state.latestResponse) : false,
  49. loadMore,
  50. loading: state.loading,
  51. }), [state]);
  52. };
Add Comment
Please, Sign In to add comment