octo/tooot
1
0
Fork 0
mirror of https://github.com/tooot-app/app synced 2025-06-05 22:19:13 +02:00
Code Issues Projects Releases Wiki Activity

Try out FlashList

Browse Source
This commit is contained in:
xmflsct
2023-01-06 01:41:46 +01:00
parent bd3046cc2f
commit 8406a57143
13 changed files with 146 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/screens/Tabs/Shared/Toot.tsx
View File

@ -3,6 +3,7 @@ import Icon from '@components/Icon'
import ComponentSeparator from '@components/Separator'
import CustomText from '@components/Text'
import TimelineDefault from '@components/Timeline/Default'
import { FlashList } from '@shopify/flash-list'
import { useQuery } from '@tanstack/react-query'
import apiGeneral from '@utils/api/general'
import apiInstance from '@utils/api/instance'
@ -15,7 +16,7 @@ import { StyleConstants } from '@utils/styles/constants'
import { useTheme } from '@utils/styles/ThemeManager'
import React, { useEffect, useRef, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { Alert, FlatList, Pressable, View } from 'react-native'
import { Alert, Pressable, View } from 'react-native'
import { Circle } from 'react-native-animated-spinkit'
import { Path, Svg } from 'react-native-svg'
@ -69,7 +70,7 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
navigation.setParams({ toot, queryKey: queryKey.local })
}, [hasRemoteContent])
const flRef = useRef<FlatList>(null)
const flRef = useRef<FlashList<Mastodon.Status>>(null)
const scrolled = useRef(false)
const match = urlMatcher(toot.url || toot.uri)
@ -258,14 +259,13 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
const ARC = StyleConstants.Avatar.XS / 4
return (
<FlatList
<FlashList
ref={flRef}
scrollEventThrottle={16}
windowSize={7}
estimatedItemSize={100}
data={query.data.pages?.[0].body}
renderItem={({ item, index }) => {
const prev = query.data.pages[0].body[index - 1]?._level || 0
const curr = item._level
const curr = item._level || 0
const next = query.data.pages[0].body[index + 1]?._level || 0
return (
@ -273,7 +273,7 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
style={{
paddingLeft:
index > highlightIndex.current
? Math.min(item._level - 1, MAX_LEVEL) * StyleConstants.Spacing.S
? Math.min((item._level || 0) - 1, MAX_LEVEL) * StyleConstants.Spacing.S
: undefined
}}
onLayout={({
@ -386,8 +386,6 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
</View>
)
}}
initialNumToRender={6}
maxToRenderPerBatch={3}
ItemSeparatorComponent={({ leadingItem }) => {
return (
<>
@ -416,21 +414,6 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
</>
)
}}
onScrollToIndexFailed={error => {
const offset = error.averageItemLength * error.index
flRef.current?.scrollToOffset({ offset })
try {
error.index < query.data.pages[0].body.length &&
setTimeout(
() =>
flRef.current?.scrollToIndex({
index: error.index,
viewOffset: 100
}),
500
)
} catch {}
}}
ListFooterComponent={
<View
style={{