diff --git a/src/components/Timeline.tsx b/src/components/Timeline.tsx index 546fae4e..9d899358 100644 --- a/src/components/Timeline.tsx +++ b/src/components/Timeline.tsx @@ -62,11 +62,15 @@ const Timeline: React.FC = ({ android: ['dataUpdatedAt', 'isFetching', 'isLoading'] }), getNextPageParam: lastPage => - lastPage?.links?.next && { max_id: lastPage.links.next } + lastPage?.links?.next && { + max_id: lastPage.links.next + } } }) - const flattenData = data?.pages ? data.pages.flatMap(d => [...d.body]) : [] + const flattenData = data?.pages + ? data.pages.flatMap(page => [...page.body]) + : [] const ItemSeparatorComponent = useCallback( ({ leadingItem }) => @@ -134,7 +138,7 @@ const Timeline: React.FC = ({ ref={customFLRef || flRef} scrollEventThrottle={16} onScroll={onScroll} - windowSize={8} + windowSize={10} data={flattenData} initialNumToRender={6} maxToRenderPerBatch={3} diff --git a/src/components/Timeline/Refresh.tsx b/src/components/Timeline/Refresh.tsx index c2b1ed9a..236f11c1 100644 --- a/src/components/Timeline/Refresh.tsx +++ b/src/components/Timeline/Refresh.tsx @@ -50,9 +50,9 @@ const TimelineRefresh: React.FC = ({ } const fetchingLatestIndex = useRef(0) + const refetchActive = useRef(false) const { - data, refetch, isFetching, isLoading, @@ -68,9 +68,17 @@ const TimelineRefresh: React.FC = ({ // https://github.com/facebook/react-native/issues/25239#issuecomment-731100372 limit: '5' }, + select: data => { + if (refetchActive.current) { + data.pageParams = [data.pageParams[0]] + data.pages = [data.pages[0]] + refetchActive.current = false + } + return data + }, onSuccess: () => { if (fetchingLatestIndex.current > 0) { - if (fetchingLatestIndex.current > 8) { + if (fetchingLatestIndex.current > 5) { clearFirstPage() fetchingLatestIndex.current = 0 } else { @@ -91,23 +99,41 @@ const TimelineRefresh: React.FC = ({ const { theme } = useTheme() const queryClient = useQueryClient() - const clearFirstPage = useCallback(() => { - if (data?.pages[0].body.length === 0) { - queryClient.setQueryData | undefined>( - queryKey, - data => { - if (data?.pages[0].body.length === 0) { - return { - pages: data.pages.slice(1), - pageParams: data.pageParams.slice(1) - } - } else { - return data + const clearFirstPage = () => { + queryClient.setQueryData | undefined>( + queryKey, + data => { + if (data?.pages[0].body.length === 0) { + return { + pages: data.pages.slice(1), + pageParams: data.pageParams.slice(1) } + } else { + return data } - ) - } - }, [data?.pages.length && data?.pages[0].body.length]) + } + ) + } + const prepareRefetch = () => { + refetchActive.current = true + queryClient.setQueryData | undefined>( + queryKey, + data => { + if (data) { + data.pageParams = [undefined] + const newFirstPage: TimelineData = { body: [] } + for (let page of data.pages) { + // @ts-ignore + newFirstPage.body.push(...page.body) + if (newFirstPage.body.length > 10) break + } + data.pages = [newFirstPage] + } + + return data + } + ) + } const [textRight, setTextRight] = useState(0) const arrowY = useAnimatedStyle(() => ({ @@ -178,9 +204,10 @@ const TimelineRefresh: React.FC = ({ }, [isFetching] ) - const wrapper = () => { + const wrapperStartLatest = () => { fetchingLatestIndex.current = 1 } + useAnimatedReaction( () => { return fetchingType.value @@ -189,12 +216,12 @@ const TimelineRefresh: React.FC = ({ fetchingType.value = 0 switch (data) { case 1: - runOnJS(wrapper)() + runOnJS(wrapperStartLatest)() runOnJS(clearFirstPage)() runOnJS(fetchPreviousPage)() break case 2: - runOnJS(clearFirstPage)() + runOnJS(prepareRefetch)() runOnJS(refetch)() break } diff --git a/src/screens/Tabs/Me/Settings/Tooot.tsx b/src/screens/Tabs/Me/Settings/Tooot.tsx index a810c044..b4328a76 100644 --- a/src/screens/Tabs/Me/Settings/Tooot.tsx +++ b/src/screens/Tabs/Me/Settings/Tooot.tsx @@ -39,7 +39,7 @@ const SettingsTooot: React.FC = () => { iconBack='ChevronRight' onPress={() => { analytics('settings_support_press') - Linking.openURL('https://www.patreon.com/xmflsct') + Linking.openURL('https://www.buymeacoffee.com/xmflsct') }} /> {__DEV__ ||