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

Move screen options into each screen

Browse Source
This commit is contained in:
xmflsct
2022-12-03 16:50:54 +01:00
parent ddfd3a830d
commit 6a9f951dba
9 changed files with 203 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
src/screens/Tabs/Shared/Users.tsx
View File

@ -1,58 +1,57 @@
import ComponentAccount from '@components/Account'
import { HeaderLeft } from '@components/Header'
import ComponentSeparator from '@components/Separator'
import { TabSharedStackScreenProps } from '@utils/navigation/navigators'
import { QueryKeyUsers, useUsersQuery } from '@utils/queryHooks/users'
import React, { useCallback } from 'react'
import { StyleSheet } from 'react-native'
import React, { useCallback, useEffect } from 'react'
import { useTranslation } from 'react-i18next'
import { FlatList } from 'react-native-gesture-handler'
const TabSharedUsers = React.memo(
({ route: { params } }: TabSharedStackScreenProps<'Tab-Shared-Users'>) => {
const queryKey: QueryKeyUsers = ['Users', params]
const { data, hasNextPage, fetchNextPage, isFetchingNextPage } =
useUsersQuery({
...queryKey[1],
options: {
getPreviousPageParam: firstPage =>
firstPage.links?.prev && { since_id: firstPage.links.next },
getNextPageParam: lastPage =>
lastPage.links?.next && { max_id: lastPage.links.next }
}
})
const flattenData = data?.pages
? data.pages.flatMap(page => [...page.body])
: []
const TabSharedUsers: React.FC<TabSharedStackScreenProps<'Tab-Shared-Users'>> = ({
navigation,
route: { params }
}) => {
const { t } = useTranslation('screenTabs')
useEffect(() => {
navigation.setOptions({
title: t(`shared.users.${params.reference}.${params.type}`, { count: params.count }),
headerLeft: () => <HeaderLeft onPress={() => navigation.goBack()} />
})
}, [])
const onEndReached = useCallback(
() => hasNextPage && !isFetchingNextPage && fetchNextPage(),
[hasNextPage, isFetchingNextPage]
)
const queryKey: QueryKeyUsers = ['Users', params]
const { data, hasNextPage, fetchNextPage, isFetchingNextPage } = useUsersQuery({
...queryKey[1],
options: {
getPreviousPageParam: firstPage =>
firstPage.links?.prev && { since_id: firstPage.links.next },
getNextPageParam: lastPage => lastPage.links?.next && { max_id: lastPage.links.next }
}
})
const flattenData = data?.pages ? data.pages.flatMap(page => [...page.body]) : []
return (
<FlatList
windowSize={7}
data={flattenData}
style={styles.flatList}
renderItem={({ item }) => (
<ComponentAccount account={item} />
)}
onEndReached={onEndReached}
onEndReachedThreshold={0.75}
ItemSeparatorComponent={ComponentSeparator}
maintainVisibleContentPosition={{
minIndexForVisible: 0,
autoscrollToTopThreshold: 2
}}
/>
)
},
() => true
)
const onEndReached = useCallback(
() => hasNextPage && !isFetchingNextPage && fetchNextPage(),
[hasNextPage, isFetchingNextPage]
)
const styles = StyleSheet.create({
flatList: {
minHeight: '100%'
}
})
return (
<FlatList
windowSize={7}
data={flattenData}
style={{
minHeight: '100%'
}}
renderItem={({ item }) => <ComponentAccount account={item} />}
onEndReached={onEndReached}
onEndReachedThreshold={0.75}
ItemSeparatorComponent={ComponentSeparator}
maintainVisibleContentPosition={{
minIndexForVisible: 0,
autoscrollToTopThreshold: 2
}}
/>
)
}
export default TabSharedUsers