Remove a focus-effect that was triggering a rerender loop

zio/stable
Paul Frazee 2023-05-17 15:03:19 -05:00
parent 2fd3b4ca04
commit 0f5b3808f8
2 changed files with 18 additions and 21 deletions

View File

@ -13,12 +13,11 @@ import {UserAvatar} from '../util/UserAvatar'
import {Button} from '../util/forms/Button' import {Button} from '../util/forms/Button'
import {observer} from 'mobx-react-lite' import {observer} from 'mobx-react-lite'
import {CustomFeedModel} from 'state/models/feeds/custom-feed' import {CustomFeedModel} from 'state/models/feeds/custom-feed'
import {useFocusEffect, useNavigation} from '@react-navigation/native' import {useNavigation} from '@react-navigation/native'
import {NavigationProp} from 'lib/routes/types' import {NavigationProp} from 'lib/routes/types'
import {useStores} from 'state/index' import {useStores} from 'state/index'
import {pluralize} from 'lib/strings/helpers' import {pluralize} from 'lib/strings/helpers'
import {AtUri} from '@atproto/api' import {AtUri} from '@atproto/api'
import {isWeb} from 'platform/detection'
export const CustomFeed = observer( export const CustomFeed = observer(
({ ({
@ -26,26 +25,16 @@ export const CustomFeed = observer(
style, style,
showSaveBtn = false, showSaveBtn = false,
showLikes = false, showLikes = false,
reloadOnFocus = false,
}: { }: {
item: CustomFeedModel item: CustomFeedModel
style?: StyleProp<ViewStyle> style?: StyleProp<ViewStyle>
showSaveBtn?: boolean showSaveBtn?: boolean
showLikes?: boolean showLikes?: boolean
reloadOnFocus?: boolean
}) => { }) => {
const store = useStores() const store = useStores()
const pal = usePalette('default') const pal = usePalette('default')
const navigation = useNavigation<NavigationProp>() const navigation = useNavigation<NavigationProp>()
// TODO: this is pretty hacky, but it works for now
// causes issues on web
useFocusEffect(() => {
if (reloadOnFocus && !isWeb) {
item.reload()
}
})
return ( return (
<TouchableOpacity <TouchableOpacity
accessibilityRole="button" accessibilityRole="button"

View File

@ -170,20 +170,28 @@ export function PostEmbeds({
AppBskyEmbedRecord.isView(embed) && AppBskyEmbedRecord.isView(embed) &&
AppBskyFeedDefs.isGeneratorView(embed.record) AppBskyFeedDefs.isGeneratorView(embed.record)
) { ) {
// TODO memoize this? return <CustomFeedEmbed record={embed.record} />
return (
<CustomFeed
item={new CustomFeedModel(store, embed.record)}
style={[pal.view, pal.border, styles.customFeedOuter]}
reloadOnFocus
showLikes
/>
)
} }
return <View /> return <View />
} }
function CustomFeedEmbed({record}: {record: AppBskyFeedDefs.GeneratorView}) {
const pal = usePalette('default')
const store = useStores()
const item = React.useMemo(
() => new CustomFeedModel(store, record),
[store, record],
)
return (
<CustomFeed
item={item}
style={[pal.view, pal.border, styles.customFeedOuter]}
showLikes
/>
)
}
const styles = StyleSheet.create({ const styles = StyleSheet.create({
stackContainer: { stackContainer: {
gap: 6, gap: 6,