diff --git a/src/App.native.tsx b/src/App.native.tsx
index 80e7d57f32..25d186dcfb 100644
--- a/src/App.native.tsx
+++ b/src/App.native.tsx
@@ -58,7 +58,6 @@ import {Provider as ProgressGuideProvider} from '#/state/shell/progress-guide'
import {Provider as SelectedFeedProvider} from '#/state/shell/selected-feed'
import {Provider as StarterPackProvider} from '#/state/shell/starter-pack'
import {Provider as HiddenRepliesProvider} from '#/state/threadgate-hidden-replies'
-import {Provider as UnstablePostSourceProvider} from '#/state/unstable-post-source'
import {TestCtrls} from '#/view/com/testing/TestCtrls'
import {Provider as VideoVolumeProvider} from '#/view/com/util/post-embeds/VideoVolumeContext'
import * as Toast from '#/view/com/util/Toast'
@@ -152,18 +151,16 @@ function InnerApp() {
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
diff --git a/src/App.web.tsx b/src/App.web.tsx
index ca23d0c668..fa8e24e53d 100644
--- a/src/App.web.tsx
+++ b/src/App.web.tsx
@@ -48,7 +48,6 @@ import {Provider as ProgressGuideProvider} from '#/state/shell/progress-guide'
import {Provider as SelectedFeedProvider} from '#/state/shell/selected-feed'
import {Provider as StarterPackProvider} from '#/state/shell/starter-pack'
import {Provider as HiddenRepliesProvider} from '#/state/threadgate-hidden-replies'
-import {Provider as UnstablePostSourceProvider} from '#/state/unstable-post-source'
import {Provider as ActiveVideoProvider} from '#/view/com/util/post-embeds/ActiveVideoWebContext'
import {Provider as VideoVolumeProvider} from '#/view/com/util/post-embeds/VideoVolumeContext'
import * as Toast from '#/view/com/util/Toast'
@@ -133,14 +132,12 @@ function InnerApp() {
-
-
-
-
-
-
-
-
+
+
+
+
+
+
diff --git a/src/components/Link.tsx b/src/components/Link.tsx
index d73a3db4ae..49c9c52358 100644
--- a/src/components/Link.tsx
+++ b/src/components/Link.tsx
@@ -4,7 +4,6 @@ import {sanitizeUrl} from '@braintree/sanitize-url'
import {
type LinkProps as RNLinkProps,
StackActions,
- useLinkBuilder,
} from '@react-navigation/native'
import {BSKY_DOWNLOAD_URL} from '#/lib/constants'
@@ -95,20 +94,19 @@ export function useLink({
shouldProxy?: boolean
}) {
const navigation = useNavigationDeduped()
- const {buildHref} = useLinkBuilder()
const href = useMemo(() => {
return typeof to === 'string'
? convertBskyAppUrlIfNeeded(sanitizeUrl(to))
: to.screen
- ? buildHref(to.screen, to.params)
+ ? router.matchName(to.screen)?.build(to.params)
: to.href
? convertBskyAppUrlIfNeeded(sanitizeUrl(to.href))
: undefined
- }, [to, buildHref])
+ }, [to])
if (!href) {
throw new Error(
- 'Link `to` prop must be a string or an object with `screen` and `params` properties',
+ 'Could not resolve screen. Link `to` prop must be a string or an object with `screen` and `params` properties',
)
}
diff --git a/src/lib/routes/router.ts b/src/lib/routes/router.ts
index 45f9c85fdb..ba76b1bdac 100644
--- a/src/lib/routes/router.ts
+++ b/src/lib/routes/router.ts
@@ -1,4 +1,4 @@
-import {Route, RouteParams} from './types'
+import {type Route, type RouteParams} from './types'
export class Router {
routes: [string, Route][] = []
@@ -45,7 +45,7 @@ function createRoute(pattern: string): Route {
})
const matcherRe = new RegExp(`^${matcherReInternal}([?]|$)`, 'i')
return {
- match(path: string) {
+ match(path) {
const {pathname, searchParams} = new URL(path, 'http://throwaway.com')
const addedParams = Object.fromEntries(searchParams.entries())
@@ -55,10 +55,10 @@ function createRoute(pattern: string): Route {
}
return undefined
},
- build(params: Record) {
+ build(params = {}) {
const str = pattern.replace(
/:([\w]+)/g,
- (_m, name) => params[name] || 'undefined',
+ (_m, name) => params[encodeURIComponent(name)] || 'undefined',
)
let hasQp = false
diff --git a/src/lib/routes/types.ts b/src/lib/routes/types.ts
index 6f102d438a..f587423900 100644
--- a/src/lib/routes/types.ts
+++ b/src/lib/routes/types.ts
@@ -143,5 +143,5 @@ export type RouteParams = Record
export type MatchResult = {params: RouteParams}
export type Route = {
match: (path: string) => MatchResult | undefined
- build: (params: RouteParams) => string
+ build: (params?: Record) => string
}
diff --git a/src/logger/types.ts b/src/logger/types.ts
index d14e21a9d4..88d8d9d93d 100644
--- a/src/logger/types.ts
+++ b/src/logger/types.ts
@@ -10,6 +10,8 @@ export enum LogContext {
ConversationAgent = 'conversation-agent',
DMsAgent = 'dms-agent',
ReportDialog = 'report-dialog',
+ FeedFeedback = 'feed-feedback',
+ PostSource = 'post-source',
/**
* METRIC IS FOR INTERNAL USE ONLY, don't create any other loggers using this
diff --git a/src/state/feed-feedback.tsx b/src/state/feed-feedback.tsx
index 225b495d3f..a718a761d5 100644
--- a/src/state/feed-feedback.tsx
+++ b/src/state/feed-feedback.tsx
@@ -12,7 +12,7 @@ import throttle from 'lodash.throttle'
import {FEEDBACK_FEEDS, STAGING_FEEDS} from '#/lib/constants'
import {logEvent} from '#/lib/statsig/statsig'
-import {logger} from '#/logger'
+import {Logger} from '#/logger'
import {
type FeedDescriptor,
type FeedPostSliceItem,
@@ -20,6 +20,8 @@ import {
import {getItemsForFeedback} from '#/view/com/posts/PostFeed'
import {useAgent} from './session'
+const logger = Logger.create(Logger.Context.FeedFeedback)
+
export type StateContext = {
enabled: boolean
onItemSeen: (item: any) => void
@@ -89,6 +91,7 @@ export function useFeedFeedback(
}
sendOrAggregateInteractionsForStats(aggregatedStats.current, interactions)
throttledFlushAggregatedStats()
+ logger.debug('flushed')
}, [agent, throttledFlushAggregatedStats, feed])
const sendToFeed = useMemo(
@@ -141,6 +144,9 @@ export function useFeedFeedback(
if (!enabled) {
return
}
+ logger.debug('sendInteraction', {
+ ...interaction,
+ })
if (!history.current.has(interaction)) {
history.current.add(interaction)
queue.current.add(toString(interaction))
diff --git a/src/state/unstable-post-source.tsx b/src/state/unstable-post-source.tsx
index 43aac6f4d0..ac126d79c6 100644
--- a/src/state/unstable-post-source.tsx
+++ b/src/state/unstable-post-source.tsx
@@ -1,62 +1,97 @@
-import {createContext, useCallback, useContext, useRef, useState} from 'react'
-import {type AppBskyFeedDefs} from '@atproto/api'
+import {useEffect, useId, useState} from 'react'
+import {type AppBskyFeedDefs, AtUri} from '@atproto/api'
-import {type FeedDescriptor} from './queries/post-feed'
+import {Logger} from '#/logger'
+import {type FeedDescriptor} from '#/state/queries/post-feed'
/**
- * For passing the source of the post (i.e. the original post, from the feed) to the threadview,
- * without using query params. Deliberately unstable to avoid using query params, use for FeedFeedback
- * and other ephemeral non-critical systems.
+ * Separate logger for better debugging
*/
+const logger = Logger.create(Logger.Context.PostSource)
-type Source = {
+export type PostSource = {
post: AppBskyFeedDefs.FeedViewPost
feed?: FeedDescriptor
}
-const SetUnstablePostSourceContext = createContext<
- (key: string, source: Source) => void
->(() => {})
-const ConsumeUnstablePostSourceContext = createContext<
- (uri: string) => Source | undefined
->(() => undefined)
+/**
+ * A cache of sources that will be consumed by the post thread view. This is
+ * cleaned up any time a source is consumed.
+ */
+const transientSources = new Map()
-export function Provider({children}: {children: React.ReactNode}) {
- const sourcesRef = useRef>(new Map())
+/**
+ * A cache of sources that have been consumed by the post thread view. This is
+ * not cleaned up, but because we use a new ID for each post thread view that
+ * consumes a source, this is never reused unless a user navigates back to a
+ * post thread view that has not been dropped from memory.
+ */
+const consumedSources = new Map()
- const setUnstablePostSource = useCallback((key: string, source: Source) => {
- sourcesRef.current.set(key, source)
- }, [])
-
- const consumeUnstablePostSource = useCallback((uri: string) => {
- const source = sourcesRef.current.get(uri)
- if (source) {
- sourcesRef.current.delete(uri)
- }
- return source
- }, [])
-
- return (
-
-
- {children}
-
-
+/**
+ * For stashing the feed that the user was browsing when they clicked on a post.
+ *
+ * Used for FeedFeedback and other ephemeral non-critical systems.
+ */
+export function setUnstablePostSource(key: string, source: PostSource) {
+ assertValid(
+ key,
+ `setUnstablePostSource key should be a URI containing a handle, received ${key} — use buildPostSourceKey`,
)
-}
-
-export function useSetUnstablePostSource() {
- return useContext(SetUnstablePostSourceContext)
+ logger.debug('set', {key, source})
+ transientSources.set(key, source)
}
/**
- * DANGER - This hook is unstable and should only be used for FeedFeedback
- * and other ephemeral non-critical systems. Does not change when the URI changes.
+ * This hook is unstable and should only be used for FeedFeedback and other
+ * ephemeral non-critical systems. Views that use this hook will continue to
+ * return a reference to the same source until those views are dropped from
+ * memory.
*/
-export function useUnstablePostSource(uri: string) {
- const consume = useContext(ConsumeUnstablePostSourceContext)
+export function useUnstablePostSource(key: string) {
+ const id = useId()
+ const [source] = useState(() => {
+ assertValid(
+ key,
+ `consumeUnstablePostSource key should be a URI containing a handle, received ${key} — use buildPostSourceKey`,
+ )
+ const source = consumedSources.get(id) || transientSources.get(key)
+ if (source) {
+ logger.debug('consume', {id, key, source})
+ transientSources.delete(key)
+ consumedSources.set(id, source)
+ }
+ return source
+ })
+
+ useEffect(() => {
+ return () => {
+ consumedSources.delete(id)
+ logger.debug('cleanup', {id})
+ }
+ }, [id])
- const [source] = useState(() => consume(uri))
return source
}
+
+/**
+ * Builds a post source key. This (atm) is a URI where the `host` is the post
+ * author's handle, not DID.
+ */
+export function buildPostSourceKey(key: string, handle: string) {
+ const urip = new AtUri(key)
+ urip.host = handle
+ return urip.toString()
+}
+
+/**
+ * Just a lil dev helper
+ */
+function assertValid(key: string, message: string) {
+ if (__DEV__) {
+ const urip = new AtUri(key)
+ if (urip.host.startsWith('did:')) {
+ throw new Error(message)
+ }
+ }
+}
diff --git a/src/view/com/home/HomeHeaderLayoutMobile.tsx b/src/view/com/home/HomeHeaderLayoutMobile.tsx
index e48c2cc893..7a40604f43 100644
--- a/src/view/com/home/HomeHeaderLayoutMobile.tsx
+++ b/src/view/com/home/HomeHeaderLayoutMobile.tsx
@@ -1,4 +1,3 @@
-import React from 'react'
import {View} from 'react-native'
import Animated from 'react-native-reanimated'
import {msg} from '@lingui/macro'
@@ -56,13 +55,8 @@ export function HomeHeaderLayoutMobile({
{
- emitSoftReset()
- }}
- onPressIn={() => {
- playHaptic('Heavy')
- }}
- onPressOut={() => {
playHaptic('Light')
+ emitSoftReset()
}}>
@@ -72,7 +66,7 @@ export function HomeHeaderLayoutMobile({
{hasSession && (
diff --git a/src/view/com/post-thread/PostThread.tsx b/src/view/com/post-thread/PostThread.tsx
index 3d1a15c7aa..94cc04f542 100644
--- a/src/view/com/post-thread/PostThread.tsx
+++ b/src/view/com/post-thread/PostThread.tsx
@@ -19,6 +19,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,
@@ -35,6 +36,7 @@ import {usePreferencesQuery} from '#/state/queries/preferences'
import {useSession} from '#/state/session'
import {useShellLayout} from '#/state/shell/shell-layout'
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'
@@ -91,7 +93,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()
@@ -102,6 +104,8 @@ export function PostThread({uri}: {uri: string | undefined}) {
HiddenRepliesState.Hide,
)
const headerRef = React.useRef(null)
+ const anchorPostSource = useUnstablePostSource(uri)
+ const feedFeedback = useFeedFeedback(anchorPostSource?.feed, hasSession)
const {data: preferences} = usePreferencesQuery()
const {
@@ -396,10 +400,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,
@@ -411,7 +423,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 =
@@ -424,7 +443,7 @@ export function PostThread({uri}: {uri: string | undefined}) {
return (
{!isMobile && (
-
+
)}
)
@@ -512,6 +531,7 @@ export function PostThread({uri}: {uri: string | undefined}) {
}
onPostReply={onPostReply}
hideTopBorder={index === 0 && !item.ctx.isParentLoading}
+ anchorPostSource={anchorPostSource}
/>
)
@@ -590,7 +610,7 @@ export function PostThread({uri}: {uri: string | undefined}) {
/>
{isMobile && canReply && hasSession && (
-
+
)}
)
diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx
index d13da1e138..5184047cbb 100644
--- a/src/view/com/post-thread/PostThreadItem.tsx
+++ b/src/view/com/post-thread/PostThreadItem.tsx
@@ -41,7 +41,7 @@ import {type ThreadPost} from '#/state/queries/post-thread'
import {useSession} from '#/state/session'
import {type OnPostSuccessData} from '#/state/shell/composer'
import {useMergedThreadgateHiddenReplies} from '#/state/threadgate-hidden-replies'
-import {useUnstablePostSource} from '#/state/unstable-post-source'
+import {type PostSource} 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'
@@ -89,6 +89,7 @@ export function PostThreadItem({
onPostSuccess,
hideTopBorder,
threadgateRecord,
+ anchorPostSource,
}: {
post: AppBskyFeedDefs.PostView
record: AppBskyFeedPost.Record
@@ -107,6 +108,7 @@ export function PostThreadItem({
onPostSuccess?: (data: OnPostSuccessData) => void
hideTopBorder?: boolean
threadgateRecord?: AppBskyFeedThreadgate.Record
+ anchorPostSource?: PostSource
}) {
const postShadowed = usePostShadow(post)
const richText = useMemo(
@@ -143,6 +145,7 @@ export function PostThreadItem({
onPostSuccess={onPostSuccess}
hideTopBorder={hideTopBorder}
threadgateRecord={threadgateRecord}
+ anchorPostSource={anchorPostSource}
/>
)
}
@@ -189,6 +192,7 @@ let PostThreadItemLoaded = ({
onPostSuccess,
hideTopBorder,
threadgateRecord,
+ anchorPostSource,
}: {
post: Shadow
record: AppBskyFeedPost.Record
@@ -208,10 +212,10 @@ let PostThreadItemLoaded = ({
onPostSuccess?: (data: OnPostSuccessData) => void
hideTopBorder?: boolean
threadgateRecord?: AppBskyFeedThreadgate.Record
+ anchorPostSource?: PostSource
}): React.ReactNode => {
const {currentAccount, hasSession} = useSession()
- const source = useUnstablePostSource(post.uri)
- const feedFeedback = useFeedFeedback(source?.feed, hasSession)
+ const feedFeedback = useFeedFeedback(anchorPostSource?.feed, hasSession)
const t = useTheme()
const pal = usePalette('default')
@@ -282,12 +286,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({
@@ -305,23 +309,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,
})
}
}
@@ -332,7 +336,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 {
@@ -557,8 +561,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}
/>
diff --git a/src/view/com/posts/PostFeedItem.tsx b/src/view/com/posts/PostFeedItem.tsx
index b9aa676737..fd0d1c707d 100644
--- a/src/view/com/posts/PostFeedItem.tsx
+++ b/src/view/com/posts/PostFeedItem.tsx
@@ -36,7 +36,10 @@ import {useFeedFeedbackContext} from '#/state/feed-feedback'
import {unstableCacheProfileView} from '#/state/queries/profile'
import {useSession} from '#/state/session'
import {useMergedThreadgateHiddenReplies} from '#/state/threadgate-hidden-replies'
-import {useSetUnstablePostSource} from '#/state/unstable-post-source'
+import {
+ buildPostSourceKey,
+ setUnstablePostSource,
+} from '#/state/unstable-post-source'
import {FeedNameText} from '#/view/com/util/FeedInfoText'
import {Link, TextLink, TextLinkOnWebOnly} from '#/view/com/util/Link'
import {PostEmbeds, PostEmbedViewContext} from '#/view/com/util/post-embeds'
@@ -176,7 +179,6 @@ let FeedItemInner = ({
return makeProfileLink(post.author, 'post', urip.rkey)
}, [post.uri, post.author])
const {sendInteraction, feedDescriptor} = useFeedFeedbackContext()
- const unstableSetPostSource = useSetUnstablePostSource()
const onPressReply = () => {
sendInteraction({
@@ -232,7 +234,7 @@ let FeedItemInner = ({
reqId,
})
unstableCacheProfileView(queryClient, post.author)
- unstableSetPostSource(post.uri, {
+ setUnstablePostSource(buildPostSourceKey(post.uri, post.author.handle), {
feed: feedDescriptor,
post: {
post,