octo/tooot
octo
/
tooot
mirror of https://github.com/tooot-app/app
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Use placeholder data instead of initial data

This commit is contained in:
xmflsct 2023-01-07 13:08:33 +01:00
parent 23a8c03be2
commit fb9b7486d0
1 changed files with 12 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -74,7 +74,7 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
const match = urlMatcher(toot.url || toot.uri) const match = urlMatcher(toot.url || toot.uri)
const highlightIndex = useRef<number>(0) const highlightIndex = useRef<number>(0)
const query = useQuery<{ pages: { body: (Mastodon.Status & { key?: 'cached' })[] }[] }>( const query = useQuery<{ pages: { body: Mastodon.Status[] }[] }>(
queryKey.local, queryKey.local,
async () => { async () => {
const context = await apiInstance<{ const context = await apiInstance<{
@ -108,7 +108,7 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
} }
}, },
{ {
initialData: { pages: [{ body: [{ ...toot, _level: 0, key: 'cached' }] }] }, placeholderData: { pages: [{ body: [toot] }] },
enabled: !toot._remote, enabled: !toot._remote,
staleTime: 0, staleTime: 0,
refetchOnMount: true, refetchOnMount: true,
@ -188,12 +188,12 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
staleTime: 0, staleTime: 0,
refetchOnMount: true, refetchOnMount: true,
onSuccess: data => { onSuccess: data => {
if (query.data.pages[0].body.length < 1 && data.length < 1) { if ((query.data?.pages[0].body.length || 0) < 1 && data.length < 1) {
navigation.goBack() navigation.goBack()
return return
} }
if (query.data.pages[0].body.length < data.length) { if ((query.data?.pages[0].body.length || 0) < data.length) {
queryClient.cancelQueries(queryKey.local) queryClient.cancelQueries(queryKey.local)
queryClient.setQueryData<{ queryClient.setQueryData<{
pages: { body: Mastodon.Status[] }[] pages: { body: Mastodon.Status[] }[]
@ -205,11 +205,10 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
pages: [ pages: [
{ {
body: data.map(remote => { body: data.map(remote => {
const localMatch = query.data.pages[0].body.find( const localMatch = query.data?.pages[0].body.find(
local => local.uri === remote.uri local => local.uri === remote.uri
) )
if (localMatch) { if (localMatch) {
delete localMatch.key
return { ...localMatch, _level: remote._level } return { ...localMatch, _level: remote._level }
} else { } else {
return { return {
@ -269,9 +268,9 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
windowSize={7} windowSize={7}
data={query.data?.pages?.[0].body} data={query.data?.pages?.[0].body}
renderItem={({ item, index }) => { renderItem={({ item, index }) => {
const prev = query.data.pages[0].body[index - 1]?._level || 0 const prev = query.data?.pages[0].body[index - 1]?._level || 0
const curr = item._level const curr = item._level
const next = query.data.pages[0].body[index + 1]?._level || 0 const next = query.data?.pages[0].body[index + 1]?._level || 0
return ( return (
<View <View
@ -376,8 +375,8 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
} }
}) })
: null} : null}
<CustomText {/* <CustomText
children={query.data.pages[0].body[index - 1]?._level} children={query.data?.pages[0].body[index - 1]?._level}
style={{ position: 'absolute', top: 4, left: 4, color: colors.red }} style={{ position: 'absolute', top: 4, left: 4, color: colors.red }}
/> />
<CustomText <CustomText
@ -385,9 +384,9 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
style={{ position: 'absolute', top: 20, left: 4, color: colors.yellow }} style={{ position: 'absolute', top: 20, left: 4, color: colors.yellow }}
/> />
<CustomText <CustomText
children={query.data.pages[0].body[index + 1]?._level} children={query.data?.pages[0].body[index + 1]?._level}
style={{ position: 'absolute', top: 36, left: 4, color: colors.green }} style={{ position: 'absolute', top: 36, left: 4, color: colors.green }}
/> /> */}
</View> </View>
) )
}} }}
@ -425,7 +424,7 @@ const TabSharedToot: React.FC<TabSharedStackScreenProps<'Tab-Shared-Toot'>> = ({
const offset = error.averageItemLength * error.index const offset = error.averageItemLength * error.index
flRef.current?.scrollToOffset({ offset }) flRef.current?.scrollToOffset({ offset })
try { try {
error.index < query.data.pages[0].body.length && error.index < (query.data?.pages[0].body.length || 0) &&
setTimeout( setTimeout(
() => () =>
flRef.current?.scrollToIndex({ flRef.current?.scrollToIndex({