acetheking987/bsky-social-app
1
0
Fork 0
Code Issues Actions Packages Projects Releases 1 Wiki Activity

Pass correct log context to suggested user metrics (#10074)

Browse Source
This commit is contained in:
DS Boyce
2026-03-25 15:13:23 -07:00
committed by GitHub
parent 2c828b5755
commit d44060a34e
3 changed files with 98 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/ProgressGuide/FollowDialog.tsx
+62 -35
View File
@@ -1,9 +1,7 @@
import {memo, useCallback, useEffect, useMemo, useRef, useState} from 'react'
import {TextInput, View, type ViewToken} from 'react-native'
import {type ModerationOpts} from '@atproto/api'
import {msg} from '@lingui/core/macro'
import {useLingui} from '@lingui/react'
import {Trans} from '@lingui/react/macro'
import {Trans, useLingui} from '@lingui/react/macro'
import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback'
import {popularInterests, useInterestsDisplayNames} from '#/lib/interests'
@@ -64,14 +62,14 @@ export function FollowDialog({
showArrow?: boolean
}) {
const ax = useAnalytics()
const {_} = useLingui()
const {t: l} = useLingui()
const control = Dialog.useDialogControl()
const {gtPhone} = useBreakpoints()
return (
<>
<Button
label={_(msg`Find people to follow`)}
label={l`Find people to follow`}
onPress={() => {
control.open()
ax.metric('progressGuide:followDialog:open', {})
@@ -112,7 +110,7 @@ let lastSelectedInterest = ''
let lastSearchText = ''
function DialogInner({guide}: {guide?: Follow10ProgressGuide}) {
const {_} = useLingui()
const {t: l} = useLingui()
const ax = useAnalytics()
const interestsDisplayNames = useInterestsDisplayNames()
const {data: preferences} = usePreferencesQuery()
@@ -182,7 +180,7 @@ function DialogInner({guide}: {guide?: Follow10ProgressGuide}) {
_items.push({
type: 'empty',
key: 'empty',
message: _(msg`We're having network issues, try again`),
message: l`We're having network issues, try again`,
})
} else {
const seen = new Set<string>()
@@ -208,12 +206,12 @@ function DialogInner({guide}: {guide?: Follow10ProgressGuide}) {
!_items.length &&
!isSearchResultsError
) {
_items.push({type: 'empty', key: 'empty', message: _(msg`No results`)})
_items.push({type: 'empty', key: 'empty', message: l`No results`})
}
return _items
}, [
_,
l,
suggestions,
suggestionsError,
isFetchingSuggestions,
@@ -226,6 +224,9 @@ function DialogInner({guide}: {guide?: Follow10ProgressGuide}) {
isSearchResultsError,
])
const isGuide = Boolean(guide)
const recIdForLogging = hasSearchText ? undefined : suggestions?.recId
const renderItems = useCallback(
({item, index}: {item: Item; index: number}) => {
switch (item.type) {
@@ -235,6 +236,9 @@ function DialogInner({guide}: {guide?: Follow10ProgressGuide}) {
profile={item.profile}
moderationOpts={moderationOpts!}
noBorder={index === 0}
position={index}
recId={recIdForLogging}
isGuide={isGuide}
/>
)
}
@@ -248,7 +252,7 @@ function DialogInner({guide}: {guide?: Follow10ProgressGuide}) {
return null
}
},
[moderationOpts],
[moderationOpts, recIdForLogging, isGuide],
)
// Track seen profiles
@@ -269,8 +273,8 @@ function DialogInner({guide}: {guide?: Follow10ProgressGuide}) {
i => i.type === 'profile' && i.profile.did === item.profile.did,
)
ax.metric('suggestedUser:seen', {
logContext: 'ProgressGuide',
recId: hasSearchText ? undefined : suggestions?.recId,
logContext: isGuide ? 'ProgressGuide' : 'SeeMoreSuggestedUsers',
recId: recIdForLogging,
position: position !== -1 ? position : 0,
suggestedDid: item.profile.did,
category: selectedInterestRef.current,
@@ -404,7 +408,7 @@ let Header = ({
Header = memo(Header)
function HeaderTop({guide}: {guide?: Follow10ProgressGuide}) {
const {_} = useLingui()
const {t: l} = useLingui()
const t = useTheme()
const control = Dialog.useDialogContext()
return (
@@ -438,7 +442,7 @@ function HeaderTop({guide}: {guide?: Follow10ProgressGuide}) {
)}
{IS_WEB ? (
<Button
label={_(msg`Close`)}
label={l`Close`}
size="small"
shape="round"
variant={IS_WEB ? 'ghost' : 'solid'}
@@ -474,22 +478,18 @@ let Tab = ({
onLayout: (index: number, x: number, width: number) => void
}): React.ReactNode => {
const t = useTheme()
const {_} = useLingui()
const {t: l} = useLingui()
const label = active
? _(
msg({
message: `Search for "${interestsDisplayName}" (active)`,
comment:
'Accessibility label for a tab that searches for accounts in a category (e.g. Art, Video Games, Sports, etc.) that are suggested for the user to follow. The tab is currently selected.',
}),
)
: _(
msg({
message: `Search for "${interestsDisplayName}"`,
comment:
'Accessibility label for a tab that searches for accounts in a category (e.g. Art, Video Games, Sports, etc.) that are suggested for the user to follow. The tab is not currently active and can be selected.',
}),
)
? l({
message: `Search for "${interestsDisplayName}" (active)`,
comment:
'Accessibility label for a tab that searches for accounts in a category (e.g. Art, Video Games, Sports, etc.) that are suggested for the user to follow. The tab is currently selected.',
})
: l({
message: `Search for "${interestsDisplayName}"`,
comment:
'Accessibility label for a tab that searches for accounts in a category (e.g. Art, Video Games, Sports, etc.) that are suggested for the user to follow. The tab is not currently active and can be selected.',
})
return (
<View
key={interest}
@@ -532,16 +532,25 @@ let FollowProfileCard = ({
profile,
moderationOpts,
noBorder,
position,
recId,
isGuide,
}: {
profile: bsky.profile.AnyProfileView
moderationOpts: ModerationOpts
noBorder?: boolean
position: number
recId?: string
isGuide: boolean
}): React.ReactNode => {
return (
<FollowProfileCardInner
profile={profile}
moderationOpts={moderationOpts}
noBorder={noBorder}
position={position}
recId={recId}
isGuide={isGuide}
/>
)
}
@@ -552,14 +561,21 @@ function FollowProfileCardInner({
moderationOpts,
onFollow,
noBorder,
position,
recId,
isGuide,
}: {
profile: bsky.profile.AnyProfileView
moderationOpts: ModerationOpts
onFollow?: () => void
noBorder?: boolean
position: number
recId?: string
isGuide: boolean
}) {
const control = Dialog.useDialogContext()
const t = useTheme()
const ax = useAnalytics()
return (
<ProfileCard.Link
profile={profile}
@@ -588,7 +604,19 @@ function FollowProfileCardInner({
moderationOpts={moderationOpts}
logContext="PostOnboardingFindFollows"
shape="round"
onPress={onFollow}
onPress={() => {
ax.metric('suggestedUser:follow', {
logContext: isGuide
? 'ProgressGuide'
: 'SeeMoreSuggestedUsers',
location: 'Card',
recId,
position,
suggestedDid: profile.did,
category: null,
})
onFollow?.()
}}
colorInverted
/>
</ProfileCard.Header>
@@ -632,7 +660,7 @@ function SearchInput({
defaultValue: string
}) {
const t = useTheme()
const {_} = useLingui()
const {t: l} = useLingui()
const {
state: hovered,
onIn: onMouseEnter,
@@ -652,10 +680,9 @@ function SearchInput({
size="md"
fill={interacted ? t.palette.primary_500 : t.palette.contrast_300}
/>
<TextInput
ref={inputRef}
placeholder={_(msg`Search by name or interest`)}
placeholder={l`Search by name or interest`}
defaultValue={defaultValue}
onChangeText={onChangeText}
onFocus={onFocus}
@@ -674,8 +701,8 @@ function SearchInput({
autoCorrect={false}
autoComplete="off"
autoCapitalize="none"
accessibilityLabel={_(msg`Search profiles`)}
accessibilityHint={_(msg`Searches for profiles`)}
accessibilityLabel={l`Search profiles`}
accessibilityHint={l`Searches for profiles`}
/>
</View>
)