[🐴] Minor nits (#4102)
* set a better size for `initialNumToRender` * memo list items * scroll to end on both platforms * rev
This commit is contained in:
parent
5343910570
commit
1ac13abf4d
3 changed files with 18 additions and 6 deletions
|
@ -1,8 +1,8 @@
|
||||||
import React, {useCallback, useRef} from 'react'
|
import React, {useCallback, useRef} from 'react'
|
||||||
import {FlatList, View} from 'react-native'
|
import {FlatList, View} from 'react-native'
|
||||||
import Animated, {
|
import Animated, {
|
||||||
dispatchCommand,
|
|
||||||
runOnJS,
|
runOnJS,
|
||||||
|
scrollTo,
|
||||||
useAnimatedKeyboard,
|
useAnimatedKeyboard,
|
||||||
useAnimatedReaction,
|
useAnimatedReaction,
|
||||||
useAnimatedRef,
|
useAnimatedRef,
|
||||||
|
@ -229,9 +229,14 @@ export function MessagesList({
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
// Only call this on every frame while _opening_ the keyboard
|
// We are setting some arbitrarily high number here to ensure that we end up scrolling to the bottom. There is not
|
||||||
|
// any other way to synchronously scroll to the bottom of the list, since we cannot get the content size of the
|
||||||
|
// scrollview synchronously.
|
||||||
|
// On iOS we could have used `dispatchCommand('scrollToEnd', [])` since the underlying view has a `scrollToEnd`
|
||||||
|
// method. It doesn't exist on Android though. That's probably why `scrollTo` which is implemented in Reanimated
|
||||||
|
// doesn't support a `scrollToEnd`.
|
||||||
if (prev && now > 0 && now >= prev) {
|
if (prev && now > 0 && now >= prev) {
|
||||||
dispatchCommand(flatListRef, 'scrollToEnd', [false])
|
scrollTo(flatListRef, 0, 1e7, false)
|
||||||
}
|
}
|
||||||
|
|
||||||
// We want to store the full keyboard height after it fully opens so we can make some
|
// We want to store the full keyboard height after it fully opens so we can make some
|
||||||
|
|
|
@ -25,12 +25,17 @@ import {Bell2Off_Filled_Corner0_Rounded as BellStroke} from '#/components/icons/
|
||||||
import {useMenuControl} from '#/components/Menu'
|
import {useMenuControl} from '#/components/Menu'
|
||||||
import {Text} from '#/components/Typography'
|
import {Text} from '#/components/Typography'
|
||||||
|
|
||||||
export function ChatListItem({convo}: {convo: ChatBskyConvoDefs.ConvoView}) {
|
export let ChatListItem = ({
|
||||||
|
convo,
|
||||||
|
}: {
|
||||||
|
convo: ChatBskyConvoDefs.ConvoView
|
||||||
|
}): React.ReactNode => {
|
||||||
const {currentAccount} = useSession()
|
const {currentAccount} = useSession()
|
||||||
|
const moderationOpts = useModerationOpts()
|
||||||
|
|
||||||
const otherUser = convo.members.find(
|
const otherUser = convo.members.find(
|
||||||
member => member.did !== currentAccount?.did,
|
member => member.did !== currentAccount?.did,
|
||||||
)
|
)
|
||||||
const moderationOpts = useModerationOpts()
|
|
||||||
|
|
||||||
if (!otherUser || !moderationOpts) {
|
if (!otherUser || !moderationOpts) {
|
||||||
return null
|
return null
|
||||||
|
@ -45,6 +50,8 @@ export function ChatListItem({convo}: {convo: ChatBskyConvoDefs.ConvoView}) {
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ChatListItem = React.memo(ChatListItem)
|
||||||
|
|
||||||
function ChatListItemReady({
|
function ChatListItemReady({
|
||||||
convo,
|
convo,
|
||||||
profile: profileUnshadowed,
|
profile: profileUnshadowed,
|
||||||
|
|
|
@ -73,7 +73,7 @@ export function MessagesScreen({navigation, route}: Props) {
|
||||||
)
|
)
|
||||||
}, [_, t])
|
}, [_, t])
|
||||||
|
|
||||||
const initialNumToRender = useInitialNumToRender()
|
const initialNumToRender = useInitialNumToRender(80)
|
||||||
const [isPTRing, setIsPTRing] = useState(false)
|
const [isPTRing, setIsPTRing] = useState(false)
|
||||||
|
|
||||||
const {
|
const {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue