Add moduleSuffixes to tsconfig (#11146)

Co-authored-by: Claude <noreply@anthropic.com>

src/screens/Messages/ChatList.tsx

@@ -1,6 +1,5 @@
 import {useCallback, useEffect, useMemo, useRef, useState} from 'react'
 import {View} from 'react-native'
-import {useAnimatedRef} from 'react-native-reanimated'
 import {type ChatBskyActorGetStatus, type ChatBskyConvoDefs} from '@atproto/api'
 import {Trans, useLingui} from '@lingui/react/macro'
 import {
@@ -275,7 +274,7 @@ export function ChatList({
   const t = useTheme()
   const {t: l} = useLingui()
   const aa = useAgeAssurance()
-  const scrollElRef: ListRef = useAnimatedRef()
+  const scrollElRef: ListRef = useRef(null)
   const {isWithinSplitView} = useIsWithinSplitView()
 
   const openChatControl = useCallback(() => {

src/screens/Messages/components/MessagesList.tsx

@@ -17,7 +17,6 @@ import Animated, {
   runOnJS,
   type ScrollEvent,
   type SharedValue,
-  useAnimatedRef,
   useAnimatedStyle,
   useDerivedValue,
   useSharedValue,
@@ -154,7 +153,7 @@ export function MessagesList({
   const t = useTheme()
 
   const textInputId = 'chat-input-' + useId()
-  const flatListRef = useAnimatedRef<ListMethods>()
+  const flatListRef = useRef<ListMethods | null>(null)
 
   const [expandedGroups, setExpandedGroups] = useState<Set<string>>(
     () => new Set(),

src/screens/Onboarding/StepFindContacts/index.web.tsx

@@ -1,3 +1,8 @@
-export function StepFindContacts() {
+import {type Action, type State} from '#/components/contacts/state'
+
+export function StepFindContacts(_props: {
+  flowState: State
+  flowDispatch: React.ActionDispatch<[Action]>
+}): never {
   throw new Error('StepFindContacts is not available on web')
 }

src/screens/Onboarding/StepFindContactsIntro/index.web.tsx

@@ -1,3 +1,3 @@
-export function StepFindContactsIntro() {
+export function StepFindContactsIntro(): never {
   throw new Error('StepFindContactsIntro is not available on web')
 }

src/screens/Onboarding/StepFinished/ValuePropositionPager.shared.tsx

@@ -4,6 +4,16 @@ import {useLingui} from '@lingui/react'
 
 import {atoms as a, useTheme} from '#/alf'
 
+export type ValuePropositionPagerProps = {
+  step: 0 | 1 | 2
+  /**
+   * Only the native pager changes pages itself (by swiping); the web pager
+   * is driven entirely by the step prop.
+   */
+  setStep: (step: 0 | 1 | 2) => void
+  avatarUri?: string
+}
+
 export function useValuePropText(step: 0 | 1 | 2) {
   const {_} = useLingui()
 

src/screens/Onboarding/StepFinished/ValuePropositionPager.tsx

@@ -8,17 +8,17 @@ import {useLingui} from '@lingui/react'
 import {atoms as a, tokens, useTheme} from '#/alf'
 import {Text} from '#/components/Typography'
 import {PROP_1, PROP_2, PROP_3} from './images'
-import {Dot, useValuePropText} from './ValuePropositionPager.shared'
+import {
+  Dot,
+  useValuePropText,
+  type ValuePropositionPagerProps,
+} from './ValuePropositionPager.shared'
 
 export function ValuePropositionPager({
   step,
   setStep,
   avatarUri,
-}: {
-  step: 0 | 1 | 2
-  setStep: (step: 0 | 1 | 2) => void
-  avatarUri?: string
-}) {
+}: ValuePropositionPagerProps) {
   const t = useTheme()
   const [activePage, setActivePage] = useState(step)
   const ref = useRef<PagerView>(null)

src/screens/Onboarding/StepFinished/ValuePropositionPager.web.tsx

@@ -6,15 +6,16 @@ import {useLingui} from '@lingui/react'
 import {atoms as a, useTheme} from '#/alf'
 import {Text} from '#/components/Typography'
 import {PROP_1, PROP_2, PROP_3} from './images'
-import {Dot, useValuePropText} from './ValuePropositionPager.shared'
+import {
+  Dot,
+  useValuePropText,
+  type ValuePropositionPagerProps,
+} from './ValuePropositionPager.shared'
 
 export function ValuePropositionPager({
   step,
   avatarUri,
-}: {
-  step: 0 | 1 | 2
-  avatarUri?: string
-}) {
+}: ValuePropositionPagerProps) {
   const t = useTheme()
   const {_} = useLingui()
 

src/screens/Profile/KnownFollowers.tsx

@@ -34,7 +34,7 @@ function renderItem({
   )
 }
 
-function keyExtractor(item: AppBskyActorDefs.ProfileViewBasic) {
+function keyExtractor(item: AppBskyActorDefs.ProfileView) {
   return item.did
 }
 

src/screens/Profile/Sections/Feed.tsx

@@ -1,5 +1,5 @@
 import {useCallback, useEffect, useImperativeHandle, useState} from 'react'
-import {findNodeHandle, View} from 'react-native'
+import {View} from 'react-native'
 import {msg} from '@lingui/core/macro'
 import {useLingui} from '@lingui/react'
 import {Trans} from '@lingui/react/macro'
@@ -17,6 +17,7 @@ import {
   type EmptyStateButtonProps,
 } from '#/view/com/util/EmptyState'
 import {type ListRef} from '#/view/com/util/List'
+import {findListNativeTag} from '#/view/com/util/listNativeTag'
 import {LoadLatestBtn} from '#/view/com/util/load-latest/LoadLatestBtn'
 import {atoms as a, ios, useTheme} from '#/alf'
 import {EditBig_Stroke1_Corner0_Rounded as EditIcon} from '#/components/icons/EditBig'
@@ -87,7 +88,7 @@ export function ProfileFeedSection({
 
   useEffect(() => {
     if (IS_IOS && isFocused && scrollElRef.current) {
-      const nativeTag = findNodeHandle(scrollElRef.current)
+      const nativeTag = findListNativeTag(scrollElRef.current)
       setScrollViewTag(nativeTag)
     }
   }, [isFocused, scrollElRef, setScrollViewTag])

src/screens/Profile/Sections/Labels.tsx

@@ -1,5 +1,5 @@
 import {useCallback, useEffect, useImperativeHandle, useMemo} from 'react'
-import {findNodeHandle, type ListRenderItemInfo, View} from 'react-native'
+import {type ListRenderItemInfo, View} from 'react-native'
 import {
   type AppBskyLabelerDefs,
   type InterpretedLabelValueDefinition,
@@ -12,6 +12,7 @@ import {Trans} from '@lingui/react/macro'
 
 import {isLabelerSubscribed, lookupLabelValueDefinition} from '#/lib/moderation'
 import {List, type ListRef} from '#/view/com/util/List'
+import {findListNativeTag} from '#/view/com/util/listNativeTag'
 import {atoms as a, ios, tokens, useTheme} from '#/alf'
 import {Divider} from '#/components/Divider'
 import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
@@ -61,7 +62,7 @@ export function ProfileLabelsSection({
 
   useEffect(() => {
     if (IS_IOS && isFocused && scrollElRef.current) {
-      const nativeTag = findNodeHandle(scrollElRef.current)
+      const nativeTag = findListNativeTag(scrollElRef.current)
       setScrollViewTag(nativeTag)
     }
   }, [isFocused, scrollElRef, setScrollViewTag])

src/screens/Search/Explore.tsx

@@ -1169,7 +1169,7 @@ export function Explore({
   )
 }
 
-function keyExtractor(item: FeedPreviewItem) {
+function keyExtractor(item: ExploreScreenItems) {
   return item.key
 }
 

src/screens/Settings/AppIconSettings/SettingsListItem.web.tsx

@@ -1 +1,3 @@
-export function SettingsListItem() {}
+export function SettingsListItem() {
+  return null
+}

src/screens/Settings/AppIconSettings/index.web.tsx

@@ -1,3 +1,3 @@
-export function AppIconSettingsScreen() {
+export function AppIconSettingsScreen(): never {
   throw new Error('Not supported on web')
 }

src/screens/Signup/StepCaptcha/CaptchaWebView.shared.ts

@@ -0,0 +1,10 @@
+import {type SignupState} from '#/screens/Signup/state'
+
+export type CaptchaWebViewProps = {
+  url: string
+  stateParam: string
+  state?: SignupState
+  onComplete: () => void
+  onSuccess: (code: string) => void
+  onError: (error: unknown) => void
+}

src/screens/Signup/StepCaptcha/CaptchaWebView.tsx

@@ -2,7 +2,7 @@ import {useEffect, useMemo, useRef} from 'react'
 import {WebView, type WebViewNavigation} from 'react-native-webview'
 import {type ShouldStartLoadRequest} from 'react-native-webview/lib/WebViewTypes'
 
-import {type SignupState} from '#/screens/Signup/state'
+import {type CaptchaWebViewProps} from './CaptchaWebView.shared'
 
 const ALLOWED_HOSTS = [
   'bsky.social',
@@ -24,14 +24,7 @@ export function CaptchaWebView({
   onComplete,
   onSuccess,
   onError,
-}: {
-  url: string
-  stateParam: string
-  state?: SignupState
-  onComplete: () => void
-  onSuccess: (code: string) => void
-  onError: (error: unknown) => void
-}) {
+}: CaptchaWebViewProps) {
   const startedAt = useRef(Date.now())
   const successTo = useRef<NodeJS.Timeout>(undefined)
 

src/screens/Signup/StepCaptcha/CaptchaWebView.web.tsx

@@ -1,6 +1,8 @@
 import {useCallback, useEffect} from 'react'
 import {StyleSheet} from 'react-native'
 
+import {type CaptchaWebViewProps} from './CaptchaWebView.shared'
+
 // @ts-ignore web only, we will always redirect to the app on web (CORS)
 const REDIRECT_HOST = new URL(window.location.href).host
 
@@ -9,12 +11,7 @@ export function CaptchaWebView({
   stateParam,
   onSuccess,
   onError,
-}: {
-  url: string
-  stateParam: string
-  onSuccess: (code: string) => void
-  onError: (error: unknown) => void
-}) {
+}: CaptchaWebViewProps) {
   useEffect(() => {
     const timeout = setTimeout(() => {
       onError({

src/screens/StarterPack/Wizard/StepProfiles.tsx

@@ -1,7 +1,7 @@
 import {useState} from 'react'
 import {type ListRenderItemInfo, View} from 'react-native'
 import {KeyboardAwareScrollView} from 'react-native-keyboard-controller'
-import {type AppBskyActorDefs, type ModerationOpts} from '@atproto/api'
+import {type ModerationOpts} from '@atproto/api'
 import {Trans} from '@lingui/react/macro'
 
 import {useA11y} from '#/state/a11y'
@@ -18,7 +18,7 @@ import {Text} from '#/components/Typography'
 import {IS_NATIVE} from '#/env'
 import type * as bsky from '#/types/bsky'
 
-function keyExtractor(item: AppBskyActorDefs.ProfileViewBasic) {
+function keyExtractor(item: bsky.profile.AnyProfileView) {
   return item?.did ?? ''
 }