Skip to content

Commit

Permalink
fix: load new data when you scroll to the bottom of the list
Browse files Browse the repository at this point in the history
- added `fetchMoreData` function to load new data when scrolling to the bottom of the list
- deleted `horizontal` and `showBackToTop` props because they are non-functional

SVA-665
  • Loading branch information
ardasnturk committed Jun 28, 2023
1 parent 6dd528d commit 2a84d59
Showing 1 changed file with 20 additions and 4 deletions.
24 changes: 20 additions & 4 deletions src/components/Calendar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import { SettingsContext } from '../SettingsProvider';
import { colors, consts, normalize, texts } from '../config';
import { graphqlFetchPolicy, parseListItemsFromQuery } from '../helpers';
import { setupLocales } from '../helpers/calendarHelper';
import { QUERY_TYPES, getQuery } from '../queries';
import { QUERY_TYPES, getFetchMoreQuery, getQuery } from '../queries';
import { ScreenName, Calendar as TCalendar } from '../types';

import { EmptyMessage } from './EmptyMessage';
Expand Down Expand Up @@ -92,12 +92,29 @@ export const Calendar = ({ query, queryVariables, calendarData, isLoading, navig
getMarkedDates(calendarData, dotCount, today)
);

const { data, loading, refetch } = useQuery(getQuery(QUERY_TYPES.EVENT_RECORDS), {
const { data, loading, refetch, fetchMore } = useQuery(getQuery(QUERY_TYPES.EVENT_RECORDS), {
fetchPolicy,
variables: queryVariableWithDateRange,
skip: !subList
});

const fetchMoreData = () =>
fetchMore({
query: getFetchMoreQuery(query),
variables: {
...queryVariableWithDateRange,
offset: data?.[query]?.length
},
updateQuery: (prevResult, { fetchMoreResult }) => {
if (!fetchMoreResult || !fetchMoreResult[query].length) return prevResult;

return {
...prevResult,
[query]: [...prevResult[query], ...fetchMoreResult[query]]
};
}
});

const onDayPress = useCallback(
async (day: DateData) => {
if (query === QUERY_TYPES.EVENT_RECORDS) {
Expand Down Expand Up @@ -161,7 +178,7 @@ export const Calendar = ({ query, queryVariables, calendarData, isLoading, navig
{subList && (
<ListComponent
data={loading ? [] : buildListItems(data)}
horizontal={false}
fetchMoreData={fetchMoreData}
ListEmptyComponent={
loading ? (
<LoadingContainer>
Expand All @@ -176,7 +193,6 @@ export const Calendar = ({ query, queryVariables, calendarData, isLoading, navig
query={query}
queryVariables={queryVariables}
sectionByDate
showBackToTop
/>
)}
</>
Expand Down

0 comments on commit 2a84d59

Please sign in to comment.