refactor(feed): remove NoSnippetWrapper from FeedPage in favor of dataSet attribute
Replaces NoSnippetWrapper with a dataSet prop on the root View to control the nosnippet attribute for discover feeds. This simplifies the component structure and improves maintainability by reducing unnecessary wrappers.
This commit is contained in:
@@ -18,8 +18,11 @@ import {listenSoftReset} from '#/state/events'
|
||||
import {FeedFeedbackProvider, useFeedFeedback} from '#/state/feed-feedback'
|
||||
import {useSetHomeBadge} from '#/state/home-badge'
|
||||
import {type FeedSourceInfo} from '#/state/queries/feed'
|
||||
import {RQKEY as FEED_RQKEY} from '#/state/queries/post-feed'
|
||||
import {type FeedDescriptor, type FeedParams} from '#/state/queries/post-feed'
|
||||
import {
|
||||
type FeedDescriptor,
|
||||
type FeedParams,
|
||||
RQKEY as FEED_RQKEY,
|
||||
} from '#/state/queries/post-feed'
|
||||
import {truncateAndInvalidate} from '#/state/queries/util'
|
||||
import {useSession} from '#/state/session'
|
||||
import {useSetMinimalShellMode} from '#/state/shell'
|
||||
@@ -29,7 +32,6 @@ import {FAB} from '../util/fab/FAB'
|
||||
import {type ListMethods} from '../util/List'
|
||||
import {LoadLatestBtn} from '../util/load-latest/LoadLatestBtn'
|
||||
import {MainScrollProvider} from '../util/MainScrollProvider'
|
||||
import {NoSnippetWrapper} from '../util/NoSnippetWrapper'
|
||||
|
||||
const POLL_FREQ = 60e3 // 60sec
|
||||
|
||||
@@ -133,49 +135,48 @@ export function FeedPage({
|
||||
|
||||
const shouldPrefetch = isNative && isPageAdjacent
|
||||
return (
|
||||
<NoSnippetWrapper enabled={isDiscoverFeed}>
|
||||
<View testID={testID}>
|
||||
<MainScrollProvider>
|
||||
<FeedFeedbackProvider value={feedFeedback}>
|
||||
<PostFeed
|
||||
testID={testID ? `${testID}-feed` : undefined}
|
||||
enabled={isPageFocused || shouldPrefetch}
|
||||
feed={feed}
|
||||
feedParams={feedParams}
|
||||
pollInterval={POLL_FREQ}
|
||||
disablePoll={hasNew || !isPageFocused}
|
||||
scrollElRef={scrollElRef}
|
||||
onScrolledDownChange={setIsScrolledDown}
|
||||
onHasNew={setHasNew}
|
||||
renderEmptyState={renderEmptyState}
|
||||
renderEndOfFeed={renderEndOfFeed}
|
||||
headerOffset={headerOffset}
|
||||
savedFeedConfig={savedFeedConfig}
|
||||
isVideoFeed={isVideoFeed}
|
||||
/>
|
||||
</FeedFeedbackProvider>
|
||||
</MainScrollProvider>
|
||||
{(isScrolledDown || hasNew) && (
|
||||
<LoadLatestBtn
|
||||
onPress={onPressLoadLatest}
|
||||
label={_(msg`Load new posts`)}
|
||||
showIndicator={hasNew}
|
||||
<View
|
||||
testID={testID}
|
||||
// @ts-expect-error web only -sfn
|
||||
dataSet={{nosnippet: isDiscoverFeed ? '' : undefined}}>
|
||||
<MainScrollProvider>
|
||||
<FeedFeedbackProvider value={feedFeedback}>
|
||||
<PostFeed
|
||||
testID={testID ? `${testID}-feed` : undefined}
|
||||
enabled={isPageFocused || shouldPrefetch}
|
||||
feed={feed}
|
||||
feedParams={feedParams}
|
||||
pollInterval={POLL_FREQ}
|
||||
disablePoll={hasNew || !isPageFocused}
|
||||
scrollElRef={scrollElRef}
|
||||
onScrolledDownChange={setIsScrolledDown}
|
||||
onHasNew={setHasNew}
|
||||
renderEmptyState={renderEmptyState}
|
||||
renderEndOfFeed={renderEndOfFeed}
|
||||
headerOffset={headerOffset}
|
||||
savedFeedConfig={savedFeedConfig}
|
||||
isVideoFeed={isVideoFeed}
|
||||
/>
|
||||
)}
|
||||
</FeedFeedbackProvider>
|
||||
</MainScrollProvider>
|
||||
{(isScrolledDown || hasNew) && (
|
||||
<LoadLatestBtn
|
||||
onPress={onPressLoadLatest}
|
||||
label={_(msg`Load new posts`)}
|
||||
showIndicator={hasNew}
|
||||
/>
|
||||
)}
|
||||
|
||||
{hasSession && (
|
||||
<FAB
|
||||
testID="composeFAB"
|
||||
onPress={onPressCompose}
|
||||
icon={<ComposeIcon2 strokeWidth={1.5} size={29} style={s.white} />}
|
||||
accessibilityRole="button"
|
||||
accessibilityLabel={_(
|
||||
msg({message: `New post`, context: 'action'}),
|
||||
)}
|
||||
accessibilityHint=""
|
||||
/>
|
||||
)}
|
||||
</View>
|
||||
</NoSnippetWrapper>
|
||||
{hasSession && (
|
||||
<FAB
|
||||
testID="composeFAB"
|
||||
onPress={onPressCompose}
|
||||
icon={<ComposeIcon2 strokeWidth={1.5} size={29} style={s.white} />}
|
||||
accessibilityRole="button"
|
||||
accessibilityLabel={_(msg({message: `New post`, context: 'action'}))}
|
||||
accessibilityHint=""
|
||||
/>
|
||||
)}
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,29 +0,0 @@
|
||||
import {type ViewProps} from 'react-native'
|
||||
// @ts-expect-error untyped
|
||||
import {unstable_createElement} from 'react-native-web'
|
||||
|
||||
import {isWeb} from '#/platform/detection'
|
||||
|
||||
interface Props extends ViewProps {
|
||||
enabled: boolean
|
||||
}
|
||||
|
||||
/**
|
||||
* NoSnippetWrapper prevents search engines from displaying snippets of its content.
|
||||
*
|
||||
* If running on web and enabled, wraps children in a <div> with data-nosnippet attribute.
|
||||
* Otherwise, renders children directly.
|
||||
*
|
||||
* @param enabled - Whether to apply the data-nosnippet attribute.
|
||||
* @param viewProps - Additional props for the wrapper element.
|
||||
*/
|
||||
export function NoSnippetWrapper({enabled, ...viewProps}: Props) {
|
||||
if (isWeb && enabled) {
|
||||
return unstable_createElement('div', {
|
||||
...viewProps,
|
||||
'data-nosnippet': '',
|
||||
})
|
||||
}
|
||||
|
||||
return <>{viewProps.children}</>
|
||||
}
|
||||
Reference in New Issue
Block a user