This commit is contained in:
Eric Bailey
2025-06-10 17:59:24 -05:00
parent 3247c7e28f
commit 6ac4b87dff
4 changed files with 65 additions and 36 deletions
+3 -3
View File
@@ -141,12 +141,12 @@ export function useFeedFeedback(
const sendInteraction = useCallback(
(interaction: AppBskyFeedDefs.Interaction) => {
logger.debug('sendInteraction', {
...interaction,
})
if (!enabled) {
return
}
logger.debug('sendInteraction', {
...interaction,
})
if (!history.current.has(interaction)) {
history.current.add(interaction)
queue.current.add(toString(interaction))
+18 -8
View File
@@ -1,5 +1,12 @@
import {createContext, useCallback, useContext, useRef, useState} from 'react'
import {type AppBskyFeedDefs,AtUri} from '@atproto/api'
import {
createContext,
useCallback,
useContext,
useId,
useRef,
useState,
} from 'react'
import {type AppBskyFeedDefs, AtUri} from '@atproto/api'
import {Logger} from '#/logger'
import {type FeedDescriptor} from '#/state/queries/post-feed'
@@ -12,7 +19,7 @@ const logger = Logger.create(Logger.Context.PostSource)
* and other ephemeral non-critical systems.
*/
type Source = {
export type Source = {
post: AppBskyFeedDefs.FeedViewPost
feed?: FeedDescriptor
}
@@ -21,9 +28,11 @@ const SetUnstablePostSourceContext = createContext<
(uri: string, source: Source) => void
>(() => {})
const ConsumeUnstablePostSourceContext = createContext<
(uri: string) => Source | undefined
(uri: string, id: string) => Source | undefined
>(() => undefined)
const persistentSourcesRef = new Map<string, Source>(new Map())
export function Provider({children}: {children: React.ReactNode}) {
const sourcesRef = useRef<Map<string, Source>>(new Map())
@@ -41,7 +50,7 @@ export function Provider({children}: {children: React.ReactNode}) {
sourcesRef.current.set(uri, source)
}, [])
const consumeUnstablePostSource = useCallback((uri: string) => {
const consumeUnstablePostSource = useCallback((uri: string, id: string) => {
if (__DEV__) {
const urip = new AtUri(uri)
if (urip.host.startsWith('did:')) {
@@ -51,11 +60,12 @@ export function Provider({children}: {children: React.ReactNode}) {
}
}
const source = sourcesRef.current.get(uri)
const source = persistentSourcesRef.get(id) || sourcesRef.current.get(uri)
if (source) {
logger.debug('consume', {uri, source})
sourcesRef.current.delete(uri)
persistentSourcesRef.set(id, source)
}
return source
@@ -80,9 +90,9 @@ export function useSetUnstablePostSource() {
* and other ephemeral non-critical systems. Does not change when the URI changes.
*/
export function useUnstablePostSource(uri: string) {
const id = useId()
const consume = useContext(ConsumeUnstablePostSourceContext)
const [source] = useState(() => consume(uri))
const [source] = useState(() => consume(uri, id))
return source
}
+25 -5
View File
@@ -22,6 +22,7 @@ import {ScrollProvider} from '#/lib/ScrollContext'
import {sanitizeDisplayName} from '#/lib/strings/display-names'
import {cleanError} from '#/lib/strings/errors'
import {isAndroid, isNative, isWeb} from '#/platform/detection'
import {useFeedFeedback} from '#/state/feed-feedback'
import {useModerationOpts} from '#/state/preferences/moderation-opts'
import {
fillThreadModerationCache,
@@ -37,6 +38,7 @@ import {useSetThreadViewPreferencesMutation} from '#/state/queries/preferences'
import {usePreferencesQuery} from '#/state/queries/preferences'
import {useSession} from '#/state/session'
import {useMergedThreadgateHiddenReplies} from '#/state/threadgate-hidden-replies'
import {useUnstablePostSource} from '#/state/unstable-post-source'
import {List, type ListMethods} from '#/view/com/util/List'
import {atoms as a, useTheme} from '#/alf'
import {Button, ButtonIcon} from '#/components/Button'
@@ -93,7 +95,7 @@ const keyExtractor = (item: RowItem) => {
return item._reactKey
}
export function PostThread({uri}: {uri: string | undefined}) {
export function PostThread({uri}: {uri: string}) {
const {hasSession, currentAccount} = useSession()
const {_} = useLingui()
const t = useTheme()
@@ -104,6 +106,8 @@ export function PostThread({uri}: {uri: string | undefined}) {
HiddenRepliesState.Hide,
)
const headerRef = React.useRef<View | null>(null)
const anchorPostSource = useUnstablePostSource(uri)
const feedFeedback = useFeedFeedback(anchorPostSource?.feed, hasSession)
const {data: preferences} = usePreferencesQuery()
const {
@@ -395,10 +399,18 @@ export function PostThread({uri}: {uri: string | undefined}) {
)
const {openComposer} = useOpenComposer()
const onPressReply = React.useCallback(() => {
const onReplyToAnchor = React.useCallback(() => {
if (thread?.type !== 'post') {
return
}
if (anchorPostSource) {
feedFeedback.sendInteraction({
item: thread.post.uri,
event: 'app.bsky.feed.defs#interactionReply',
feedContext: anchorPostSource.post.feedContext,
reqId: anchorPostSource.post.reqId,
})
}
openComposer({
replyTo: {
uri: thread.post.uri,
@@ -410,7 +422,14 @@ export function PostThread({uri}: {uri: string | undefined}) {
},
onPost: onPostReply,
})
}, [openComposer, thread, onPostReply, threadModerationCache])
}, [
openComposer,
thread,
onPostReply,
threadModerationCache,
anchorPostSource,
feedFeedback,
])
const canReply = !error && rootPost && !rootPost.viewer?.replyDisabled
const hasParents =
@@ -423,7 +442,7 @@ export function PostThread({uri}: {uri: string | undefined}) {
return (
<View>
{!isMobile && (
<PostThreadComposePrompt onPressCompose={onPressReply} />
<PostThreadComposePrompt onPressCompose={onReplyToAnchor} />
)}
</View>
)
@@ -511,6 +530,7 @@ export function PostThread({uri}: {uri: string | undefined}) {
}
onPostReply={onPostReply}
hideTopBorder={index === 0 && !item.ctx.isParentLoading}
anchorPostSource={anchorPostSource}
/>
</View>
)
@@ -586,7 +606,7 @@ export function PostThread({uri}: {uri: string | undefined}) {
/>
</ScrollProvider>
{isMobile && canReply && hasSession && (
<MobileComposePrompt onPressReply={onPressReply} />
<MobileComposePrompt onPressReply={onReplyToAnchor} />
)}
</>
)
+19 -20
View File
@@ -40,10 +40,7 @@ import {useLanguagePrefs} from '#/state/preferences'
import {type ThreadPost} from '#/state/queries/post-thread'
import {useSession} from '#/state/session'
import {useMergedThreadgateHiddenReplies} from '#/state/threadgate-hidden-replies'
import {
buildPostSourceUri,
useUnstablePostSource,
} from '#/state/unstable-post-source'
import {type Source} from '#/state/unstable-post-source'
import {PostThreadFollowBtn} from '#/view/com/post-thread/PostThreadFollowBtn'
import {ErrorMessage} from '#/view/com/util/error/ErrorMessage'
import {Link, TextLink} from '#/view/com/util/Link'
@@ -90,6 +87,7 @@ export function PostThreadItem({
onPostReply,
hideTopBorder,
threadgateRecord,
anchorPostSource,
}: {
post: AppBskyFeedDefs.PostView
record: AppBskyFeedPost.Record
@@ -107,6 +105,7 @@ export function PostThreadItem({
onPostReply: (postUri: string | undefined) => void
hideTopBorder?: boolean
threadgateRecord?: AppBskyFeedThreadgate.Record
anchorPostSource?: Source
}) {
const postShadowed = usePostShadow(post)
const richText = useMemo(
@@ -142,6 +141,7 @@ export function PostThreadItem({
onPostReply={onPostReply}
hideTopBorder={hideTopBorder}
threadgateRecord={threadgateRecord}
anchorPostSource={anchorPostSource}
/>
)
}
@@ -187,6 +187,7 @@ let PostThreadItemLoaded = ({
onPostReply,
hideTopBorder,
threadgateRecord,
anchorPostSource,
}: {
post: Shadow<AppBskyFeedDefs.PostView>
record: AppBskyFeedPost.Record
@@ -205,12 +206,10 @@ let PostThreadItemLoaded = ({
onPostReply: (postUri: string | undefined) => void
hideTopBorder?: boolean
threadgateRecord?: AppBskyFeedThreadgate.Record
anchorPostSource?: Source
}): React.ReactNode => {
const {currentAccount, hasSession} = useSession()
const source = useUnstablePostSource(
buildPostSourceUri(post.uri, post.author.handle),
)
const feedFeedback = useFeedFeedback(source?.feed, hasSession)
const feedFeedback = useFeedFeedback(anchorPostSource?.feed, hasSession)
const t = useTheme()
const pal = usePalette('default')
@@ -281,12 +280,12 @@ let PostThreadItemLoaded = ({
)
const onPressReply = () => {
if (source) {
if (anchorPostSource && isHighlightedPost) {
feedFeedback.sendInteraction({
item: post.uri,
event: 'app.bsky.feed.defs#interactionReply',
feedContext: source.post.feedContext,
reqId: source.post.reqId,
feedContext: anchorPostSource.post.feedContext,
reqId: anchorPostSource.post.reqId,
})
}
openComposer({
@@ -303,23 +302,23 @@ let PostThreadItemLoaded = ({
}
const onOpenAuthor = () => {
if (source) {
if (anchorPostSource) {
feedFeedback.sendInteraction({
item: post.uri,
event: 'app.bsky.feed.defs#clickthroughAuthor',
feedContext: source.post.feedContext,
reqId: source.post.reqId,
feedContext: anchorPostSource.post.feedContext,
reqId: anchorPostSource.post.reqId,
})
}
}
const onOpenEmbed = () => {
if (source) {
if (anchorPostSource) {
feedFeedback.sendInteraction({
item: post.uri,
event: 'app.bsky.feed.defs#clickthroughEmbed',
feedContext: source.post.feedContext,
reqId: source.post.reqId,
feedContext: anchorPostSource.post.feedContext,
reqId: anchorPostSource.post.reqId,
})
}
}
@@ -330,7 +329,7 @@ let PostThreadItemLoaded = ({
const {isActive: live} = useActorStatus(post.author)
const reason = source?.post.reason
const reason = anchorPostSource?.post.reason
const viaRepost = useMemo(() => {
if (AppBskyFeedDefs.isReasonRepost(reason) && reason.uri && reason.cid) {
return {
@@ -555,8 +554,8 @@ let PostThreadItemLoaded = ({
onPostReply={onPostReply}
logContext="PostThreadItem"
threadgateRecord={threadgateRecord}
feedContext={source?.post?.feedContext}
reqId={source?.post?.reqId}
feedContext={anchorPostSource?.post?.feedContext}
reqId={anchorPostSource?.post?.reqId}
viaRepost={viaRepost}
/>
</FeedFeedbackProvider>