From f87fdd2ea203ba39eaa777b819e62caad9350c7e Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Tue, 25 Aug 2026 09:40:14 +0300
Subject: [PATCH] Enable React Native strict TypeScript API (#11459)

---
 jest/jestSetup.js                             |  10 +
 oxlint-suppressions.json                      | 177 +-----------------
 src/Navigation.tsx                            |   4 +-
 src/Splash.tsx                                |  11 +-
 src/Splash.web.tsx                            |   4 +-
 .../components/RedirectOverlay.tsx            |   1 -
 src/alf/fonts.ts                              |   7 +-
 src/alf/typography.tsx                        |  10 +-
 src/alf/util/dimensions.ts                    |  11 +-
 src/alf/util/flatten.ts                       |  19 +-
 src/alf/util/useColorModeTheme.ts             |   5 +-
 src/analytics/utils.ts                        |   2 +-
 src/components/AltBadgeWithDialog.tsx         |   6 +-
 src/components/BetaBadge.tsx                  |   3 +-
 src/components/Button.tsx                     |   5 +-
 src/components/Composer/index.tsx             |  19 +-
 src/components/ContextMenu/index.tsx          |   7 +-
 src/components/Dialog/index.tsx               | 147 ++++++++-------
 src/components/Dialog/index.web.tsx           |   5 +-
 src/components/FeedInterstitials.tsx          |   4 +-
 src/components/FocusScope/index.tsx           |  19 +-
 src/components/GlassView.tsx                  |   2 +-
 src/components/InterestTabs.tsx               |   2 +-
 src/components/Layout/Header/index.tsx        |   2 +-
 src/components/Lightbox/Lightbox.web.tsx      |   3 -
 src/components/Lightbox/chrome/ImageMenu.tsx  |   2 +-
 .../pager/ImageItem/ImageItem.ios.tsx         |   4 +-
 src/components/Lightbox/pager/ImagePager.tsx  |   9 +-
 src/components/Link.tsx                       |   4 +-
 src/components/Menu/index.web.tsx             |   4 +-
 src/components/Menu/types.ts                  |   2 +-
 .../VideoEmbedInner/VideoEmbedInnerWeb.tsx    |   2 +-
 src/components/Post/Translated/index.tsx      |   2 +-
 .../PostControls/PostControlButton.tsx        |   2 +-
 src/components/Pressable.tsx                  |  37 ++++
 src/components/ProfileHoverCard/index.web.tsx |   3 +-
 src/components/ProgressGuide/FollowDialog.tsx |   8 +-
 src/components/RichText.tsx                   |   9 +-
 src/components/Select/index.tsx               |  11 +-
 src/components/Select/index.web.tsx           |  18 +-
 .../StarterPack/Main/ProfilesList.tsx         |   7 -
 src/components/Tooltip/index.tsx              |   9 +-
 src/components/Tooltip/index.web.tsx          |   4 +-
 .../contacts/components/OTPInput.tsx          |   4 +-
 .../contacts/screens/ViewMatches.tsx          |   2 +-
 .../dialogs/SearchablePeopleList.tsx          |   4 +-
 .../lists/UserAddRemoveListsDialog.tsx        |   4 +-
 src/components/dialogs/nuxs/index.tsx         |   2 +-
 src/components/dms/AddMembersFlow.tsx         |   4 +-
 src/components/dms/InitiateChatFlow.tsx       |   2 +-
 src/components/dms/ReactionsDialog.tsx        |   2 +-
 .../dms/components/UserSearchInput.tsx        |   3 +-
 src/components/forms/AutosizedTextarea.tsx    |   6 +-
 .../forms/DateField/index.android.tsx         |   1 -
 src/components/forms/DateField/index.web.tsx  |   2 +-
 src/components/forms/SearchInput.tsx          |   4 +-
 src/components/forms/TextField.tsx            |  72 +++----
 src/components/hooks/useOnKeyboard.ts         |   4 +-
 src/components/icons/TEMPLATE.tsx             |   2 +-
 src/components/images/Gallery/index.tsx       |  12 +-
 src/components/moderation/BlockDialog.tsx     |   2 +-
 .../moderation/ReportDialog/index.tsx         |   2 +-
 src/features/gifPicker/GifPickerDialog.tsx    |   2 +-
 .../gifPicker/components/GifPickerGrid.tsx    |   2 +-
 .../gifPicker/components/GifPickerHeader.tsx  |   2 +-
 src/features/liveEvents/preferences.ts        |   2 +-
 src/lib/api/feed/merge.ts                     |   2 +-
 src/lib/batchedUpdates.ts                     |   6 +-
 src/lib/hooks/useDraggableScrollView.ts       |  14 +-
 src/lib/hooks/useOTAUpdates.test.ts           |   6 +-
 src/lib/hooks/useOTAUpdates.ts                |   2 +-
 src/lib/jwt.ts                                |   2 +-
 src/lib/media/picker.shared.ts                |   2 +
 src/lib/strings/embed-player.ts               |   8 +-
 src/locale/deviceLocales.ts                   |   2 +-
 src/logger/__tests__/logger.test.ts           |   6 +-
 src/platform/markBundleStartTime.ts           |   2 +-
 src/screens/Hashtag.tsx                       |   1 -
 src/screens/Login/LoginForm.tsx               |   4 +-
 src/screens/Messages/JoinRequests.tsx         |   2 +-
 .../Messages/components/MessageComposer.tsx   |   6 +-
 src/screens/Onboarding/Layout.tsx             |   2 +-
 .../StepFinished/ValuePropositionPager.tsx    |   3 +-
 .../StepProfile/PlaceholderCanvas.tsx         |   1 -
 .../StepSuggestedAccounts/index.tsx           |   4 +-
 src/screens/PostThread/index.tsx              |   4 +-
 src/screens/Profile/KnownFollowers.tsx        |   1 -
 src/screens/Search/Explore.tsx                |   3 +-
 src/screens/Search/Shell.tsx                  |   2 +-
 .../AdvancedSearchDialog/ClearableInput.tsx   |   2 +-
 .../components/AdvancedSearchDialog/index.tsx |   4 +-
 .../SearchAutocompleteInput/index.tsx         |   2 +-
 src/screens/Settings/AppIconSettings/types.ts |   6 +-
 .../ActivityNotificationSettings.tsx          |   2 +-
 .../components/DeleteAccountDialog.tsx        |   2 +-
 .../Signup/StepCaptcha/CaptchaWebView.web.tsx |   3 -
 src/screens/Signup/StepInfo/index.tsx         |   4 +-
 src/screens/StarterPack/StarterPackScreen.tsx |  14 +-
 src/screens/Topic.tsx                         |   1 -
 src/screens/VideoFeed/index.tsx               |   8 +-
 src/state/cache/thread-mutes.tsx              |   1 -
 src/state/persisted/schema.ts                 |   2 +-
 src/state/queries/nuxs/index.ts               |   2 +-
 src/state/queries/usePostThread/utils.ts      |   6 +-
 src/state/queries/usePostThread/views.ts      |   4 +-
 src/storage/__tests__/index.test.ts           |   2 +-
 src/view/com/auth/SplashScreen.tsx            |   8 +-
 src/view/com/auth/SplashScreen.web.tsx        |   1 -
 src/view/com/composer/drafts/DraftItem.tsx    |   3 +-
 src/view/com/composer/photos/Gallery.tsx      |   2 +-
 .../com/composer/text-input/TextInput.tsx     |  10 +-
 .../com/composer/text-input/TextInput.web.tsx |   5 +-
 .../composer/text-input/web/Autocomplete.tsx  |   4 +-
 .../videos/VideoTranscodeBackdrop.web.tsx     |   4 +-
 src/view/com/feeds/ComposerPrompt.tsx         |   1 -
 src/view/com/pager/DraggableScrollView.tsx    |   2 +-
 src/view/com/pager/PagerWithHeader.tsx        |   8 +-
 src/view/com/pager/PagerWithHeader.web.tsx    |   6 +-
 src/view/com/pager/TabBar.web.tsx             |   5 +-
 src/view/com/post-thread/PostQuotes.tsx       |   1 -
 src/view/com/post-thread/PostRepostedBy.tsx   |   1 -
 src/view/com/post/Post.tsx                    |   1 -
 src/view/com/profile/ProfileFollowers.tsx     |   1 -
 src/view/com/profile/ProfileFollows.tsx       |   1 -
 src/view/com/util/Alert.web.tsx               |   4 +-
 src/view/com/util/EventStopper.tsx            |   1 -
 src/view/com/util/Link.tsx                    |  20 +-
 src/view/com/util/List.tsx                    |   3 +-
 src/view/com/util/List.web.tsx                |  11 +-
 src/view/com/util/PressableWithHover.tsx      |  25 +--
 src/view/com/util/Views.tsx                   |  12 +-
 src/view/com/util/Views.web.tsx               |  10 +-
 src/view/com/util/WebAuxClickWrapper.tsx      |   2 +-
 src/view/com/util/fab/FABInner.tsx            |   2 +-
 src/view/com/util/forms/Button.tsx            |  15 +-
 src/view/com/util/layouts/LoggedOutLayout.tsx |   1 -
 src/view/com/util/listNativeTag.ts            |   2 +-
 src/view/com/util/text/Text.tsx               |  16 +-
 src/view/icons/Logo.tsx                       |   4 +-
 src/view/icons/Logomark.tsx                   |   2 +-
 src/view/icons/Logotype.tsx                   |   2 +-
 src/view/screens/DebugMod.tsx                 |   4 +-
 src/view/screens/Home.tsx                     |   2 +-
 src/view/screens/Notifications.tsx            |   2 +-
 src/view/screens/Profile.tsx                  |   2 +-
 src/view/screens/Storybook/Forms.tsx          |   2 +-
 src/view/shell/Composer.web.tsx               |   2 -
 src/view/shell/desktop/LeftNav.tsx            |   2 +-
 tsconfig.json                                 |   3 +-
 149 files changed, 506 insertions(+), 623 deletions(-)
 create mode 100644 src/components/Pressable.tsx

diff --git a/jest/jestSetup.js b/jest/jestSetup.js
index 2a1d3f3293..44a2c985f5 100644
--- a/jest/jestSetup.js
+++ b/jest/jestSetup.js
@@ -56,6 +56,16 @@ jest.mock('expo-media-library', () => ({
   __esModule: true, // this property makes it work
   default: jest.fn(),
   usePermissions: jest.fn(() => [true]),
+  requestPermissionsAsync: jest.fn().mockResolvedValue({granted: true}),
+  saveToLibraryAsync: jest.fn().mockResolvedValue(undefined),
+}))
+
+jest.mock('expo-media-library/legacy', () => ({
+  __esModule: true,
+  default: jest.fn(),
+  usePermissions: jest.fn(() => [true]),
+  requestPermissionsAsync: jest.fn().mockResolvedValue({granted: true}),
+  saveToLibraryAsync: jest.fn().mockResolvedValue(undefined),
 }))
 
 jest.mock('@bsky.app/expo-guess-language', () => ({
diff --git a/oxlint-suppressions.json b/oxlint-suppressions.json
index e04604a747..1ef59ea20c 100644
--- a/oxlint-suppressions.json
+++ b/oxlint-suppressions.json
@@ -80,14 +80,6 @@
       "count": 1
     }
   },
-  "src/alf/util/flatten.ts": {
-    "typescript/no-explicit-any": {
-      "count": 1
-    },
-    "typescript/no-unsafe-member-access": {
-      "count": 9
-    }
-  },
   "src/alf/util/systemUI.ts": {
     "typescript/no-floating-promises": {
       "count": 2
@@ -167,9 +159,6 @@
     "typescript/no-explicit-any": {
       "count": 4
     },
-    "typescript/no-misused-promises": {
-      "count": 1
-    },
     "typescript/no-unsafe-call": {
       "count": 2
     },
@@ -224,9 +213,6 @@
   "src/components/Lists.tsx": {
     "typescript/no-explicit-any": {
       "count": 1
-    },
-    "typescript/no-misused-promises": {
-      "count": 1
     }
   },
   "src/components/Menu/types.ts": {
@@ -261,9 +247,6 @@
   "src/components/PostControls/BookmarkButton.tsx": {
     "typescript/no-explicit-any": {
       "count": 2
-    },
-    "typescript/no-misused-promises": {
-      "count": 1
     }
   },
   "src/components/PostControls/DiscoverDebug.tsx": {
@@ -335,9 +318,6 @@
     "typescript/no-floating-promises": {
       "count": 5
     },
-    "typescript/no-misused-promises": {
-      "count": 2
-    },
     "typescript/require-await": {
       "count": 4
     }
@@ -346,9 +326,6 @@
     "typescript/no-floating-promises": {
       "count": 1
     },
-    "typescript/no-misused-promises": {
-      "count": 2
-    },
     "typescript/require-await": {
       "count": 1
     }
@@ -363,16 +340,6 @@
       "count": 1
     }
   },
-  "src/components/ageAssurance/AgeAssuranceErrors.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
-  "src/components/ageAssurance/AgeAssuranceInitDialog.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 2
-    }
-  },
   "src/components/ageAssurance/AgeAssuranceRedirectDialog.tsx": {
     "typescript/require-await": {
       "count": 1
@@ -388,18 +355,10 @@
       "count": 1
     }
   },
-  "src/components/contacts/screens/ViewMatches.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
   "src/components/dialogs/DeviceLocationRequestDialog.tsx": {
     "typescript/no-explicit-any": {
       "count": 1
     },
-    "typescript/no-misused-promises": {
-      "count": 1
-    },
     "typescript/no-unsafe-member-access": {
       "count": 2
     }
@@ -409,26 +368,6 @@
       "count": 1
     }
   },
-  "src/components/dialogs/EmailDialog/screens/Manage2FA/Disable.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 3
-    }
-  },
-  "src/components/dialogs/EmailDialog/screens/Manage2FA/Enable.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
-  "src/components/dialogs/EmailDialog/screens/Update.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 3
-    }
-  },
-  "src/components/dialogs/EmailDialog/screens/Verify.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 3
-    }
-  },
   "src/components/dialogs/LanguageSelectDialog.tsx": {
     "typescript/no-explicit-any": {
       "count": 1
@@ -447,7 +386,7 @@
       "count": 2
     },
     "typescript/no-misused-promises": {
-      "count": 3
+      "count": 1
     },
     "typescript/no-unsafe-member-access": {
       "count": 2
@@ -490,9 +429,6 @@
   "src/components/dialogs/lists/CreateOrEditListDialog.tsx": {
     "typescript/no-explicit-any": {
       "count": 2
-    },
-    "typescript/no-misused-promises": {
-      "count": 1
     }
   },
   "src/components/dialogs/nuxs/FindContactsAnnouncement.tsx": {
@@ -580,16 +516,6 @@
       "count": 2
     }
   },
-  "src/components/intents/VerifyEmailIntentDialog.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
-  "src/components/verification/VerificationCreatePrompt.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
   "src/components/verification/VerificationRemovePrompt.tsx": {
     "typescript/no-misused-promises": {
       "count": 1
@@ -696,13 +622,10 @@
       "count": 1
     },
     "typescript/no-misused-promises": {
-      "count": 3
+      "count": 2
     }
   },
   "src/lib/hooks/usePermissions.ts": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    },
     "typescript/no-unsafe-enum-comparison": {
       "count": 5
     }
@@ -845,15 +768,9 @@
     },
     "typescript/no-floating-promises": {
       "count": 1
-    },
-    "typescript/no-misused-promises": {
-      "count": 1
     }
   },
   "src/screens/E2E/SharedPreferencesTesterScreen.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 6
-    },
     "typescript/require-await": {
       "count": 6
     }
@@ -863,22 +780,9 @@
       "count": 1
     }
   },
-  "src/screens/Feeds/NoSavedFeedsOfAnyType.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
-  "src/screens/Home/NoFeedsPinned.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
   "src/screens/List/ListHiddenScreen.tsx": {
     "typescript/no-floating-promises": {
       "count": 3
-    },
-    "typescript/no-misused-promises": {
-      "count": 1
     }
   },
   "src/screens/Log.tsx": {
@@ -894,7 +798,7 @@
       "count": 1
     },
     "typescript/no-misused-promises": {
-      "count": 2
+      "count": 1
     },
     "typescript/no-unsafe-member-access": {
       "count": 2
@@ -922,19 +826,6 @@
   "src/screens/Onboarding/StepProfile/index.tsx": {
     "typescript/no-floating-promises": {
       "count": 2
-    },
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
-  "src/screens/Onboarding/StepSuggestedStarterpacks/StarterPackCard.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
-  "src/screens/Onboarding/StepSuggestedStarterpacks/index.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
     }
   },
   "src/screens/PostThread/components/ThreadItemAnchorFollowButton.tsx": {
@@ -962,18 +853,12 @@
   "src/screens/Profile/Header/EditProfileDialog.tsx": {
     "typescript/no-explicit-any": {
       "count": 3
-    },
-    "typescript/no-misused-promises": {
-      "count": 1
     }
   },
   "src/screens/Profile/Header/ProfileHeaderLabeler.tsx": {
     "typescript/no-explicit-any": {
       "count": 2
     },
-    "typescript/no-misused-promises": {
-      "count": 1
-    },
     "typescript/no-unsafe-member-access": {
       "count": 3
     }
@@ -1004,11 +889,6 @@
       "count": 1
     }
   },
-  "src/screens/ProfileList/components/Header.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 3
-    }
-  },
   "src/screens/ProfileList/components/MoreOptionsMenu.tsx": {
     "typescript/no-floating-promises": {
       "count": 1
@@ -1027,11 +907,6 @@
       "count": 1
     }
   },
-  "src/screens/SavedFeeds.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 2
-    }
-  },
   "src/screens/Search/modules/ExploreSuggestedAccounts.tsx": {
     "typescript/no-floating-promises": {
       "count": 1
@@ -1093,9 +968,6 @@
   "src/screens/Settings/components/ChangePasswordDialog.tsx": {
     "typescript/no-explicit-any": {
       "count": 2
-    },
-    "typescript/no-misused-promises": {
-      "count": 2
     }
   },
   "src/screens/Settings/components/CopyButton.tsx": {
@@ -1107,9 +979,6 @@
     "typescript/no-explicit-any": {
       "count": 1
     },
-    "typescript/no-misused-promises": {
-      "count": 1
-    },
     "typescript/no-unsafe-member-access": {
       "count": 1
     }
@@ -1119,11 +988,6 @@
       "count": 2
     }
   },
-  "src/screens/Settings/components/DisableEmail2FADialog.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 4
-    }
-  },
   "src/screens/Settings/components/OTAInfo.tsx": {
     "typescript/no-floating-promises": {
       "count": 1
@@ -1147,7 +1011,7 @@
       "count": 1
     },
     "typescript/no-misused-promises": {
-      "count": 2
+      "count": 1
     },
     "typescript/no-unsafe-call": {
       "count": 1
@@ -1168,9 +1032,6 @@
     "typescript/no-floating-promises": {
       "count": 1
     },
-    "typescript/no-misused-promises": {
-      "count": 2
-    },
     "typescript/require-await": {
       "count": 1
     }
@@ -1474,9 +1335,6 @@
   "src/view/com/composer/SelectMediaButton.tsx": {
     "typescript/no-floating-promises": {
       "count": 1
-    },
-    "typescript/no-misused-promises": {
-      "count": 1
     }
   },
   "src/view/com/composer/drafts/DraftsButton.tsx": {
@@ -1500,11 +1358,6 @@
       "count": 2
     }
   },
-  "src/view/com/composer/photos/EditImageDialog.web.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
   "src/view/com/composer/photos/Gallery.tsx": {
     "typescript/no-floating-promises": {
       "count": 1
@@ -1513,9 +1366,6 @@
   "src/view/com/composer/photos/OpenCameraBtn.tsx": {
     "typescript/no-explicit-any": {
       "count": 1
-    },
-    "typescript/no-misused-promises": {
-      "count": 1
     }
   },
   "src/view/com/composer/text-input/TextInput.web.tsx": {
@@ -1560,7 +1410,7 @@
       "count": 2
     },
     "typescript/no-misused-promises": {
-      "count": 3
+      "count": 2
     },
     "typescript/no-unsafe-member-access": {
       "count": 6
@@ -1598,12 +1448,6 @@
   "src/view/com/pager/TabBar.web.tsx": {
     "typescript/no-explicit-any": {
       "count": 1
-    },
-    "typescript/no-unsafe-call": {
-      "count": 2
-    },
-    "typescript/no-unsafe-member-access": {
-      "count": 4
     }
   },
   "src/view/com/post-thread/PostLikedBy.tsx": {
@@ -1627,9 +1471,6 @@
   "src/view/com/posts/FeedShutdownMsg.tsx": {
     "typescript/no-explicit-any": {
       "count": 2
-    },
-    "typescript/no-misused-promises": {
-      "count": 2
     }
   },
   "src/view/com/posts/PostFeedErrorMessage.tsx": {
@@ -1693,9 +1534,6 @@
   "src/view/com/util/Views.tsx": {
     "react/display-name": {
       "count": 1
-    },
-    "typescript/no-explicit-any": {
-      "count": 1
     }
   },
   "src/view/com/util/Views.web.tsx": {
@@ -1703,11 +1541,6 @@
       "count": 1
     }
   },
-  "src/view/com/util/forms/Button.tsx": {
-    "typescript/no-misused-promises": {
-      "count": 1
-    }
-  },
   "src/view/screens/Feeds.tsx": {
     "typescript/no-floating-promises": {
       "count": 3
diff --git a/src/Navigation.tsx b/src/Navigation.tsx
index ec3072f46d..daa76629d1 100644
--- a/src/Navigation.tsx
+++ b/src/Navigation.tsx
@@ -1006,7 +1006,7 @@ function RoutesContainer({children}: React.PropsWithChildren<{}>) {
 
     ax.metric('init', {
       initMs: Math.round(
-        // @ts-ignore Emitted by Metro in the bundle prelude
+        // @ts-expect-error Emitted by Metro in the bundle prelude
         performance.now() - global.__BUNDLE_START_TIME__,
       ),
     })
@@ -1081,7 +1081,7 @@ function navigate<K extends keyof AllNavigatorParams>(
         }
         navigationRef.addListener('state', handler)
 
-        // @ts-ignore I don't know what would make typescript happy but I have a life -prf
+        // @ts-expect-error I don't know what would make typescript happy but I have a life -prf
         navigationRef.navigate(name, params)
       }),
       timeout(1e3),
diff --git a/src/Splash.tsx b/src/Splash.tsx
index 4a4dea831a..76c9c7de82 100644
--- a/src/Splash.tsx
+++ b/src/Splash.tsx
@@ -20,14 +20,15 @@ import * as SplashScreen from 'expo-splash-screen'
 
 import {Logotype} from '#/view/icons/Logotype'
 import {atoms as a} from '#/alf'
-// @ts-ignore
+// @ts-expect-error
 import splashImagePointer from '../assets/splash/splash.png'
-// @ts-ignore
+// @ts-expect-error
 import darkSplashImagePointer from '../assets/splash/splash-dark.png'
-const splashImageUri = RNImage.resolveAssetSource(splashImagePointer).uri
+
+const splashImageUri = RNImage.resolveAssetSource(splashImagePointer)!.uri
 const darkSplashImageUri = RNImage.resolveAssetSource(
   darkSplashImagePointer,
-).uri
+)!.uri
 
 export const Logo = forwardRef(function LogoImpl(props: SvgProps, ref) {
   const width = 1000
@@ -35,7 +36,7 @@ export const Logo = forwardRef(function LogoImpl(props: SvgProps, ref) {
   return (
     <Svg
       fill="none"
-      // @ts-ignore it's fiiiiine
+      // @ts-expect-error it's fiiiiine
       ref={ref}
       viewBox="0 0 64 66"
       style={[{width, height}, props.style]}>
diff --git a/src/Splash.web.tsx b/src/Splash.web.tsx
index ff86c9a770..44e14baa33 100644
--- a/src/Splash.web.tsx
+++ b/src/Splash.web.tsx
@@ -7,7 +7,7 @@
 import {useEffect, useRef, useState} from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {atoms as a, flatten} from '#/alf'
+import {atoms as a, flattenToCSS} from '#/alf'
 
 const size = 100
 const ratio = 57 / 64
@@ -72,7 +72,7 @@ export function Splash({
       {!isAnimationComplete && (
         <div
           ref={splashRef}
-          style={flatten([
+          style={flattenToCSS([
             a.fixed,
             a.inset_0,
             a.flex,
diff --git a/src/ageAssurance/components/RedirectOverlay.tsx b/src/ageAssurance/components/RedirectOverlay.tsx
index 5b31e94365..18f176d248 100644
--- a/src/ageAssurance/components/RedirectOverlay.tsx
+++ b/src/ageAssurance/components/RedirectOverlay.tsx
@@ -149,7 +149,6 @@ export function RedirectOverlay() {
           t.atoms.bg,
           gtMobile ? a.p_2xl : a.p_xl,
           a.align_center,
-          // @ts-ignore
           platform({
             web: {
               paddingTop: '35vh',
diff --git a/src/alf/fonts.ts b/src/alf/fonts.ts
index da6ccee50d..526542273f 100644
--- a/src/alf/fonts.ts
+++ b/src/alf/fonts.ts
@@ -3,6 +3,8 @@ import {type FontVariant, type TextStyle} from 'react-native'
 import {IS_ANDROID, IS_WEB} from '#/env'
 import {type Device, device} from '#/storage'
 
+export type MutableTextStyle = {-readonly [K in keyof TextStyle]: TextStyle[K]}
+
 const WEB_FONT_FAMILIES = `system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"`
 
 const factor = 0.0625 // 1 - (15/16)
@@ -37,7 +39,10 @@ export function setFontFamily(fontFamily: Device['fontFamily']) {
 /*
  * Unused fonts are commented out, but the files are there if we need them.
  */
-export function applyFonts(style: TextStyle, fontFamily: 'system' | 'theme') {
+export function applyFonts(
+  style: MutableTextStyle,
+  fontFamily: 'system' | 'theme',
+) {
   if (fontFamily === 'theme') {
     if (IS_ANDROID) {
       style.fontFamily =
diff --git a/src/alf/typography.tsx b/src/alf/typography.tsx
index d1e9f96e99..da77ee985a 100644
--- a/src/alf/typography.tsx
+++ b/src/alf/typography.tsx
@@ -7,7 +7,13 @@ import {
 import {UITextView} from '@bsky.app/react-native-uitextview'
 import createEmojiRegex from 'emoji-regex'
 
-import {type Alf, applyFonts, atoms, flatten} from '#/alf'
+import {
+  type Alf,
+  applyFonts,
+  atoms,
+  flatten,
+  type MutableTextStyle,
+} from '#/alf'
 import {IS_IOS, IS_NATIVE} from '#/env'
 
 /**
@@ -27,7 +33,7 @@ export function normalizeTextStyles(
     fontFamily: Alf['fonts']['family']
   } & Pick<Alf, 'flags'>,
 ) {
-  const s = flatten(styles) ?? {}
+  const s: MutableTextStyle = {...flatten(styles)}
 
   // should always be defined on these components
   s.fontSize = (s.fontSize || atoms.text_md.fontSize) * fontScale
diff --git a/src/alf/util/dimensions.ts b/src/alf/util/dimensions.ts
index 31af2ffa99..e5d60055c1 100644
--- a/src/alf/util/dimensions.ts
+++ b/src/alf/util/dimensions.ts
@@ -1,5 +1,5 @@
 import {useEffect, useState} from 'react'
-import {Dimensions} from 'react-native'
+import {Dimensions, type DimensionsPayload} from 'react-native'
 
 /**
  * Same as `useWindowDimensions().fontScale`, but avoids rerendering
@@ -9,9 +9,12 @@ export function useNativeFontScale() {
   const [fontScale, setFontScale] = useState(Dimensions.get('window').fontScale)
 
   useEffect(() => {
-    const sub = Dimensions.addEventListener('change', evt => {
-      setFontScale(evt.window.fontScale)
-    })
+    const sub = Dimensions.addEventListener(
+      'change',
+      (evt: DimensionsPayload) => {
+        if (evt.window) setFontScale(evt.window.fontScale)
+      },
+    )
     return () => sub.remove()
   }, [])
 
diff --git a/src/alf/util/flatten.ts b/src/alf/util/flatten.ts
index 6d49ce6e51..b218c8879e 100644
--- a/src/alf/util/flatten.ts
+++ b/src/alf/util/flatten.ts
@@ -1,6 +1,19 @@
-import {type DimensionValue, StyleSheet} from 'react-native'
+import {type DimensionValue, type StyleProp, StyleSheet} from 'react-native'
 
-export const flatten = StyleSheet.flatten
+export function flatten<T>(
+  style?: StyleProp<T>,
+): T extends (infer U)[] ? U : T {
+  return (StyleSheet.flatten(
+    style as unknown as Parameters<typeof StyleSheet.flatten>[0],
+  ) ?? {}) as T extends (infer U)[] ? U : T
+}
+
+/** Flatten React Native styles passed directly to a web-only DOM component. */
+export function flattenToCSS(style: unknown): React.CSSProperties {
+  return (StyleSheet.flatten(
+    style as Parameters<typeof StyleSheet.flatten>[0],
+  ) ?? {}) as React.CSSProperties
+}
 
 /**
  * Coerce a style value to a number. Padding values are typed as
@@ -28,7 +41,7 @@ interface PaddingStyle {
  * non-numeric `DimensionValue` (e.g. percentages) is treated as 0.
  */
 export function extractPadding(style: PaddingStyle | PaddingStyle[]) {
-  const s = flatten(style as any) ?? {}
+  const s = flatten(style)
   const base = num(s.padding)
   return {
     paddingTop: num(s.paddingTop) || num(s.paddingVertical) || base,
diff --git a/src/alf/util/useColorModeTheme.ts b/src/alf/util/useColorModeTheme.ts
index 7cb9b12723..dfcc57b53a 100644
--- a/src/alf/util/useColorModeTheme.ts
+++ b/src/alf/util/useColorModeTheme.ts
@@ -24,7 +24,7 @@ export function useThemeName(): ThemeName {
 }
 
 function getThemeName(
-  colorScheme: ColorSchemeName,
+  colorScheme: ColorSchemeName | null | undefined,
   colorMode: 'system' | 'light' | 'dark',
   darkTheme?: ThemeName,
 ) {
@@ -39,11 +39,8 @@ function getThemeName(
 }
 
 function updateDocument(theme: ThemeName) {
-  // @ts-ignore web only
   if (IS_WEB && typeof window !== 'undefined') {
-    // @ts-ignore web only
     const html = window.document.documentElement
-    // @ts-ignore web only
     const meta = window.document.querySelector('meta[name="theme-color"]')
 
     // remove any other color mode classes
diff --git a/src/analytics/utils.ts b/src/analytics/utils.ts
index 95d2efb589..b20b3719c9 100644
--- a/src/analytics/utils.ts
+++ b/src/analytics/utils.ts
@@ -14,7 +14,7 @@ import {
 export function useMeta(metadata?: MergeableMetadata) {
   const m = useMemo(() => metadata, [metadata])
   if (!m) return
-  // @ts-ignore
+  // @ts-expect-error
   m.__meta = true
   return m
 }
diff --git a/src/components/AltBadgeWithDialog.tsx b/src/components/AltBadgeWithDialog.tsx
index 07cf9544f0..4ae078e12b 100644
--- a/src/components/AltBadgeWithDialog.tsx
+++ b/src/components/AltBadgeWithDialog.tsx
@@ -1,9 +1,9 @@
-import {Pressable} from 'react-native'
 import {Trans, useLingui} from '@lingui/react/macro'
 
 import {HITSLOP_20} from '#/lib/constants'
 import {useLargeAltBadgeEnabled} from '#/state/preferences/large-alt-badge'
 import {atoms as a, useTheme} from '#/alf'
+import {Pressable} from '#/components/Pressable'
 import * as Prompt from '#/components/Prompt'
 import {Text} from '#/components/Typography'
 
@@ -49,7 +49,7 @@ export function AltBadgeWithDialog({
         accessibilityHint=""
         hitSlop={HITSLOP_20}
         onPress={control.open}
-        style={s => [
+        style={({pressed, hovered}) => [
           a.justify_center,
           a.rounded_sm,
           a.p_xs,
@@ -62,7 +62,7 @@ export function AltBadgeWithDialog({
             opacity: 0.8,
           },
           pos,
-          s.hovered || s.pressed
+          hovered || pressed
             ? [
                 {
                   opacity: 1,
diff --git a/src/components/BetaBadge.tsx b/src/components/BetaBadge.tsx
index 115f8d0046..c8c0ddd2bf 100644
--- a/src/components/BetaBadge.tsx
+++ b/src/components/BetaBadge.tsx
@@ -1,11 +1,12 @@
 import {useState} from 'react'
-import {type Insets, Pressable, View} from 'react-native'
+import {type Insets, View} from 'react-native'
 import {Trans, useLingui} from '@lingui/react/macro'
 
 import {usePreferencesQuery} from '#/state/queries/preferences'
 import {useSession} from '#/state/session'
 import {atoms as a, useTheme} from '#/alf'
 import {Beaker_Stroke2_Corner2_Rounded as BeakerIcon} from '#/components/icons/Beaker'
+import {Pressable} from '#/components/Pressable'
 import * as Tooltip from '#/components/Tooltip'
 import type * as bsky from '#/types/bsky'
 
diff --git a/src/components/Button.tsx b/src/components/Button.tsx
index 54332fbc07..2c1f7ff3f8 100644
--- a/src/components/Button.tsx
+++ b/src/components/Button.tsx
@@ -101,6 +101,8 @@ export type ButtonProps = Pick<
   | 'onPressOut'
   | 'onFocus'
   | 'onBlur'
+  | 'onAccessibilityAction'
+  | 'onAccessibilityEscape'
 > &
   AccessibilityProps &
   VariantProps & {
@@ -131,7 +133,7 @@ export function useButtonContext() {
   return useContext(Context)
 }
 
-export const Button = forwardRef<View, ButtonProps>(
+export const Button = forwardRef<React.ComponentRef<typeof View>, ButtonProps>(
   (
     {
       children,
@@ -575,7 +577,6 @@ export const Button = forwardRef<View, ButtonProps>(
         role="button"
         accessibilityHint={undefined} // optional
         {...rest}
-        // @ts-ignore - this will always be a pressable
         ref={ref}
         aria-label={label}
         aria-pressed={state.pressed}
diff --git a/src/components/Composer/index.tsx b/src/components/Composer/index.tsx
index f4a0302ff7..b2266db5a1 100644
--- a/src/components/Composer/index.tsx
+++ b/src/components/Composer/index.tsx
@@ -39,6 +39,9 @@ import {
 import {Span, Text} from '#/components/Typography'
 import {IS_IOS, IS_WEB, IS_WEB_TOUCH_DEVICE} from '#/env'
 
+type TextInputInstance = React.ComponentRef<typeof TextInput>
+type ViewInstance = React.ComponentRef<typeof View>
+
 export type SubmitRequest =
   | {
       platform: 'web'
@@ -60,7 +63,7 @@ export type ComposerInternalApi = {
   input?: ReturnType<typeof useTapper>['input']
   clear: () => void
   insert(text: string): void
-  setAutocompleteAnchor: (node: View | null) => void
+  setAutocompleteAnchor: (node: ViewInstance | null) => void
 }
 
 export function useComposerInternalApiRef() {
@@ -82,7 +85,7 @@ export type ComposerProps = Omit<
   | 'onSubmitEditing'
 > & {
   label: string
-  ref?: React.RefObject<TextInput>
+  ref?: React.RefObject<TextInputInstance>
   internalApiRef?: React.Ref<ComposerInternalApi>
   outerStyle?: ViewStyleProp['style']
   contentTextStyle?: TextStyleProp['style']
@@ -139,6 +142,11 @@ export function Composer({
     placement: autocompletePlacement,
     dynamicWidth: IS_WEB,
   })
+  const inputRef = mergeRefs<TextInputInstance>([
+    ref,
+    tapper.inputProps.ref as React.Ref<TextInputInstance>,
+    sift.targetProps.ref as React.Ref<TextInputInstance>,
+  ])
 
   /*
    * Active facet state for controlling the visibility of the Autocomplete.
@@ -306,7 +314,7 @@ export function Composer({
             style={[a.absolute, a.inset_0, a.z_10, {overflow: 'hidden'}]}
             ref={node => {
               if (IS_WEB && node) {
-                // @ts-ignore web only a11y
+                // @ts-expect-error web only a11y
                 node.setAttribute('inert', '')
               }
             }}>
@@ -345,7 +353,7 @@ export function Composer({
           {...rest}
           {...tapper.inputProps}
           {...sift.targetProps}
-          ref={mergeRefs([ref, tapper.inputProps.ref, sift.targetProps.ref])}
+          ref={inputRef}
           rawValue={tapper.state.text}
           onBlur={e => {
             rest.onBlur?.(e)
@@ -359,11 +367,10 @@ export function Composer({
               inputScrollSharedValue.value = e.nativeEvent.contentOffset.y
             }
           }}
-          // @ts-ignore web only
+          // @ts-expect-error web only
           onCompositionStart={() => {
             isComposing.current = true
           }}
-          // @ts-ignore web only
           onCompositionEnd={() => {
             isComposing.current = false
           }}
diff --git a/src/components/ContextMenu/index.tsx b/src/components/ContextMenu/index.tsx
index d09e0e60ec..95492a385a 100644
--- a/src/components/ContextMenu/index.tsx
+++ b/src/components/ContextMenu/index.tsx
@@ -244,7 +244,7 @@ export function Trigger({
   const context = useContextMenuContext()
   const playHaptic = useHaptics()
   const insets = useSafeAreaInsets()
-  const ref = useRef<View>(null)
+  const ref = useRef<React.ComponentRef<typeof View>>(null)
   const isFocused = useIsFocused()
   const [image, setImage] = useState<string | null>(null)
   const [pendingMeasurement, setPendingMeasurement] = useState<{
@@ -971,7 +971,10 @@ export function Divider() {
   )
 }
 
-function measureView(view: View | null, insets: EdgeInsets) {
+function measureView(
+  view: React.ComponentRef<typeof View> | null,
+  insets: EdgeInsets,
+) {
   if (!view) return Promise.resolve(null)
   return new Promise<Measurement>(resolve => {
     view?.measureInWindow((x, y, width, height) =>
diff --git a/src/components/Dialog/index.tsx b/src/components/Dialog/index.tsx
index 4f6984a4a0..5cfa2d1c10 100644
--- a/src/components/Dialog/index.tsx
+++ b/src/components/Dialog/index.tsx
@@ -8,7 +8,7 @@ import {
 } from 'react'
 import {
   Keyboard,
-  type KeyboardEventListener,
+  type KeyboardEvent,
   type LayoutChangeEvent,
   type NativeScrollEvent,
   type NativeSyntheticEvent,
@@ -203,80 +203,85 @@ export function Inner(props: DialogInnerProps) {
   return <ScrollableInner {...props} />
 }
 
-export const ScrollableInner = forwardRef<ScrollView, DialogInnerProps>(
-  function ScrollableInner(
-    {children, contentContainerStyle, header, footer, style, ...props},
-    ref,
-  ) {
-    const {nativeSnapPoint, disableDrag, setDisableDrag, isHeightConstrained} =
-      useDialogContext()
-    const isAtMaxSnapPoint = nativeSnapPoint === BottomSheetSnapPoint.Full
-    const insets = useSafeAreaInsets()
-    const [keyboardHeight, setKeyboardHeight] = useState(() =>
-      IS_ANDROID ? (Keyboard.metrics()?.height ?? 0) : 0,
-    )
+export function ScrollableInner({
+  ref,
+  children,
+  contentContainerStyle,
+  header,
+  footer,
+  style,
+  ...props
+}: DialogInnerProps & {
+  ref?: React.Ref<React.ComponentRef<typeof ScrollView>>
+}) {
+  const {nativeSnapPoint, disableDrag, setDisableDrag, isHeightConstrained} =
+    useDialogContext()
+  const isAtMaxSnapPoint = nativeSnapPoint === BottomSheetSnapPoint.Full
+  const insets = useSafeAreaInsets()
+  const [keyboardHeight, setKeyboardHeight] = useState(() =>
+    IS_ANDROID ? (Keyboard.metrics()?.height ?? 0) : 0,
+  )
 
-    const keyboardEventHandler = useCallback<KeyboardEventListener>(e => {
-      setKeyboardHeight(e.endCoordinates.height)
-    }, [])
-    useOnKeyboard('keyboardDidShow', keyboardEventHandler)
-    useOnKeyboard('keyboardDidHide', keyboardEventHandler)
+  const keyboardEventHandler = useCallback((e: KeyboardEvent) => {
+    setKeyboardHeight(e.endCoordinates.height)
+  }, [])
+  useOnKeyboard('keyboardDidShow', keyboardEventHandler)
+  useOnKeyboard('keyboardDidHide', keyboardEventHandler)
 
-    const onScroll = (e: NativeSyntheticEvent<NativeScrollEvent>) => {
-      if (!IS_ANDROID) {
-        return
-      }
-      const {contentOffset} = e.nativeEvent
-      if (contentOffset.y > 0 && !disableDrag) {
-        setDisableDrag(true)
-      } else if (contentOffset.y <= 1 && disableDrag) {
-        setDisableDrag(false)
-      }
+  const onScroll = (e: NativeSyntheticEvent<NativeScrollEvent>) => {
+    if (!IS_ANDROID) {
+      return
     }
+    const {contentOffset} = e.nativeEvent
+    if (contentOffset.y > 0 && !disableDrag) {
+      setDisableDrag(true)
+    } else if (contentOffset.y <= 1 && disableDrag) {
+      setDisableDrag(false)
+    }
+  }
 
-    return (
-      <>
-        <ScrollView
-          style={[isHeightConstrained && a.flex_1, style]}
-          contentContainerStyle={[
-            a.pt_2xl,
-            IS_LIQUID_GLASS ? a.px_2xl : a.px_xl,
-            platform({
-              ios: a.pb_2xl,
-              android: {
-                paddingBottom: keyboardHeight + insets.bottom + tokens.space.xl,
-              },
-            }),
-            contentContainerStyle,
-          ]}
-          ref={ref}
-          showsVerticalScrollIndicator={IS_ANDROID ? false : undefined}
-          contentInsetAdjustmentBehavior={
-            isAtMaxSnapPoint ? 'automatic' : 'never'
-          }
-          automaticallyAdjustKeyboardInsets={isAtMaxSnapPoint}
-          {...props}
-          bounces={isAtMaxSnapPoint}
-          scrollEventThrottle={50}
-          // set drag state based on scroll on android.
-          // we want to detect if it's at the top or not, so watch
-          // scrollEndDrag and momentumScrollEnd as well
-          onScroll={android(onScroll)}
-          onScrollEndDrag={android(onScroll)}
-          onMomentumScrollEnd={android(onScroll)}
-          keyboardShouldPersistTaps="handled"
-          // TODO: figure out why this positions the header absolutely (rather than stickily)
-          // on Android. fine to disable for now, because we don't have any
-          // dialogs that use this that actually scroll -sfn
-          stickyHeaderIndices={ios(header ? [0] : undefined)}>
-          {header}
-          {children}
-        </ScrollView>
-        {footer}
-      </>
-    )
-  },
-)
+  return (
+    <>
+      <ScrollView
+        style={[isHeightConstrained && a.flex_1, style]}
+        contentContainerStyle={[
+          a.pt_2xl,
+          IS_LIQUID_GLASS ? a.px_2xl : a.px_xl,
+          platform({
+            ios: a.pb_2xl,
+            android: {
+              paddingBottom: keyboardHeight + insets.bottom + tokens.space.xl,
+            },
+          }),
+          contentContainerStyle,
+        ]}
+        ref={ref}
+        showsVerticalScrollIndicator={IS_ANDROID ? false : undefined}
+        contentInsetAdjustmentBehavior={
+          isAtMaxSnapPoint ? 'automatic' : 'never'
+        }
+        automaticallyAdjustKeyboardInsets={isAtMaxSnapPoint}
+        {...props}
+        bounces={isAtMaxSnapPoint}
+        scrollEventThrottle={50}
+        // set drag state based on scroll on android.
+        // we want to detect if it's at the top or not, so watch
+        // scrollEndDrag and momentumScrollEnd as well
+        onScroll={android(onScroll)}
+        onScrollEndDrag={android(onScroll)}
+        onMomentumScrollEnd={android(onScroll)}
+        keyboardShouldPersistTaps="handled"
+        // TODO: figure out why this positions the header absolutely (rather than stickily)
+        // on Android. fine to disable for now, because we don't have any
+        // dialogs that use this that actually scroll -sfn
+        stickyHeaderIndices={ios(header ? [0] : undefined)}>
+        {header}
+        {children}
+      </ScrollView>
+      {footer}
+    </>
+  )
+}
 
 export const InnerFlatList = forwardRef<
   ListMethods,
diff --git a/src/components/Dialog/index.web.tsx b/src/components/Dialog/index.web.tsx
index c26a71825b..e867acd60a 100644
--- a/src/components/Dialog/index.web.tsx
+++ b/src/components/Dialog/index.web.tsx
@@ -193,7 +193,6 @@ export function Inner({
         aria-label={label}
         aria-labelledby={accessibilityLabelledBy}
         aria-describedby={accessibilityDescribedBy}
-        // @ts-expect-error web only -prf
         onClick={stopPropagation}
         onStartShouldSetResponder={_ => true}
         onTouchEnd={stopPropagation}
@@ -239,7 +238,9 @@ export function Inner({
 export function ScrollableInner({
   ref: _ref,
   ...props
-}: DialogInnerProps & {ref?: React.Ref<ScrollView>}) {
+}: DialogInnerProps & {
+  ref?: React.Ref<React.ComponentRef<typeof ScrollView>>
+}) {
   return <Inner {...props} />
 }
 
diff --git a/src/components/FeedInterstitials.tsx b/src/components/FeedInterstitials.tsx
index aa77a7b36b..59bbe85752 100644
--- a/src/components/FeedInterstitials.tsx
+++ b/src/components/FeedInterstitials.tsx
@@ -217,7 +217,7 @@ export function ProfileGrid({
 
   // Track seen profiles
   const seenProfilesRef = useRef<Set<string>>(new Set())
-  const containerRef = useRef<View>(null)
+  const containerRef = useRef<React.ComponentRef<typeof View>>(null)
   const hasTrackedRef = useRef(false)
   const logContext: Metrics['suggestedUser:seen']['logContext'] = isFeedContext
     ? 'DiscoverInterstitial'
@@ -276,7 +276,7 @@ export function ProfileGrid({
         },
         {threshold: 0.5},
       )
-      // @ts-ignore - web only
+      // @ts-expect-error - web only
       observer.observe(node)
       return () => observer.disconnect()
     } else {
diff --git a/src/components/FocusScope/index.tsx b/src/components/FocusScope/index.tsx
index 48e013500e..598c3cd6ca 100644
--- a/src/components/FocusScope/index.tsx
+++ b/src/components/FocusScope/index.tsx
@@ -41,7 +41,7 @@ export function FocusScope({children}: {children: React.ReactNode}) {
  */
 function FocusTrap({children}: {children: React.ReactNode}) {
   const {_} = useLingui()
-  const child = useRef<View>(null)
+  const child = useRef<React.ComponentRef<typeof View>>(null)
 
   /*
    * Here we add a ref to the first child of this component. This currently
@@ -66,13 +66,16 @@ function FocusTrap({children}: {children: React.ReactNode}) {
     })
   }, [children])
 
-  const focusNode = useCallback((ref: View | null) => {
-    if (!ref) return
-    const node = findNodeHandle(ref)
-    if (node) {
-      AccessibilityInfo.setAccessibilityFocus(node)
-    }
-  }, [])
+  const focusNode = useCallback(
+    (ref: React.ComponentRef<typeof View> | null) => {
+      if (!ref) return
+      const node = findNodeHandle(ref)
+      if (node) {
+        AccessibilityInfo.setAccessibilityFocus(node)
+      }
+    },
+    [],
+  )
 
   useEffect(() => {
     setTimeout(() => {
diff --git a/src/components/GlassView.tsx b/src/components/GlassView.tsx
index cac5bd268d..ddbcc07d80 100644
--- a/src/components/GlassView.tsx
+++ b/src/components/GlassView.tsx
@@ -20,7 +20,7 @@ export const IS_GLASS_AVAILABLE =
  */
 export const GlassView = IS_GLASS_AVAILABLE ? InnerGlassView : FallbackView
 
-export type GlassViewProps = ExpoGlassViewProps & {
+export type GlassViewProps = Omit<ExpoGlassViewProps, 'ref'> & {
   fallbackStyle?: StyleProp<ViewStyle>
 }
 
diff --git a/src/components/InterestTabs.tsx b/src/components/InterestTabs.tsx
index 5df1fb62e3..5a99a36992 100644
--- a/src/components/InterestTabs.tsx
+++ b/src/components/InterestTabs.tsx
@@ -47,7 +47,7 @@ export function InterestTabs({
 }) {
   const t = useTheme()
   const {_} = useLingui()
-  const listRef = useRef<ScrollView>(null)
+  const listRef = useRef<React.ComponentRef<typeof ScrollView>>(null)
   const [totalWidth, setTotalWidth] = useState(0)
   const [scrollX, setScrollX] = useState(0)
   const [contentWidth, setContentWidth] = useState(0)
diff --git a/src/components/Layout/Header/index.tsx b/src/components/Layout/Header/index.tsx
index a0bd45c8fc..c70cebd703 100644
--- a/src/components/Layout/Header/index.tsx
+++ b/src/components/Layout/Header/index.tsx
@@ -42,7 +42,7 @@ export function Outer({
 }: {
   children: React.ReactNode
   noBottomBorder?: boolean
-  headerRef?: React.RefObject<View | null>
+  headerRef?: React.RefObject<React.ComponentRef<typeof View> | null>
   sticky?: boolean
 }) {
   const t = useTheme()
diff --git a/src/components/Lightbox/Lightbox.web.tsx b/src/components/Lightbox/Lightbox.web.tsx
index 0222aa3156..cccbe4f851 100644
--- a/src/components/Lightbox/Lightbox.web.tsx
+++ b/src/components/Lightbox/Lightbox.web.tsx
@@ -446,9 +446,7 @@ function LightboxGalleryItem({
 
 const styles = StyleSheet.create({
   avi: {
-    // @ts-ignore web-only
     maxWidth: `calc(min(400px, 100vw))`,
-    // @ts-ignore web-only
     maxHeight: `calc(min(400px, 100vh))`,
     padding: 16,
     boxSizing: 'border-box',
@@ -458,7 +456,6 @@ const styles = StyleSheet.create({
     // column via ScrollView's default flexGrow.
     flexGrow: 0,
     flexShrink: 0,
-    // @ts-ignore web-only -sfn
     maxHeight: '50vh',
   },
   menuBtn: {
diff --git a/src/components/Lightbox/chrome/ImageMenu.tsx b/src/components/Lightbox/chrome/ImageMenu.tsx
index 9088b9ded9..14ce100c0f 100644
--- a/src/components/Lightbox/chrome/ImageMenu.tsx
+++ b/src/components/Lightbox/chrome/ImageMenu.tsx
@@ -35,7 +35,7 @@ const TIMING_OUT = {duration: 150}
 
 export function ImageMenu({onPressShare, onPressSave}: Props) {
   const {t: l} = useLingui()
-  const triggerRef = useRef<View>(null)
+  const triggerRef = useRef<React.ComponentRef<typeof View>>(null)
   const [isMounted, setIsMounted] = useState(false)
   const [anchor, setAnchor] = useState<Anchor | null>(null)
   const progress = useSharedValue(0)
diff --git a/src/components/Lightbox/pager/ImageItem/ImageItem.ios.tsx b/src/components/Lightbox/pager/ImageItem/ImageItem.ios.tsx
index 9cf088f864..c4a842a74e 100644
--- a/src/components/Lightbox/pager/ImageItem/ImageItem.ios.tsx
+++ b/src/components/Lightbox/pager/ImageItem/ImageItem.ios.tsx
@@ -82,7 +82,7 @@ const ImageItem = ({
   const scrollHandler = useAnimatedScrollHandler({
     onScroll(e) {
       'worklet'
-      const nextIsScaled = e.zoomScale > 1
+      const nextIsScaled = (e.zoomScale ?? 1) > 1
       if (scaled !== nextIsScaled) {
         scheduleOnRN(handleZoom, nextIsScaled)
       }
@@ -109,7 +109,6 @@ const ImageItem = ({
     height: number
   }) {
     const scrollResponderRef = scrollViewRef?.current?.getScrollResponder()
-    // @ts-ignore
     scrollResponderRef?.scrollResponderZoomTo({
       ...nextZoomRect, // This rect is in screen coordinates
       animated: true,
@@ -218,7 +217,6 @@ const ImageItem = ({
   return (
     <GestureDetector gesture={composedGesture}>
       <Animated.ScrollView
-        // @ts-ignore Something's up with the types here
         ref={scrollViewRef}
         pinchGestureEnabled
         showsHorizontalScrollIndicator={false}
diff --git a/src/components/Lightbox/pager/ImagePager.tsx b/src/components/Lightbox/pager/ImagePager.tsx
index 28c75be2cc..d89bb74d85 100644
--- a/src/components/Lightbox/pager/ImagePager.tsx
+++ b/src/components/Lightbox/pager/ImagePager.tsx
@@ -11,7 +11,10 @@ import {useCallback, useEffect, useMemo, useState} from 'react'
 import {PixelRatio, StyleSheet, useWindowDimensions, View} from 'react-native'
 import {SystemBars} from 'react-native-edge-to-edge'
 import {Gesture} from 'react-native-gesture-handler'
-import PagerView from 'react-native-pager-view'
+import PagerView, {
+  type PagerViewOnPageSelectedEvent,
+  type PageScrollStateChangedNativeEvent,
+} from 'react-native-pager-view'
 import Animated, {
   type AnimatableValue,
   type AnimatedRef,
@@ -383,7 +386,7 @@ function ImageView({
       <PagerView
         scrollEnabled={!isScaled}
         initialPage={initialImageIndex}
-        onPageSelected={e => {
+        onPageSelected={(e: PagerViewOnPageSelectedEvent) => {
           const next = e.nativeEvent.position
           setImageIndex(prev => {
             if (metricsContext && prev !== next) {
@@ -401,7 +404,7 @@ function ImageView({
           })
           setIsScaled(false)
         }}
-        onPageScrollStateChanged={e => {
+        onPageScrollStateChanged={(e: PageScrollStateChangedNativeEvent) => {
           setIsDragging(e.nativeEvent.pageScrollState !== 'idle')
         }}
         overdrag={true}
diff --git a/src/components/Link.tsx b/src/components/Link.tsx
index 6d60edb615..8e5891f3b2 100644
--- a/src/components/Link.tsx
+++ b/src/components/Link.tsx
@@ -478,7 +478,7 @@ export function InlineLinkText({
     onIn: onInteract,
     onOut: onInteractOut,
   } = useInteractionState()
-  const flattenedStyle = flatten(style) || {}
+  const flattenedStyle = flatten(style)
 
   return (
     <Text
@@ -570,7 +570,7 @@ export function SimpleInlineLinkText({
     onIn: onInteract,
     onOut: onInteractOut,
   } = useInteractionState()
-  const flattenedStyle = flatten(style) || {}
+  const flattenedStyle = flatten(style)
   const isExternal = isExternalUrl(to)
 
   let href = to
diff --git a/src/components/Menu/index.web.tsx b/src/components/Menu/index.web.tsx
index fed19c81af..ab7ac7dbc2 100644
--- a/src/components/Menu/index.web.tsx
+++ b/src/components/Menu/index.web.tsx
@@ -11,7 +11,7 @@ import {useLingui} from '@lingui/react'
 import {DropdownMenu} from 'radix-ui'
 
 import {useA11y} from '#/state/a11y'
-import {atoms as a, flatten, useTheme, web} from '#/alf'
+import {atoms as a, flatten, flattenToCSS, useTheme, web} from '#/alf'
 import type * as Dialog from '#/components/Dialog'
 import {useInteractionState} from '#/components/hooks/useInteractionState'
 import {
@@ -413,7 +413,7 @@ export function Divider() {
   const t = useTheme()
   return (
     <DropdownMenu.Separator
-      style={flatten([
+      style={flattenToCSS([
         a.my_xs,
         t.atoms.bg_contrast_100,
         a.flex_shrink_0,
diff --git a/src/components/Menu/types.ts b/src/components/Menu/types.ts
index c0f7e50a42..0599f6af44 100644
--- a/src/components/Menu/types.ts
+++ b/src/components/Menu/types.ts
@@ -28,7 +28,7 @@ export type RadixPassThroughTriggerProps = {
   ['aria-controls']?: string
   ['aria-haspopup']?: boolean
   ['aria-expanded']?: AccessibilityProps['aria-expanded']
-  onKeyDown: (e: React.KeyboardEvent) => void
+  onKeyDown: PressableProps['onKeyDown']
   /**
    * Radix provides this, but we override on web to use `onPress` instead,
    * which is less sensitive while scrolling.
diff --git a/src/components/Post/Embed/VideoEmbed/VideoEmbedInner/VideoEmbedInnerWeb.tsx b/src/components/Post/Embed/VideoEmbed/VideoEmbedInner/VideoEmbedInnerWeb.tsx
index d20cc0d90a..947d4ac3d6 100644
--- a/src/components/Post/Embed/VideoEmbed/VideoEmbedInner/VideoEmbedInnerWeb.tsx
+++ b/src/components/Post/Embed/VideoEmbed/VideoEmbedInner/VideoEmbedInnerWeb.tsx
@@ -149,7 +149,7 @@ function canPlayBskyVideoCodecs(): boolean {
 
 type CachedPromise<T> = Promise<T> & {value: undefined | T}
 const promiseForHls = import(
-  // @ts-ignore
+  // @ts-expect-error
   'hls.js/dist/hls.min'
   // oxlint-disable-next-line typescript/no-unsafe-member-access
 ).then(mod => mod.default) as CachedPromise<typeof HlsTypes.default>
diff --git a/src/components/Post/Translated/index.tsx b/src/components/Post/Translated/index.tsx
index 849222df03..6d44e9ce75 100644
--- a/src/components/Post/Translated/index.tsx
+++ b/src/components/Post/Translated/index.tsx
@@ -267,7 +267,7 @@ function TranslationResult({
     ? codeToLanguageName(resultSourceLanguage, i18n.locale)
     : undefined
 
-  const flattenedStyle = flatten(postTextStyle) ?? {}
+  const flattenedStyle = flatten(postTextStyle)
   const fontSize = flattenedStyle.fontSize
 
   return (
diff --git a/src/components/PostControls/PostControlButton.tsx b/src/components/PostControls/PostControlButton.tsx
index 3ea85e2811..e65a931f7d 100644
--- a/src/components/PostControls/PostControlButton.tsx
+++ b/src/components/PostControls/PostControlButton.tsx
@@ -27,7 +27,7 @@ export function PostControlButton({
   activeColor,
   ...props
 }: Omit<ButtonProps, 'hitSlop'> & {
-  ref?: React.Ref<View>
+  ref?: React.Ref<React.ComponentRef<typeof View>>
   active?: boolean
   big?: boolean
   color?: string
diff --git a/src/components/Pressable.tsx b/src/components/Pressable.tsx
new file mode 100644
index 0000000000..5fc96e3047
--- /dev/null
+++ b/src/components/Pressable.tsx
@@ -0,0 +1,37 @@
+import {
+  Pressable as NativePressable,
+  type PressableStateCallbackType as NativePressableStateCallbackType,
+  type StyleProp,
+  type ViewStyle,
+} from 'react-native'
+
+export interface PressableStateCallbackType extends NativePressableStateCallbackType {
+  /** Provided by react-native-web. */
+  readonly focused?: boolean
+  /** Provided by react-native-web. */
+  readonly hovered?: boolean
+}
+
+export type PressableProps = Omit<
+  React.ComponentProps<typeof NativePressable>,
+  'children' | 'style'
+> & {
+  children?:
+    React.ReactNode | ((state: PressableStateCallbackType) => React.ReactNode)
+  style?:
+    | StyleProp<ViewStyle>
+    | ((state: PressableStateCallbackType) => StyleProp<ViewStyle>)
+}
+
+/**
+ * React Native Pressable with react-native-web's callback state represented in
+ * its types. The web-only fields are optional because native does not provide
+ * them at runtime.
+ */
+export function Pressable({children, style, ...props}: PressableProps) {
+  return (
+    <NativePressable {...props} style={style}>
+      {children}
+    </NativePressable>
+  )
+}
diff --git a/src/components/ProfileHoverCard/index.web.tsx b/src/components/ProfileHoverCard/index.web.tsx
index ccc48b8951..a5f47be28b 100644
--- a/src/components/ProfileHoverCard/index.web.tsx
+++ b/src/components/ProfileHoverCard/index.web.tsx
@@ -318,11 +318,10 @@ export function ProfileHoverCardInner(props: ProfileHoverCardProps) {
 
   return (
     <View
-      // @ts-ignore View is being used as div
       ref={refs.setReference}
       onPointerMove={onPointerMoveTarget}
       onPointerLeave={onPointerLeaveTarget}
-      // @ts-ignore web only prop
+      // @ts-expect-error web only prop
       onMouseUp={onPress}
       style={[a.flex_shrink, props.inline && a.inline]}>
       {props.children}
diff --git a/src/components/ProgressGuide/FollowDialog.tsx b/src/components/ProgressGuide/FollowDialog.tsx
index d7fa9c1fab..1ab2668ae5 100644
--- a/src/components/ProgressGuide/FollowDialog.tsx
+++ b/src/components/ProgressGuide/FollowDialog.tsx
@@ -1,5 +1,5 @@
 import {memo, useCallback, useEffect, useMemo, useRef, useState} from 'react'
-import {TextInput, View, type ViewToken} from 'react-native'
+import {type ListViewToken as ViewToken, TextInput, View} from 'react-native'
 import {type ModerationOpts} from '@bsky/sdk/moderation'
 import {Trans, useLingui} from '@lingui/react/macro'
 
@@ -139,7 +139,7 @@ function DialogInner({guide}: {guide?: Follow10ProgressGuide}) {
   const [searchText, setSearchText] = useState(lastSearchText)
   const moderationOpts = useModerationOpts()
   const listRef = useRef<ListMethods>(null)
-  const inputRef = useRef<TextInput>(null)
+  const inputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
   const [headerHeight, setHeaderHeight] = useState(0)
   const {currentAccount} = useSession()
 
@@ -374,7 +374,7 @@ let Header = ({
   interestsDisplayNames,
 }: {
   guide?: Follow10ProgressGuide
-  inputRef: React.RefObject<TextInput | null>
+  inputRef: React.RefObject<React.ComponentRef<typeof TextInput> | null>
   listRef: React.RefObject<ListMethods | null>
   onSelectTab: (v: string) => void
   searchText: string
@@ -679,7 +679,7 @@ function SearchInput({
 }: {
   onChangeText: (text: string) => void
   onEscape: () => void
-  inputRef: React.RefObject<TextInput | null>
+  inputRef: React.RefObject<React.ComponentRef<typeof TextInput> | null>
   defaultValue: string
 }) {
   const t = useTheme()
diff --git a/src/components/RichText.tsx b/src/components/RichText.tsx
index 0266dae0ce..1fa020f2a9 100644
--- a/src/components/RichText.tsx
+++ b/src/components/RichText.tsx
@@ -93,7 +93,7 @@ export function RichText({
 
   if (!facets?.length) {
     if (isOnlyEmoji(text)) {
-      const flattenedStyle = flatten(style) ?? {}
+      const flattenedStyle = flatten(style)
       const fontSize =
         (flattenedStyle.fontSize ?? a.text_sm.fontSize) * emojiMultiplier
       return (
@@ -104,7 +104,6 @@ export function RichText({
           style={[plainStyles, {fontSize}, suffixStyles]}
           onLayout={onLayout}
           onTextLayout={onTextLayout}
-          // @ts-ignore web only -prf
           dataSet={WORD_WRAP}>
           {text}
           {suffix ? ' ' : null}
@@ -121,7 +120,6 @@ export function RichText({
         numberOfLines={numberOfLines}
         onLayout={onLayout}
         onTextLayout={onTextLayout}
-        // @ts-ignore web only -prf
         dataSet={WORD_WRAP}>
         {text}
         {suffix ? ' ' : null}
@@ -150,7 +148,7 @@ export function RichText({
             selectable={selectable}
             to={`/profile/${mention.did}`}
             style={interactiveStyles}
-            // @ts-ignore TODO
+            // @ts-expect-error TODO
             dataSet={WORD_WRAP}
             shouldProxy={shouldProxyLinks}
             onPress={onLinkPress}>
@@ -169,7 +167,7 @@ export function RichText({
             key={key}
             to={link.uri}
             style={interactiveStyles}
-            // @ts-ignore TODO
+            // @ts-expect-error TODO
             dataSet={WORD_WRAP}
             shareOnLongPress
             shouldProxy={shouldProxyLinks}
@@ -209,7 +207,6 @@ export function RichText({
       numberOfLines={numberOfLines}
       onLayout={onLayout}
       onTextLayout={onTextLayout}
-      // @ts-ignore web only -prf
       dataSet={WORD_WRAP}>
       {els}
       {suffix ? ' ' : null}
diff --git a/src/components/Select/index.tsx b/src/components/Select/index.tsx
index a7dd70d8e7..af5849346b 100644
--- a/src/components/Select/index.tsx
+++ b/src/components/Select/index.tsx
@@ -100,7 +100,16 @@ export function Trigger({children, hitSlop, label}: TriggerProps) {
   } else {
     return (
       <Button
-        hitSlop={hitSlop}
+        hitSlop={
+          typeof hitSlop === 'number'
+            ? {
+                top: hitSlop,
+                right: hitSlop,
+                bottom: hitSlop,
+                left: hitSlop,
+              }
+            : (hitSlop ?? undefined)
+        }
         label={label}
         onPress={control.open}
         style={[a.flex_1, a.justify_between, a.pl_lg, a.pr_md]}
diff --git a/src/components/Select/index.web.tsx b/src/components/Select/index.web.tsx
index 1aa4b39ea1..ade6cf3e20 100644
--- a/src/components/Select/index.web.tsx
+++ b/src/components/Select/index.web.tsx
@@ -3,7 +3,7 @@ import {View} from 'react-native'
 import {Select as RadixSelect} from 'radix-ui'
 
 import {useA11y} from '#/state/a11y'
-import {atoms as a, flatten, useTheme, web} from '#/alf'
+import {atoms as a, flatten, flattenToCSS, useTheme, web} from '#/alf'
 import {useInteractionState} from '#/components/hooks/useInteractionState'
 import {Check_Stroke2_Corner0_Rounded as CheckIcon} from '#/components/icons/Check'
 import {
@@ -94,7 +94,7 @@ export function Trigger({children, label}: TriggerProps) {
         onBlur={onBlur}
         onMouseEnter={onMouseEnter}
         onMouseLeave={onMouseLeave}
-        style={flatten([
+        style={flattenToCSS([
           a.flex,
           a.relative,
           t.atoms.bg_contrast_50,
@@ -196,7 +196,7 @@ export function Content<T>({
   return (
     <RadixSelect.Portal>
       <RadixSelect.Content
-        style={flatten([t.atoms.bg, a.rounded_sm, a.overflow_hidden])}
+        style={flattenToCSS([t.atoms.bg, a.rounded_sm, a.overflow_hidden])}
         position="popper"
         align="center"
         sideOffset={5}
@@ -212,17 +212,17 @@ export function Content<T>({
             a.overflow_hidden,
             !reduceMotionEnabled && a.zoom_fade_in,
           ]}>
-          <RadixSelect.ScrollUpButton style={flatten(up)}>
+          <RadixSelect.ScrollUpButton style={flattenToCSS(up)}>
             <ChevronUpIcon style={[t.atoms.text]} size="xs" />
           </RadixSelect.ScrollUpButton>
-          <RadixSelect.Viewport style={flatten([a.p_xs])}>
+          <RadixSelect.Viewport style={flattenToCSS([a.p_xs])}>
             {items.map((item, index) => (
               <Fragment key={valueExtractor(item)}>
                 {renderItem(item, index, selectedValue)}
               </Fragment>
             ))}
           </RadixSelect.Viewport>
-          <RadixSelect.ScrollDownButton style={flatten(down)}>
+          <RadixSelect.ScrollDownButton style={flattenToCSS(down)}>
             <ChevronDownIcon style={[t.atoms.text]} size="xs" />
           </RadixSelect.ScrollDownButton>
         </View>
@@ -273,7 +273,7 @@ export function Item({ref, value, style, children}: ItemProps) {
       onMouseLeave={onMouseLeave}
       onFocus={onFocus}
       onBlur={onBlur}
-      style={flatten([
+      style={flattenToCSS([
         t.atoms.text,
         a.relative,
         a.flex,
@@ -307,7 +307,7 @@ export const ItemText = function ItemText({children, style}: ItemTextProps) {
 export function ItemIndicator({icon: Icon = CheckIcon}: ItemIndicatorProps) {
   return (
     <RadixSelect.ItemIndicator
-      style={flatten([
+      style={flattenToCSS([
         a.absolute,
         {left: 0, width: 30},
         a.flex,
@@ -324,7 +324,7 @@ export function Separator() {
 
   return (
     <RadixSelect.Separator
-      style={flatten([
+      style={flattenToCSS([
         {
           height: 1,
           backgroundColor: t.atoms.border_contrast_low.borderColor,
diff --git a/src/components/StarterPack/Main/ProfilesList.tsx b/src/components/StarterPack/Main/ProfilesList.tsx
index 46ad1aac05..56ac697a31 100644
--- a/src/components/StarterPack/Main/ProfilesList.tsx
+++ b/src/components/StarterPack/Main/ProfilesList.tsx
@@ -2,10 +2,6 @@ import {forwardRef, useCallback, useImperativeHandle, useState} from 'react'
 import {type ListRenderItemInfo, View} from 'react-native'
 import {AtUri} from '@atproto/syntax'
 import {type ModerationOpts} from '@bsky/sdk/moderation'
-import {
-  type InfiniteData,
-  type UseInfiniteQueryResult,
-} from '@tanstack/react-query'
 
 import {useBottomBarOffset} from '#/lib/hooks/useBottomBarOffset'
 import {useInitialNumToRender} from '#/lib/hooks/useInitialNumToRender'
@@ -26,9 +22,6 @@ function keyExtractor(item: app.bsky.actor.defs.ProfileView, index: number) {
 
 interface ProfilesListProps {
   listUri: string
-  listMembersQuery: UseInfiniteQueryResult<
-    InfiniteData<app.bsky.graph.getList.$OutputBody>
-  >
   moderationOpts: ModerationOpts
   headerHeight: number
   scrollElRef: ListRef
diff --git a/src/components/Tooltip/index.tsx b/src/components/Tooltip/index.tsx
index 4f89950527..350bf8b286 100644
--- a/src/components/Tooltip/index.tsx
+++ b/src/components/Tooltip/index.tsx
@@ -27,8 +27,9 @@ import {
 import {Text} from '#/components/Typography'
 
 const TooltipPortal = createPortalGroup()
-const TooltipProviderContext =
-  createContext<React.RefObject<View | null> | null>(null)
+const TooltipProviderContext = createContext<React.RefObject<React.ComponentRef<
+  typeof View
+> | null> | null>(null)
 
 /**
  * Provider for Tooltip component. Only needed when you need to position the tooltip relative to a container,
@@ -37,7 +38,7 @@ const TooltipProviderContext =
  * Only really necessary on iOS but can work on Android.
  */
 export function SheetCompatProvider({children}: {children: React.ReactNode}) {
-  const ref = useRef<View | null>(null)
+  const ref = useRef<React.ComponentRef<typeof View> | null>(null)
   return (
     <GlobalGestureEventsProvider style={[a.flex_1]}>
       <TooltipPortal.Provider>
@@ -154,7 +155,7 @@ export function Outer({
 export function Target({children}: {children: React.ReactNode}) {
   const {shouldMeasure, setTargetMeasurements} = useContext(TargetContext)
   const [hasLaidOut, setHasLaidOut] = useState(false)
-  const targetRef = useRef<View>(null)
+  const targetRef = useRef<React.ComponentRef<typeof View>>(null)
   const containerRef = useContext(TooltipProviderContext)
   const keyboardIsOpen = useIsKeyboardVisible()
 
diff --git a/src/components/Tooltip/index.web.tsx b/src/components/Tooltip/index.web.tsx
index fd017b43ca..8d6c9634ab 100644
--- a/src/components/Tooltip/index.web.tsx
+++ b/src/components/Tooltip/index.web.tsx
@@ -3,7 +3,7 @@ import {View} from 'react-native'
 import {utils} from '@bsky.app/alf'
 import {Popover} from 'radix-ui'
 
-import {atoms as a, flatten, useTheme} from '#/alf'
+import {atoms as a, flattenToCSS, useTheme} from '#/alf'
 import {
   ARROW_SIZE,
   BUBBLE_MAX_WIDTH,
@@ -85,7 +85,7 @@ export function Content({
             evt.preventDefault()
           }
         }}
-        style={flatten([
+        style={flattenToCSS([
           a.rounded_sm,
           {
             backgroundColor: style.surface,
diff --git a/src/components/contacts/components/OTPInput.tsx b/src/components/contacts/components/OTPInput.tsx
index 9834f6af9f..ef8944a575 100644
--- a/src/components/contacts/components/OTPInput.tsx
+++ b/src/components/contacts/components/OTPInput.tsx
@@ -25,13 +25,13 @@ export function OTPInput({
   label: string
   value: string
   onChange: (text: string) => void
-  ref?: React.Ref<TextInput>
+  ref?: React.Ref<React.ComponentRef<typeof TextInput>>
   numberOfDigits?: number
   onComplete?: (code: string) => void
 }) {
   const t = useTheme()
   const {_} = useLingui()
-  const innerRef = useRef<TextInput>(null)
+  const innerRef = useRef<React.ComponentRef<typeof TextInput>>(null)
   const {state: focused, onIn: onFocus, onOut: onBlur} = useInteractionState()
   const [selection, setSelection] = useState({start: 0, end: 0})
 
diff --git a/src/components/contacts/screens/ViewMatches.tsx b/src/components/contacts/screens/ViewMatches.tsx
index 0d50bfdeeb..cba8f7092a 100644
--- a/src/components/contacts/screens/ViewMatches.tsx
+++ b/src/components/contacts/screens/ViewMatches.tsx
@@ -383,7 +383,7 @@ export function ViewMatches({
         ref={listRef}
         data={items}
         renderItem={renderItem}
-        ListFooterComponent={!isEmpty ? <ListFooter height={20} /> : null}
+        ListFooterComponent={!isEmpty ? <ListFooter height={20} /> : undefined}
         keyExtractor={keyExtractor}
         keyboardDismissMode="interactive"
         automaticallyAdjustKeyboardInsets
diff --git a/src/components/dialogs/SearchablePeopleList.tsx b/src/components/dialogs/SearchablePeopleList.tsx
index fdbdf0b7e3..3e405caef6 100644
--- a/src/components/dialogs/SearchablePeopleList.tsx
+++ b/src/components/dialogs/SearchablePeopleList.tsx
@@ -97,7 +97,7 @@ export function SearchablePeopleList({
   const [headerHeight, setHeaderHeight] = useState(0)
   const listRef = useRef<ListMethods>(null)
   const {currentAccount} = useSession()
-  const inputRef = useRef<TextInput>(null)
+  const inputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
 
   const [searchText, setSearchText] = useState('')
 
@@ -634,7 +634,7 @@ function SearchInput({
   value: string
   onChangeText: (text: string) => void
   onEscape: () => void
-  inputRef: React.RefObject<TextInput | null>
+  inputRef: React.RefObject<React.ComponentRef<typeof TextInput> | null>
 }) {
   const t = useTheme()
   const {t: l} = useLingui()
diff --git a/src/components/dialogs/lists/UserAddRemoveListsDialog.tsx b/src/components/dialogs/lists/UserAddRemoveListsDialog.tsx
index de8f453d5a..2e171d9431 100644
--- a/src/components/dialogs/lists/UserAddRemoveListsDialog.tsx
+++ b/src/components/dialogs/lists/UserAddRemoveListsDialog.tsx
@@ -182,9 +182,9 @@ function ListsContent({
           <View style={[a.align_center, a.py_lg]}>
             <Loader size="lg" />
           </View>
-        ) : null
+        ) : undefined
       }
-      ListEmptyComponent={!isLoading && data ? <Empty /> : null}
+      ListEmptyComponent={!isLoading && data ? <Empty /> : undefined}
       webInnerContentContainerStyle={[a.py_0]}
       style={platform({
         web: [a.px_2xl, a.pb_md],
diff --git a/src/components/dialogs/nuxs/index.tsx b/src/components/dialogs/nuxs/index.tsx
index bbd40feb52..e8b6789120 100644
--- a/src/components/dialogs/nuxs/index.tsx
+++ b/src/components/dialogs/nuxs/index.tsx
@@ -117,7 +117,7 @@ function Inner({
   }, [activeNux, setActiveNux])
 
   if (__DEV__ && typeof window !== 'undefined') {
-    // @ts-ignore
+    // @ts-expect-error
     window.clearNuxDialog = (id: Nux) => {
       if (!__DEV__ || !id) return
       resetNuxs([id])
diff --git a/src/components/dms/AddMembersFlow.tsx b/src/components/dms/AddMembersFlow.tsx
index bb591fb8c6..6a6b9fc49c 100644
--- a/src/components/dms/AddMembersFlow.tsx
+++ b/src/components/dms/AddMembersFlow.tsx
@@ -134,7 +134,7 @@ export function AddMembersFlow({
   const [footerHeight, setFooterHeight] = useState(0)
 
   const listRef = useRef<ListMethods>(null)
-  const inputRef = useRef<TextInput>(null)
+  const inputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
 
   const [{groupChatDids, groupChatProfiles, searchText}, dispatch] = useReducer(
     reducer,
@@ -502,7 +502,7 @@ export function AddMembersFlow({
             <View style={[a.flex_1, a.align_center, a.justify_center]}>
               <Loader size="xl" />
             </View>
-          ) : null
+          ) : undefined
         }
         keyExtractor={(item: Item) => item.key}
         style={[
diff --git a/src/components/dms/InitiateChatFlow.tsx b/src/components/dms/InitiateChatFlow.tsx
index 4b86eb5f0e..a0a80149d7 100644
--- a/src/components/dms/InitiateChatFlow.tsx
+++ b/src/components/dms/InitiateChatFlow.tsx
@@ -249,7 +249,7 @@ export function InitiateChatFlow({
   const listRef = useRef<ListMethods>(null)
   const {currentAccount} = useSession()
   const aa = useAgeAssurance()
-  const inputRef = useRef<TextInput>(null)
+  const inputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
   const accountTooNewPromptControl = Dialog.useDialogControl()
 
   const {data: convos} = useListConvosQuery({
diff --git a/src/components/dms/ReactionsDialog.tsx b/src/components/dms/ReactionsDialog.tsx
index 5a9f83c6e9..adaad953bb 100644
--- a/src/components/dms/ReactionsDialog.tsx
+++ b/src/components/dms/ReactionsDialog.tsx
@@ -255,7 +255,7 @@ function ReactionTabs({
   const t = useTheme()
   const {t: l} = useLingui()
 
-  const scrollViewRef = useRef<ScrollView>(null)
+  const scrollViewRef = useRef<React.ComponentRef<typeof ScrollView>>(null)
   const scrollState = useRef({x: 0, width: 0})
   const tabLayouts = useRef<Map<string, {x: number; width: number}>>(new Map())
 
diff --git a/src/components/dms/components/UserSearchInput.tsx b/src/components/dms/components/UserSearchInput.tsx
index c83a48bb18..511fa58c03 100644
--- a/src/components/dms/components/UserSearchInput.tsx
+++ b/src/components/dms/components/UserSearchInput.tsx
@@ -14,7 +14,7 @@ export function UserSearchInput({
   value: string
   onChangeText: (text: string) => void
   onEscape: () => void
-  inputRef: React.RefObject<TextInput | null>
+  inputRef: React.RefObject<React.ComponentRef<typeof TextInput> | null>
 }) {
   const t = useTheme()
   const {t: l} = useLingui()
@@ -38,7 +38,6 @@ export function UserSearchInput({
         fill={interacted ? t.palette.primary_500 : t.palette.contrast_300}
       />
       <TextInput
-        // @ts-ignore bottom sheet input types issue - esb
         ref={inputRef}
         placeholder={l`Search for people`}
         value={value}
diff --git a/src/components/forms/AutosizedTextarea.tsx b/src/components/forms/AutosizedTextarea.tsx
index 414bdecda7..7c9727ded1 100644
--- a/src/components/forms/AutosizedTextarea.tsx
+++ b/src/components/forms/AutosizedTextarea.tsx
@@ -11,7 +11,7 @@ import {normalizeTextStyles} from '#/alf/typography'
 import {IS_ANDROID, IS_IOS, IS_NATIVE, IS_WEB} from '#/env'
 
 export type AutosizedTextareaProps = Omit<TextInputProps, 'multiline'> & {
-  ref?: React.Ref<TextInput>
+  ref?: React.Ref<React.ComponentRef<typeof TextInput>>
   label: string
   minRows?: number
   maxRows?: number
@@ -44,7 +44,7 @@ export function AutosizedTextarea({
   ...rest
 }: AutosizedTextareaProps) {
   const {theme: t, fonts} = useAlf()
-  const internalRef = useRef<TextInput>(null)
+  const internalRef = useRef<React.ComponentRef<typeof TextInput>>(null)
   const {style, minInputHeight, maxInputHeight, verticalContentPadding} =
     useMemo(() => {
       const normalizedStyles = normalizeTextStyles(
@@ -181,7 +181,7 @@ export function AutosizedTextarea({
       ]}
       {...rest}
       ref={mergeRefs([
-        (node: TextInput | null) => {
+        (node: React.ComponentRef<typeof TextInput> | null) => {
           internalRef.current = node
           // bop resize on first render
           if (IS_WEB && node) handleResizeWeb()
diff --git a/src/components/forms/DateField/index.android.tsx b/src/components/forms/DateField/index.android.tsx
index 3b058a2643..e906c16355 100644
--- a/src/components/forms/DateField/index.android.tsx
+++ b/src/components/forms/DateField/index.android.tsx
@@ -93,7 +93,6 @@ export function DateField({
           open
           timeZoneOffsetInMinutes={0}
           theme={t.scheme}
-          // @ts-ignore TODO
           buttonColor={t.name === 'light' ? '#000000' : '#ffffff'}
           date={initialDate}
           onConfirm={onChangeInternal}
diff --git a/src/components/forms/DateField/index.web.tsx b/src/components/forms/DateField/index.web.tsx
index 4f3d824bd2..11a6b590f9 100644
--- a/src/components/forms/DateField/index.web.tsx
+++ b/src/components/forms/DateField/index.web.tsx
@@ -62,7 +62,7 @@ export function DateField({
       <TextField.Icon icon={CalendarDays} />
       <Input
         value={value === '' ? '' : toSimpleDateString(value)}
-        inputRef={inputRef as React.Ref<TextInput>}
+        inputRef={inputRef as React.Ref<React.ComponentRef<typeof TextInput>>}
         label={label}
         onChange={handleOnChange}
         testID={testID}
diff --git a/src/components/forms/SearchInput.tsx b/src/components/forms/SearchInput.tsx
index edd737352f..d77b62de9d 100644
--- a/src/components/forms/SearchInput.tsx
+++ b/src/components/forms/SearchInput.tsx
@@ -19,7 +19,7 @@ type Props = Omit<TextField.InputProps, 'label'> & {
    */
   onClearText?: () => void
   hotkey?: boolean
-  ref?: React.Ref<TextInput>
+  ref?: React.Ref<React.ComponentRef<typeof TextInput>>
 }
 
 export function SearchInput({
@@ -33,7 +33,7 @@ export function SearchInput({
   const t = useTheme()
   const {t: l} = useLingui()
   const showClear = value && value.length > 0
-  const internalRef = useRef<TextInput>(null)
+  const internalRef = useRef<React.ComponentRef<typeof TextInput>>(null)
 
   useEffect(() => {
     if (!hotkey) return
diff --git a/src/components/forms/TextField.tsx b/src/components/forms/TextField.tsx
index 2512403ec3..936a8a1bec 100644
--- a/src/components/forms/TextField.tsx
+++ b/src/components/forms/TextField.tsx
@@ -14,6 +14,8 @@ import {mergeRefs} from '#/lib/merge-refs'
 import {
   applyFonts,
   atoms as a,
+  flatten,
+  type MutableTextStyle,
   platform,
   type TextStyleProp,
   tokens,
@@ -26,7 +28,7 @@ import {type Props as SVGIconProps} from '#/components/icons/common'
 import {Text} from '#/components/Typography'
 
 const Context = createContext<{
-  inputRef: React.RefObject<TextInput | null> | null
+  inputRef: React.RefObject<React.ComponentRef<typeof TextInput> | null> | null
   isInvalid: boolean
   hovered: boolean
   onHoverIn: () => void
@@ -55,7 +57,7 @@ export type RootProps = React.PropsWithChildren<
 >
 
 export function Root({children, isInvalid = false, style}: RootProps) {
-  const inputRef = useRef<TextInput>(null)
+  const inputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
   const {
     state: hovered,
     onIn: onHoverIn,
@@ -161,7 +163,9 @@ export type InputProps = Omit<
   value?: string
   onChangeText?: (value: string) => void
   isInvalid?: boolean
-  inputRef?: React.RefObject<TextInput | null> | React.ForwardedRef<TextInput>
+  inputRef?:
+    | React.RefObject<React.ComponentRef<typeof TextInput> | null>
+    | React.ForwardedRef<React.ComponentRef<typeof TextInput>>
   /**
    * Note: this currently falls back to the label if not specified. However,
    * most new designs have no placeholder. We should eventually remove this fallback
@@ -208,43 +212,41 @@ export function createInput(Component: typeof TextInput) {
 
     const refs = mergeRefs([ctx.inputRef, inputRef!].filter(Boolean))
 
-    const flattened = StyleSheet.flatten<TextStyle>([
-      a.relative,
-      a.z_20,
-      a.flex_1,
-      a.text_md,
-      t.atoms.text,
-      a.px_xs,
-      {
-        // paddingVertical doesn't work w/multiline - esb
-        lineHeight: a.text_md.fontSize * 1.2,
-        textAlignVertical: rest.multiline ? 'top' : undefined,
-        minHeight: rest.multiline ? 80 : undefined,
-        minWidth: 0,
-        paddingTop: 13,
-        paddingBottom: 13,
-      },
-      /*
-       * Margins are needed here to avoid autofill background overlapping the
-       * top and bottom borders - esb
-       */
-      web({
-        paddingTop: 11,
-        paddingBottom: 11,
-        marginTop: 2,
-        marginBottom: 2,
-      }),
-      style,
-    ])
+    const flattened: MutableTextStyle = {
+      ...flatten([
+        a.relative,
+        a.z_20,
+        a.flex_1,
+        a.text_md,
+        t.atoms.text,
+        a.px_xs,
+        {
+          // paddingVertical doesn't work w/multiline - esb
+          lineHeight: a.text_md.fontSize * 1.2,
+          textAlignVertical: rest.multiline ? 'top' : undefined,
+          minHeight: rest.multiline ? 80 : undefined,
+          minWidth: 0,
+          paddingTop: 13,
+          paddingBottom: 13,
+        },
+        /*
+         * Margins are needed here to avoid autofill background overlapping the
+         * top and bottom borders - esb
+         */
+        web({
+          paddingTop: 11,
+          paddingBottom: 11,
+          marginTop: 2,
+          marginBottom: 2,
+        }),
+        style,
+      ]),
+    }
 
     applyFonts(flattened, fonts.family)
 
-    // should always be defined on `typography`
-    // @ts-ignore
     if (flattened.fontSize) {
-      // @ts-ignore
       flattened.fontSize = Math.round(
-        // @ts-ignore
         flattened.fontSize * fonts.scaleMultiplier,
       )
     }
diff --git a/src/components/hooks/useOnKeyboard.ts b/src/components/hooks/useOnKeyboard.ts
index 7d5a39d9bd..b0a9b55990 100644
--- a/src/components/hooks/useOnKeyboard.ts
+++ b/src/components/hooks/useOnKeyboard.ts
@@ -1,13 +1,13 @@
 import {useEffect} from 'react'
 import {
   Keyboard,
-  type KeyboardEventListener,
+  type KeyboardEvent,
   type KeyboardEventName,
 } from 'react-native'
 
 export function useOnKeyboard(
   eventName: KeyboardEventName,
-  cb: KeyboardEventListener,
+  cb: (event: KeyboardEvent) => unknown,
 ) {
   useEffect(() => {
     const subscription = Keyboard.addListener(eventName, cb)
diff --git a/src/components/icons/TEMPLATE.tsx b/src/components/icons/TEMPLATE.tsx
index a7ef371cd1..212e8aeb09 100644
--- a/src/components/icons/TEMPLATE.tsx
+++ b/src/components/icons/TEMPLATE.tsx
@@ -23,7 +23,7 @@ export const IconTemplate_Stroke2_Corner0_Rounded = forwardRef(
       <Svg
         fill="none"
         {...rest}
-        // @ts-ignore it's fiiiiine
+        // @ts-expect-error it's fiiiiine
         ref={ref}
         viewBox="0 0 24 24"
         width={size}
diff --git a/src/components/images/Gallery/index.tsx b/src/components/images/Gallery/index.tsx
index aad2f86b29..6f959efcf0 100644
--- a/src/components/images/Gallery/index.tsx
+++ b/src/components/images/Gallery/index.tsx
@@ -65,7 +65,7 @@ interface GalleryProps {
 }
 
 const Context = createContext<{
-  bleedRef: React.RefObject<View | null>
+  bleedRef: React.RefObject<React.ComponentRef<typeof View> | null>
   bleedWidth: number
 }>({
   bleedRef: {current: null},
@@ -73,7 +73,7 @@ const Context = createContext<{
 })
 
 export function GalleryBleed({children}: {children: React.ReactNode}) {
-  const ref = useRef<View>(null)
+  const ref = useRef<React.ComponentRef<typeof View>>(null)
   const [bleedWidth, setBleedWidth] = useState(0)
 
   if (!isValidElement(children)) {
@@ -145,7 +145,7 @@ export function Gallery({
    * scroll position, so it works correctly for off-screen FlatList items.
    */
   const {bleedRef, bleedWidth} = useGalleryBleed()
-  const contentRef = useRef<View>(null)
+  const contentRef = useRef<React.ComponentRef<typeof View>>(null)
   const [contentDims, setContentDims] = useState<{x: number; width: number}>()
   const measure = () => {
     if (contentRef.current && bleedRef.current) {
@@ -168,7 +168,9 @@ export function Gallery({
 
   const flatListRef = useRef<FlatList>(null)
   const itemWidthsRef = useRef<Map<number, number>>(new Map())
-  const itemRefsRef = useRef<Map<number, View>>(new Map())
+  const itemRefsRef = useRef<Map<number, React.ComponentRef<typeof View>>>(
+    new Map(),
+  )
   const containerRefsRef = useRef<Map<number, AnimatedRef<any>>>(new Map())
   const thumbDimsRef = useRef<Map<number, Dimensions>>(new Map())
   const currentIndexRef = useRef(0)
@@ -408,7 +410,7 @@ function GalleryImage({
   index: number
   imageCount: number
   onWidthChange: (index: number, width: number) => void
-  itemRef: (node: View | null) => void
+  itemRef: (node: React.ComponentRef<typeof View> | null) => void
   largeAltBadge?: boolean
   onContainerRef: (index: number, ref: AnimatedRef<any>) => void
   onThumbDims: (index: number, dims: Dimensions) => void
diff --git a/src/components/moderation/BlockDialog.tsx b/src/components/moderation/BlockDialog.tsx
index b49f6444c6..22895941d4 100644
--- a/src/components/moderation/BlockDialog.tsx
+++ b/src/components/moderation/BlockDialog.tsx
@@ -226,7 +226,7 @@ function BlockDialogInner({
           <View style={[a.py_lg, a.align_center, a.justify_center]}>
             <Loader size="lg" />
           </View>
-        ) : null
+        ) : undefined
       }
       footer={
         <Dialog.FlatListFooter
diff --git a/src/components/moderation/ReportDialog/index.tsx b/src/components/moderation/ReportDialog/index.tsx
index c5c60ccba4..f9d29831f0 100644
--- a/src/components/moderation/ReportDialog/index.tsx
+++ b/src/components/moderation/ReportDialog/index.tsx
@@ -159,7 +159,7 @@ function Inner(
   const logger = ax.logger.useChild(ax.logger.Context.ReportDialog)
   const t = useTheme()
   const {t: l} = useLingui()
-  const ref = useRef<ScrollView>(null)
+  const ref = useRef<React.ComponentRef<typeof ScrollView>>(null)
   const {
     data: allLabelers,
     isLoading: isLabelerLoading,
diff --git a/src/features/gifPicker/GifPickerDialog.tsx b/src/features/gifPicker/GifPickerDialog.tsx
index 6f51364408..02cb8ced3e 100644
--- a/src/features/gifPicker/GifPickerDialog.tsx
+++ b/src/features/gifPicker/GifPickerDialog.tsx
@@ -60,7 +60,7 @@ function GifPickerBody({
   control: Dialog.DialogControlProps
   onSelectGif: (gif: Gif) => void
 }) {
-  const textInputRef = useRef<TextInput>(null)
+  const textInputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
   const listRef = useRef<ListMethods>(null)
   const [rawSearch, setRawSearch] = useState('')
   const [activeCategory, setActiveCategory] = useState<string>('trending')
diff --git a/src/features/gifPicker/components/GifPickerGrid.tsx b/src/features/gifPicker/components/GifPickerGrid.tsx
index a34aeacab0..721b811829 100644
--- a/src/features/gifPicker/components/GifPickerGrid.tsx
+++ b/src/features/gifPicker/components/GifPickerGrid.tsx
@@ -89,7 +89,7 @@ export const GifPickerGrid = forwardRef<ListMethods, Props>(
               onRetry={fetchNextPage}
               style={{borderTopWidth: 0}}
             />
-          ) : null
+          ) : undefined
         }
       />
     )
diff --git a/src/features/gifPicker/components/GifPickerHeader.tsx b/src/features/gifPicker/components/GifPickerHeader.tsx
index ee50cdb8e4..62dfea5eb9 100644
--- a/src/features/gifPicker/components/GifPickerHeader.tsx
+++ b/src/features/gifPicker/components/GifPickerHeader.tsx
@@ -15,7 +15,7 @@ export function GifPickerHeader({
   onEscape,
   canClear,
 }: {
-  inputRef: Ref<TextInput>
+  inputRef: Ref<React.ComponentRef<typeof TextInput>>
   onChangeText: (text: string) => void
   onClear: () => void
   onEscape: () => void
diff --git a/src/features/liveEvents/preferences.ts b/src/features/liveEvents/preferences.ts
index 22265ac36c..bb94e30784 100644
--- a/src/features/liveEvents/preferences.ts
+++ b/src/features/liveEvents/preferences.ts
@@ -43,7 +43,7 @@ function useWebOnlyDebugLiveEventPreferences() {
 
   useEffect(() => {
     if (env.IS_DEV && IS_WEB && typeof window !== 'undefined') {
-      // @ts-ignore
+      // @ts-expect-error
       window.__updateLiveEventPreferences = async (
         action: LiveEventPreferencesAction,
       ) => {
diff --git a/src/lib/api/feed/merge.ts b/src/lib/api/feed/merge.ts
index 91d300afb8..085c0e1b70 100644
--- a/src/lib/api/feed/merge.ts
+++ b/src/lib/api/feed/merge.ts
@@ -334,7 +334,7 @@ class MergeFeedSource_Custom extends MergeFeedSource {
       feed = feed.filter(post => new Date(post.post.indexedAt) > this.minDate)
       // attach source info
       for (const post of feed) {
-        // @ts-ignore
+        // @ts-expect-error
         post.__source = this.sourceInfo
       }
       return {
diff --git a/src/lib/batchedUpdates.ts b/src/lib/batchedUpdates.ts
index 2530d6ca91..e5ac349c9a 100644
--- a/src/lib/batchedUpdates.ts
+++ b/src/lib/batchedUpdates.ts
@@ -1 +1,5 @@
-export {unstable_batchedUpdates as batchedUpdates} from 'react-native'
+import {unstable_batchedUpdates} from 'react-native'
+
+export function batchedUpdates(fn: () => void): void {
+  unstable_batchedUpdates(fn, undefined)
+}
diff --git a/src/lib/hooks/useDraggableScrollView.ts b/src/lib/hooks/useDraggableScrollView.ts
index d4d35ccda4..a8b8d0a9a2 100644
--- a/src/lib/hooks/useDraggableScrollView.ts
+++ b/src/lib/hooks/useDraggableScrollView.ts
@@ -1,18 +1,18 @@
 import {type ForwardedRef, useEffect, useMemo, useRef} from 'react'
-import {type ScrollView} from 'react-native'
-import {Platform} from 'react-native'
+import {Platform, type ScrollView} from 'react-native'
 
 import {mergeRefs} from '#/lib/merge-refs'
 
-type Props<Scrollable extends ScrollView = ScrollView> = {
+type ScrollViewInstance = React.ComponentRef<typeof ScrollView>
+
+type Props<Scrollable extends ScrollViewInstance = ScrollViewInstance> = {
   cursor?: string
   outerRef?: ForwardedRef<Scrollable>
 }
 
-export function useDraggableScroll<Scrollable extends ScrollView = ScrollView>({
-  outerRef,
-  cursor = 'grab',
-}: Props<Scrollable> = {}) {
+export function useDraggableScroll<
+  Scrollable extends ScrollViewInstance = ScrollViewInstance,
+>({outerRef, cursor = 'grab'}: Props<Scrollable> = {}) {
   const ref = useRef<Scrollable>(null)
 
   useEffect(() => {
diff --git a/src/lib/hooks/useOTAUpdates.test.ts b/src/lib/hooks/useOTAUpdates.test.ts
index 871cac0e63..54bbf08470 100644
--- a/src/lib/hooks/useOTAUpdates.test.ts
+++ b/src/lib/hooks/useOTAUpdates.test.ts
@@ -221,7 +221,7 @@ describe('useApplyPullRequestOTAUpdate', () => {
     )
 
     const buttons = jest.mocked(Alert.alert).mock.calls[0][2]
-    act(() => buttons?.[1].onPress?.())
+    void act(() => buttons?.[1].onPress?.())
 
     await waitFor(() => expect(reloadAsync).toHaveBeenCalled())
     expect(device.set).toHaveBeenCalledWith(['pendingOTAUpdate'], {
@@ -256,7 +256,7 @@ describe('useApplyPullRequestOTAUpdate', () => {
     await act(() => result.current.tryApplyUpdate('pull-request-123'))
     const buttons = jest.mocked(Alert.alert).mock.calls[0][2]
 
-    act(() => buttons?.[1].onPress?.())
+    void act(() => buttons?.[1].onPress?.())
 
     await waitFor(() =>
       expect(Alert.alert).toHaveBeenLastCalledWith(
@@ -283,7 +283,7 @@ describe('useApplyPullRequestOTAUpdate', () => {
     await act(() => result.current.tryApplyUpdate('pull-request-123'))
     const buttons = jest.mocked(Alert.alert).mock.calls[0][2]
 
-    act(() => buttons?.[1].onPress?.())
+    void act(() => buttons?.[1].onPress?.())
 
     await waitFor(() =>
       expect(Alert.alert).toHaveBeenLastCalledWith(
diff --git a/src/lib/hooks/useOTAUpdates.ts b/src/lib/hooks/useOTAUpdates.ts
index e628664b82..37c9239fc3 100644
--- a/src/lib/hooks/useOTAUpdates.ts
+++ b/src/lib/hooks/useOTAUpdates.ts
@@ -452,7 +452,7 @@ export const splash = (scheme: 'light' | 'dark') => {
       : require('../../../assets/splash/splash-dark.png')
 
   return {
-    image: RNImage.resolveAssetSource(source).uri,
+    image: RNImage.resolveAssetSource(source)!.uri,
     imageFullScreen: true,
     imageResizeMode: 'cover',
     backgroundColor: scheme === 'light' ? '#006AFF' : '#002861',
diff --git a/src/lib/jwt.ts b/src/lib/jwt.ts
index 8ba2f091ba..9298d9ded7 100644
--- a/src/lib/jwt.ts
+++ b/src/lib/jwt.ts
@@ -24,6 +24,6 @@ export function isJwtExpired(token: string) {
 
 export function isAppPassword(token: string) {
   const payload = jwtDecode(token)
-  // @ts-ignore
+  // @ts-expect-error
   return payload.scope === 'com.atproto.appPass'
 }
diff --git a/src/lib/media/picker.shared.ts b/src/lib/media/picker.shared.ts
index cabc9fa62f..1967ef2abf 100644
--- a/src/lib/media/picker.shared.ts
+++ b/src/lib/media/picker.shared.ts
@@ -23,6 +23,7 @@ export async function openPicker(opts?: ImagePickerOptions) {
     quality: 1,
     selectionLimit: 1,
     ...opts,
+    shouldDownloadFromNetwork: true,
     legacy: true,
     preferredAssetRepresentationMode:
       UIImagePickerPreferredAssetRepresentationMode.Automatic,
@@ -63,6 +64,7 @@ export async function openUnifiedPicker({
     // the `file` returned on each asset after validation instead.
     base64: false,
     selectionLimit: IS_IOS ? selectionCountRemaining : undefined,
+    shouldDownloadFromNetwork: true,
     preferredAssetRepresentationMode:
       UIImagePickerPreferredAssetRepresentationMode.Automatic,
     videoExportPreset: VideoExportPreset.Passthrough,
diff --git a/src/lib/strings/embed-player.ts b/src/lib/strings/embed-player.ts
index f1014c4dcb..2bba205193 100644
--- a/src/lib/strings/embed-player.ts
+++ b/src/lib/strings/embed-player.ts
@@ -5,8 +5,7 @@ import {IS_WEB} from '#/env'
 const {height: SCREEN_HEIGHT} = Dimensions.get('window')
 
 const IFRAME_HOST = IS_WEB
-  ? // @ts-ignore only for web
-    window.location.host === 'localhost:8100'
+  ? window.location.host === 'localhost:8100'
     ? 'http://localhost:8100'
     : 'https://bsky.app'
   : __DEV__ && !process.env.JEST_WORKER_ID
@@ -154,10 +153,7 @@ export function parseEmbedPlayerFromUrl(
     urlp.hostname === 'www.twitch.tv' ||
     urlp.hostname === 'm.twitch.tv'
   ) {
-    const parent = IS_WEB
-      ? // @ts-ignore only for web
-        window.location.hostname
-      : 'localhost'
+    const parent = IS_WEB ? window.location.hostname : 'localhost'
 
     const [__, channelOrVideo, clipOrId, id] = urlp.pathname.split('/')
 
diff --git a/src/locale/deviceLocales.ts b/src/locale/deviceLocales.ts
index 103fa5d67f..bcf7184c2d 100644
--- a/src/locale/deviceLocales.ts
+++ b/src/locale/deviceLocales.ts
@@ -57,7 +57,7 @@ export function getLocales() {
       }
     }
 
-    // @ts-ignore checked above
+    // @ts-expect-error checked above
     output.push(locale)
   }
 
diff --git a/src/logger/__tests__/logger.test.ts b/src/logger/__tests__/logger.test.ts
index ed46301f6e..e82f644a53 100644
--- a/src/logger/__tests__/logger.test.ts
+++ b/src/logger/__tests__/logger.test.ts
@@ -366,7 +366,7 @@ describe('debug contexts', () => {
     const timestamp = Date.now()
     const message = nanoid()
     const logger = new Logger({
-      // @ts-ignore
+      // @ts-expect-error
       context: 'specific',
       level: LogLevel.Debug,
     })
@@ -388,7 +388,7 @@ describe('debug contexts', () => {
     const timestamp = Date.now()
     const message = nanoid()
     const logger = new Logger({
-      // @ts-ignore
+      // @ts-expect-error
       context: 'namespace:foo',
       contextFilter: 'namespace:*',
       level: LogLevel.Debug,
@@ -411,7 +411,7 @@ describe('debug contexts', () => {
     const timestamp = Date.now()
     const message = nanoid()
     const logger = new Logger({
-      // @ts-ignore
+      // @ts-expect-error
       context: 'namespace:bar:baz',
       contextFilter: 'namespace:foo:*',
     })
diff --git a/src/platform/markBundleStartTime.ts b/src/platform/markBundleStartTime.ts
index cd64c9f1c3..0d6ff46377 100644
--- a/src/platform/markBundleStartTime.ts
+++ b/src/platform/markBundleStartTime.ts
@@ -1,2 +1,2 @@
-// @ts-ignore Web-only. On RN, this is set by Metro.
+// @ts-expect-error Web-only. On RN, this is set by Metro.
 window.__BUNDLE_START_TIME__ = performance.now()
diff --git a/src/screens/Hashtag.tsx b/src/screens/Hashtag.tsx
index 10d0c91884..d9d94f30c8 100644
--- a/src/screens/Hashtag.tsx
+++ b/src/screens/Hashtag.tsx
@@ -271,7 +271,6 @@ function HashtagScreenTab({
           onEndReached={onEndReached}
           onEndReachedThreshold={4}
           onItemSeen={trackPostView}
-          // @ts-ignore web only -prf
           desktopFixedHeight
           ListFooterComponent={
             <ListFooter
diff --git a/src/screens/Login/LoginForm.tsx b/src/screens/Login/LoginForm.tsx
index 75ad257f13..ff8e459b2b 100644
--- a/src/screens/Login/LoginForm.tsx
+++ b/src/screens/Login/LoginForm.tsx
@@ -78,8 +78,8 @@ export const LoginForm = ({
   const [identifier, setIdentifier] = useState(initialHandle || '')
   const [identifierFocused, setIdentifierFocused] = useState(false)
   const [authFactorToken, setAuthFactorToken] = useState('')
-  const identifierRef = useRef<TextInput>(null)
-  const passwordRef = useRef<TextInput>(null)
+  const identifierRef = useRef<React.ComponentRef<typeof TextInput>>(null)
+  const passwordRef = useRef<React.ComponentRef<typeof TextInput>>(null)
   const hasFocusedOnce = useRef(false)
   const [hasPassword, setHasPassword] = useState(false)
   const [revealPassword, setRevealPassword] = useState(false)
diff --git a/src/screens/Messages/JoinRequests.tsx b/src/screens/Messages/JoinRequests.tsx
index baf2d84f81..70637822c7 100644
--- a/src/screens/Messages/JoinRequests.tsx
+++ b/src/screens/Messages/JoinRequests.tsx
@@ -379,7 +379,7 @@ function JoinRequestsList({
               style={[a.flex_1, a.align_center, a.justify_center, a.py_4xl]}>
               <Loader size="xl" />
             </View>
-          ) : null
+          ) : undefined
         }
         contentContainerStyle={
           showFooter ? {paddingBottom: footerHeight} : undefined
diff --git a/src/screens/Messages/components/MessageComposer.tsx b/src/screens/Messages/components/MessageComposer.tsx
index b2f3a1d4e3..971cf7b4e8 100644
--- a/src/screens/Messages/components/MessageComposer.tsx
+++ b/src/screens/Messages/components/MessageComposer.tsx
@@ -189,7 +189,7 @@ export function MessageComposer({
       <View
         collapsable={false}
         ref={native(
-          (node: View) =>
+          (node: React.ComponentRef<typeof View>) =>
             void composerInternalApiRef.current?.setAutocompleteAnchor(node),
         )}>
         <GlassContainer
@@ -209,7 +209,9 @@ export function MessageComposer({
                     composerInternalApiRef.current?.insert(emoji.native)
                   }
                   nextFocusRef={() =>
-                    composerInternalApiRef.current?.input?.element
+                    composerInternalApiRef.current?.input
+                      ?.element as unknown as
+                      {focus: () => void} | null | undefined
                   }>
                   <EmojiPicker.Trigger label={l`Open emoji picker`}>
                     {({props, state, control}) => (
diff --git a/src/screens/Onboarding/Layout.tsx b/src/screens/Onboarding/Layout.tsx
index 240346b660..da655cf6d1 100644
--- a/src/screens/Onboarding/Layout.tsx
+++ b/src/screens/Onboarding/Layout.tsx
@@ -35,7 +35,7 @@ export function Layout({children}: React.PropsWithChildren<{}>) {
   const {gtMobile} = useBreakpoints()
   const onboardDispatch = useOnboardingDispatch()
   const {state, dispatch} = useOnboardingInternalState()
-  const scrollview = useRef<ScrollView>(null)
+  const scrollview = useRef<React.ComponentRef<typeof ScrollView>>(null)
   const prevActiveStep = useRef<string>(state.activeStep)
 
   useEffect(() => {
diff --git a/src/screens/Onboarding/StepFinished/ValuePropositionPager.tsx b/src/screens/Onboarding/StepFinished/ValuePropositionPager.tsx
index f617c01888..93aa6acc2b 100644
--- a/src/screens/Onboarding/StepFinished/ValuePropositionPager.tsx
+++ b/src/screens/Onboarding/StepFinished/ValuePropositionPager.tsx
@@ -1,6 +1,7 @@
 import {useRef, useState} from 'react'
 import {View} from 'react-native'
 import PagerView from 'react-native-pager-view'
+import {type PagerViewOnPageSelectedEvent} from 'react-native-pager-view'
 import {Image} from 'expo-image'
 import {msg} from '@lingui/core/macro'
 import {useLingui} from '@lingui/react'
@@ -36,7 +37,7 @@ export function ValuePropositionPager({
         ref={ref}
         style={[a.flex_1]}
         initialPage={step}
-        onPageSelected={evt => {
+        onPageSelected={(evt: PagerViewOnPageSelectedEvent) => {
           const page = evt.nativeEvent.position as 0 | 1 | 2
           if (step !== page) {
             setActivePage(page)
diff --git a/src/screens/Onboarding/StepProfile/PlaceholderCanvas.tsx b/src/screens/Onboarding/StepProfile/PlaceholderCanvas.tsx
index e48ca54285..5bb6e30056 100644
--- a/src/screens/Onboarding/StepProfile/PlaceholderCanvas.tsx
+++ b/src/screens/Onboarding/StepProfile/PlaceholderCanvas.tsx
@@ -52,7 +52,6 @@ export const PlaceholderCanvas = forwardRef<PlaceholderCanvasRef, {}>(
       <View style={styles.container}>
         <Suspense fallback={null}>
           <LazyViewShot
-            // @ts-ignore this library doesn't have types
             ref={viewshotRef}
             options={{
               fileName: 'placeholderAvatar',
diff --git a/src/screens/Onboarding/StepSuggestedAccounts/index.tsx b/src/screens/Onboarding/StepSuggestedAccounts/index.tsx
index dc1a89c182..1a4e814ce9 100644
--- a/src/screens/Onboarding/StepSuggestedAccounts/index.tsx
+++ b/src/screens/Onboarding/StepSuggestedAccounts/index.tsx
@@ -378,7 +378,7 @@ function SuggestedProfileCard({
 }) {
   const t = useTheme()
   const ax = useAnalytics()
-  const cardRef = useRef<View>(null)
+  const cardRef = useRef<React.ComponentRef<typeof View>>(null)
   const hasTrackedRef = useRef(false)
 
   useEffect(() => {
@@ -396,7 +396,7 @@ function SuggestedProfileCard({
         },
         {threshold: 0.5},
       )
-      // @ts-ignore - web only
+      // @ts-expect-error - web only
       observer.observe(node)
       return () => observer.disconnect()
     } else {
diff --git a/src/screens/PostThread/index.tsx b/src/screens/PostThread/index.tsx
index bc2578b895..d68a7280d8 100644
--- a/src/screens/PostThread/index.tsx
+++ b/src/screens/PostThread/index.tsx
@@ -160,8 +160,8 @@ export function PostThread({uri}: {uri: string}) {
   const totalParentCount = useRef(0) // recomputed below
   const totalChildrenCount = useRef(thread.data.items.length) // recomputed below
   const listRef = useRef<ListMethods>(null)
-  const anchorRef = useRef<View | null>(null)
-  const headerRef = useRef<View | null>(null)
+  const anchorRef = useRef<React.ComponentRef<typeof View> | null>(null)
+  const headerRef = useRef<React.ComponentRef<typeof View> | null>(null)
 
   /*
    * On a cold load, parents are not prepended until the anchor post has
diff --git a/src/screens/Profile/KnownFollowers.tsx b/src/screens/Profile/KnownFollowers.tsx
index 5ccc70c16f..69f93d19c9 100644
--- a/src/screens/Profile/KnownFollowers.tsx
+++ b/src/screens/Profile/KnownFollowers.tsx
@@ -128,7 +128,6 @@ export const ProfileKnownFollowersScreen = ({route}: Props) => {
             onRetry={fetchNextPage}
           />
         }
-        // @ts-ignore our .web version only -prf
         desktopFixedHeight
         initialNumToRender={initialNumToRender}
         windowSize={11}
diff --git a/src/screens/Search/Explore.tsx b/src/screens/Search/Explore.tsx
index 144b9343a7..87e2301e1d 100644
--- a/src/screens/Search/Explore.tsx
+++ b/src/screens/Search/Explore.tsx
@@ -1,6 +1,7 @@
 import {useCallback, useMemo, useRef, useState} from 'react'
-import {View, type ViewabilityConfig} from 'react-native'
+import {View} from 'react-native'
 import {Trans, useLingui} from '@lingui/react/macro'
+import {type ViewabilityConfig} from '@react-native/virtualized-lists'
 import {useQueryClient} from '@tanstack/react-query'
 import * as bcp47Match from 'bcp-47-match'
 
diff --git a/src/screens/Search/Shell.tsx b/src/screens/Search/Shell.tsx
index 8148dcad1a..dd232e89bf 100644
--- a/src/screens/Search/Shell.tsx
+++ b/src/screens/Search/Shell.tsx
@@ -115,7 +115,7 @@ export function SearchScreenShell({
   const {gtMobile} = useBreakpoints()
   const navigation = useNavigation<NavigationProp>()
   const route = useRoute()
-  const textInput = useRef<TextInput>(null)
+  const textInput = useRef<React.ComponentRef<typeof TextInput>>(null)
   const {t: l} = useLingui()
   const {currentAccount} = useSession()
   const queryClient = useQueryClient()
diff --git a/src/screens/Search/components/AdvancedSearchDialog/ClearableInput.tsx b/src/screens/Search/components/AdvancedSearchDialog/ClearableInput.tsx
index e6525ae6cd..7ca1159637 100644
--- a/src/screens/Search/components/AdvancedSearchDialog/ClearableInput.tsx
+++ b/src/screens/Search/components/AdvancedSearchDialog/ClearableInput.tsx
@@ -28,7 +28,7 @@ export function ClearableInput({
 }) {
   const t = useTheme()
   const {t: l} = useLingui()
-  const inputRef = useRef<TextInput>(null)
+  const inputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
   const [showClear, setShowClear] = useState(defaultValue.length > 0)
 
   return (
diff --git a/src/screens/Search/components/AdvancedSearchDialog/index.tsx b/src/screens/Search/components/AdvancedSearchDialog/index.tsx
index 43876c0d74..7929d9b062 100644
--- a/src/screens/Search/components/AdvancedSearchDialog/index.tsx
+++ b/src/screens/Search/components/AdvancedSearchDialog/index.tsx
@@ -137,8 +137,8 @@ function DialogInner({
   const [dateUntilActive, setDateUntilActive] = useState(!!parsed.until)
 
   const [filters, setFilters] = useState<AdvancedFilter[]>(parsed.filters)
-  const scrollRef = useRef<ScrollView>(null)
-  const filtersSectionRef = useRef<View>(null)
+  const scrollRef = useRef<React.ComponentRef<typeof ScrollView>>(null)
+  const filtersSectionRef = useRef<React.ComponentRef<typeof View>>(null)
 
   function addFilter() {
     if (filters.length >= MAX_FILTERS) return
diff --git a/src/screens/Search/components/SearchAutocompleteInput/index.tsx b/src/screens/Search/components/SearchAutocompleteInput/index.tsx
index 0e1cca113e..550f5c9403 100644
--- a/src/screens/Search/components/SearchAutocompleteInput/index.tsx
+++ b/src/screens/Search/components/SearchAutocompleteInput/index.tsx
@@ -37,7 +37,7 @@ export function SearchAutocompleteInput({
    * keystroke while the input is still focused.
    */
   const [dismissed, setDismissed] = useState(false)
-  const inputRef = useRef<TextInput>(null)
+  const inputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
 
   const sift = useSift({
     offset: a.p_sm.padding,
diff --git a/src/screens/Settings/AppIconSettings/types.ts b/src/screens/Settings/AppIconSettings/types.ts
index 77eda3036d..0ec800dfa7 100644
--- a/src/screens/Settings/AppIconSettings/types.ts
+++ b/src/screens/Settings/AppIconSettings/types.ts
@@ -1,9 +1,9 @@
-import {type ImageSourcePropType} from 'react-native'
+import {type ImageSource} from 'expo-image'
 import type * as DynamicAppIcon from '@bsky.app/expo-dynamic-app-icon'
 
 export type AppIconSet = {
   id: DynamicAppIcon.IconName
   name: string
-  iosImage: () => ImageSourcePropType
-  androidImage: () => ImageSourcePropType
+  iosImage: () => ImageSource
+  androidImage: () => ImageSource
 }
diff --git a/src/screens/Settings/NotificationSettings/ActivityNotificationSettings.tsx b/src/screens/Settings/NotificationSettings/ActivityNotificationSettings.tsx
index c91bcf4acc..ebf25e1043 100644
--- a/src/screens/Settings/NotificationSettings/ActivityNotificationSettings.tsx
+++ b/src/screens/Settings/NotificationSettings/ActivityNotificationSettings.tsx
@@ -128,7 +128,7 @@ export function ActivityNotificationSettingsScreen({}: Props) {
         onEndReached={onEndReached}
         onEndReachedThreshold={4}
         ListEmptyComponent={
-          error ? null : (
+          error ? undefined : (
             <View style={[a.px_xl, a.py_md]}>
               {!isPending ? (
                 <Admonition.Outer type="tip">
diff --git a/src/screens/Settings/components/DeleteAccountDialog.tsx b/src/screens/Settings/components/DeleteAccountDialog.tsx
index d2d687bc79..6c3d89bba1 100644
--- a/src/screens/Settings/components/DeleteAccountDialog.tsx
+++ b/src/screens/Settings/components/DeleteAccountDialog.tsx
@@ -73,7 +73,7 @@ function DeleteAccountDialogInner({
   control: DialogOuterProps['control']
   deactivateDialogControl: DialogOuterProps['control']
 }) {
-  const passwordRef = useRef<TextInput | null>(null)
+  const passwordRef = useRef<React.ComponentRef<typeof TextInput> | null>(null)
   const t = useTheme()
   const {_} = useLingui()
   const cleanError = useCleanError()
diff --git a/src/screens/Signup/StepCaptcha/CaptchaWebView.web.tsx b/src/screens/Signup/StepCaptcha/CaptchaWebView.web.tsx
index b8c3832607..5cd24666ed 100644
--- a/src/screens/Signup/StepCaptcha/CaptchaWebView.web.tsx
+++ b/src/screens/Signup/StepCaptcha/CaptchaWebView.web.tsx
@@ -3,7 +3,6 @@ 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
 
 export function CaptchaWebView({
@@ -25,13 +24,11 @@ export function CaptchaWebView({
   }, [onError])
 
   const onLoad = useCallback(() => {
-    // @ts-ignore web
     const frame: HTMLIFrameElement = document.getElementById(
       'captcha-iframe',
     ) as HTMLIFrameElement
 
     try {
-      // @ts-ignore web
       const href = frame?.contentWindow?.location.href
       if (!href) return
       const urlp = new URL(href)
diff --git a/src/screens/Signup/StepInfo/index.tsx b/src/screens/Signup/StepInfo/index.tsx
index 40600c3b7c..0232acfffe 100644
--- a/src/screens/Signup/StepInfo/index.tsx
+++ b/src/screens/Signup/StepInfo/index.tsx
@@ -68,8 +68,8 @@ export function StepInfo({
   const prevEmailValueRef = useRef<string>(state.email)
   const passwordValueRef = useRef<string>(state.password)
 
-  const emailInputRef = useRef<TextInput>(null)
-  const passwordInputRef = useRef<TextInput>(null)
+  const emailInputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
+  const passwordInputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
   const birthdateInputRef = useRef<DateFieldRef>(null)
 
   const aaRegionConfig = useAgeAssuranceRegionConfigWithFallback()
diff --git a/src/screens/StarterPack/StarterPackScreen.tsx b/src/screens/StarterPack/StarterPackScreen.tsx
index 97f1f77cf9..2043ae2e7d 100644
--- a/src/screens/StarterPack/StarterPackScreen.tsx
+++ b/src/screens/StarterPack/StarterPackScreen.tsx
@@ -41,6 +41,7 @@ import {
 } from '#/state/shell/progress-guide'
 import {PagerWithHeader} from '#/view/com/pager/PagerWithHeader'
 import {ProfileSubpageHeader} from '#/view/com/profile/ProfileSubpageHeader'
+import {type ListRef} from '#/view/com/util/List'
 import {bulkWriteFollows} from '#/screens/Onboarding/util'
 import {atoms as a, useBreakpoints, useTheme} from '#/alf'
 import {Button, ButtonIcon, ButtonText} from '#/components/Button'
@@ -251,8 +252,7 @@ function StarterPackScreenLoaded({
                 // Validated above
                 listUri={starterPack.list!.uri}
                 headerHeight={headerHeight}
-                // @ts-expect-error
-                scrollElRef={scrollElRef}
+                scrollElRef={scrollElRef as ListRef}
                 moderationOpts={moderationOpts}
               />
             )
@@ -260,11 +260,9 @@ function StarterPackScreenLoaded({
         {showFeedsTab
           ? ({headerHeight, scrollElRef}) => (
               <FeedsList
-                // @ts-expect-error ?
-                feeds={starterPack?.feeds}
+                feeds={starterPack.feeds!}
                 headerHeight={headerHeight}
-                // @ts-expect-error
-                scrollElRef={scrollElRef}
+                scrollElRef={scrollElRef as ListRef}
               />
             )
           : null}
@@ -274,9 +272,7 @@ function StarterPackScreenLoaded({
                 // Validated above
                 listUri={starterPack.list!.uri}
                 headerHeight={headerHeight}
-                // @ts-expect-error
-                scrollElRef={scrollElRef}
-                moderationOpts={moderationOpts}
+                scrollElRef={scrollElRef as ListRef}
               />
             )
           : null}
diff --git a/src/screens/Topic.tsx b/src/screens/Topic.tsx
index 6e3be7c2a7..db5ba4ae10 100644
--- a/src/screens/Topic.tsx
+++ b/src/screens/Topic.tsx
@@ -177,7 +177,6 @@ function TopicScreenTab({
           onEndReached={onEndReached}
           onEndReachedThreshold={4}
           onItemSeen={trackPostView}
-          // @ts-ignore web only -prf
           desktopFixedHeight
           ListFooterComponent={
             <ListFooter
diff --git a/src/screens/VideoFeed/index.tsx b/src/screens/VideoFeed/index.tsx
index 0b6fd3aba0..e6028edd18 100644
--- a/src/screens/VideoFeed/index.tsx
+++ b/src/screens/VideoFeed/index.tsx
@@ -5,8 +5,6 @@ import {
   Pressable,
   ScrollView,
   View,
-  type ViewabilityConfig,
-  type ViewToken,
 } from 'react-native'
 import {
   Gesture,
@@ -29,6 +27,10 @@ import {AtUri} from '@atproto/syntax'
 import {type ModerationDecision} from '@bsky/sdk/moderation'
 import {RichText as RichTextAPI} from '@bsky/sdk/richtext'
 import {Trans, useLingui} from '@lingui/react/macro'
+import {
+  type ListViewToken as ViewToken,
+  type ViewabilityConfig,
+} from '@react-native/virtualized-lists'
 import {
   type RouteProp,
   useFocusEffect,
@@ -413,7 +415,7 @@ function Feed() {
 
   const onViewableItemsChanged = useCallback(
     ({viewableItems}: {viewableItems: ViewToken[]; changed: ViewToken[]}) => {
-      if (viewableItems[0] && viewableItems[0].index !== null) {
+      if (viewableItems[0]?.index != null) {
         const newIndex = viewableItems[0].index
         setCurrentIndex(newIndex)
         updateVideoState(newIndex)
diff --git a/src/state/cache/thread-mutes.tsx b/src/state/cache/thread-mutes.tsx
index 17f6be9f34..849b8eb727 100644
--- a/src/state/cache/thread-mutes.tsx
+++ b/src/state/cache/thread-mutes.tsx
@@ -77,7 +77,6 @@ function useMigrateMutes(setThreadMute: SetStateContext) {
         while (!cancelled) {
           const threads = persisted.get('mutedThreads')
 
-          // @ts-ignore findLast is polyfilled - esb
           const root = threads.findLast(uri => uri.includes(currentAccount.did))
 
           if (!root) break
diff --git a/src/state/persisted/schema.ts b/src/state/persisted/schema.ts
index 58229b3deb..e5a3c0b372 100644
--- a/src/state/persisted/schema.ts
+++ b/src/state/persisted/schema.ts
@@ -209,7 +209,7 @@ export function tryParse(rawData: string): Schema | undefined {
     const errors =
       parsed.error?.errors?.map(e => ({
         code: e.code,
-        // @ts-ignore exists on some types
+        // @ts-expect-error exists on some types
         expected: e?.expected,
         path: e.path?.join('.'),
       })) || []
diff --git a/src/state/queries/nuxs/index.ts b/src/state/queries/nuxs/index.ts
index 69ab7691a4..e09dc5898d 100644
--- a/src/state/queries/nuxs/index.ts
+++ b/src/state/queries/nuxs/index.ts
@@ -45,7 +45,7 @@ export function useNuxs():
   //   const queryClient = useQueryClient()
   //   const pdsClient = usePdsClient()
 
-  //   // @ts-ignore
+  //   // @ts-expect-error
   //   window.clearNux = async (ids: string[]) => {
   //     await pdsClient.call(removeNuxs, ids)
   //     // triggers a refetch
diff --git a/src/state/queries/usePostThread/utils.ts b/src/state/queries/usePostThread/utils.ts
index dde80db181..aeab5f75dd 100644
--- a/src/state/queries/usePostThread/utils.ts
+++ b/src/state/queries/usePostThread/utils.ts
@@ -90,7 +90,7 @@ export function getTraversalMetadata({
   }
 
   if (isDevMode()) {
-    // @ts-ignore dev only for debugging
+    // @ts-expect-error dev only for debugging
     metadata.postData.text = getPostRecord(item.value.post).text
   }
 
@@ -104,9 +104,9 @@ export function storeTraversalMetadata(
   metadatas.set(metadata.postData.uri, metadata)
 
   if (isDevMode()) {
-    // @ts-ignore dev only for debugging
+    // @ts-expect-error dev only for debugging
     metadatas.set(metadata.postData.text, metadata)
-    // @ts-ignore
+    // @ts-expect-error
     window.__thread = metadatas
   }
 }
diff --git a/src/state/queries/usePostThread/views.ts b/src/state/queries/usePostThread/views.ts
index a5661ae835..a3843878df 100644
--- a/src/state/queries/usePostThread/views.ts
+++ b/src/state/queries/usePostThread/views.ts
@@ -21,7 +21,7 @@ export function threadPostNoUnauthenticated({
     uri,
     depth,
     value: value as app.bsky.unspecced.defs.ThreadItemNoUnauthenticated,
-    // @ts-ignore populated by the traversal
+    // @ts-expect-error populated by the traversal
     ui: {},
   }
 }
@@ -91,7 +91,7 @@ export function threadPost({
     },
     isBlurred,
     moderation,
-    // @ts-ignore populated by the traversal
+    // @ts-expect-error populated by the traversal
     ui: {},
   }
 }
diff --git a/src/storage/__tests__/index.test.ts b/src/storage/__tests__/index.test.ts
index e11affa7a8..848c07b8e8 100644
--- a/src/storage/__tests__/index.test.ts
+++ b/src/storage/__tests__/index.test.ts
@@ -63,7 +63,7 @@ test(`removes multiple keys at once`, () => {
 test(`concatenates keys`, () => {
   store.remove([scope, 'str'])
   store.set([scope, 'str'], 'concat')
-  // @ts-ignore accessing these properties for testing purposes only
+  // @ts-expect-error accessing these properties for testing purposes only
   expect(store.store.getString(`${scope}${store.sep}str`)).toBeTruthy()
 })
 
diff --git a/src/view/com/auth/SplashScreen.tsx b/src/view/com/auth/SplashScreen.tsx
index 5bde3bb4cb..71851e2555 100644
--- a/src/view/com/auth/SplashScreen.tsx
+++ b/src/view/com/auth/SplashScreen.tsx
@@ -11,14 +11,14 @@ import {Logo} from '#/view/icons/Logo'
 import {Logotype} from '#/view/icons/Logotype'
 import {atoms as a, useTheme} from '#/alf'
 import {Button, ButtonText} from '#/components/Button'
-// @ts-ignore
+// @ts-expect-error
 import splashImagePointer from '../../../../assets/illustrations/illustration-mobile.png'
-// @ts-ignore
+// @ts-expect-error
 import darkSplashImagePointer from '../../../../assets/illustrations/illustration-mobile-dark.png'
-const splashImageUri = RNImage.resolveAssetSource(splashImagePointer).uri
+const splashImageUri = RNImage.resolveAssetSource(splashImagePointer)!.uri
 const darkSplashImageUri = RNImage.resolveAssetSource(
   darkSplashImagePointer,
-).uri
+)!.uri
 
 export const SplashScreen = ({
   onPressSignin,
diff --git a/src/view/com/auth/SplashScreen.web.tsx b/src/view/com/auth/SplashScreen.web.tsx
index ff406a559c..6a6547e5e7 100644
--- a/src/view/com/auth/SplashScreen.web.tsx
+++ b/src/view/com/auth/SplashScreen.web.tsx
@@ -73,7 +73,6 @@ export const SplashScreen = ({
           style={[
             a.h_full,
             a.justify_center,
-            // @ts-expect-error web only
             {paddingBottom: '20vh'},
             IS_WEB_MOBILE && a.pb_5xl,
             t.atoms.border_contrast_medium,
diff --git a/src/view/com/composer/drafts/DraftItem.tsx b/src/view/com/composer/drafts/DraftItem.tsx
index cc27922244..ff891fcc2b 100644
--- a/src/view/com/composer/drafts/DraftItem.tsx
+++ b/src/view/com/composer/drafts/DraftItem.tsx
@@ -1,5 +1,5 @@
 import {useCallback, useEffect, useMemo, useState} from 'react'
-import {Pressable, View} from 'react-native'
+import {View} from 'react-native'
 import * as VideoThumbnails from 'expo-video-thumbnails'
 import {msg, plural} from '@lingui/core/macro'
 import {useLingui} from '@lingui/react'
@@ -15,6 +15,7 @@ import {DotGrid3x1_Stroke2_Corner0_Rounded as DotsIcon} from '#/components/icons
 import {CloseQuote_Stroke2_Corner0_Rounded as CloseQuoteIcon} from '#/components/icons/Quote'
 import {Warning_Stroke2_Corner0_Rounded as WarningIcon} from '#/components/icons/Warning'
 import * as MediaPreview from '#/components/MediaPreview'
+import {Pressable} from '#/components/Pressable'
 import * as Prompt from '#/components/Prompt'
 import {RichText} from '#/components/RichText'
 import {Text} from '#/components/Typography'
diff --git a/src/view/com/composer/photos/Gallery.tsx b/src/view/com/composer/photos/Gallery.tsx
index 98bfac779d..096c197716 100644
--- a/src/view/com/composer/photos/Gallery.tsx
+++ b/src/view/com/composer/photos/Gallery.tsx
@@ -162,7 +162,7 @@ const GalleryItem = ({
   const editControl = Dialog.useDialogControl()
   const [altBtnViewTag, setAltBtnViewTag] = useState<number>()
 
-  const altBtnRef = (node: View | null) => {
+  const altBtnRef = (node: React.ComponentRef<typeof View> | null) => {
     // for iOS 26 fluid transition
     if (IS_IOS && node) {
       const tag = findNodeHandle(node)
diff --git a/src/view/com/composer/text-input/TextInput.tsx b/src/view/com/composer/text-input/TextInput.tsx
index d2d108b570..6140fc046e 100644
--- a/src/view/com/composer/text-input/TextInput.tsx
+++ b/src/view/com/composer/text-input/TextInput.tsx
@@ -50,7 +50,7 @@ export function TextInput({
 }: TextInputProps) {
   const {t: l} = useLingui()
   const {theme: t, fonts} = useAlf()
-  const textInput = useRef<RNTextInput>(null)
+  const textInput = useRef<React.ComponentRef<typeof RNTextInput>>(null)
   const textInputSelection = useRef<Selection>({start: 0, end: 0})
   const theme = useTheme()
   const [autocompletePrefix, setAutocompletePrefix] = useState('')
@@ -177,10 +177,10 @@ export function TextInput({
      * Android impl of `PasteInput` doesn't support the array syntax for `fontVariant`
      */
     if (IS_ANDROID) {
-      // @ts-ignore
-      style.fontVariant = style.fontVariant
-        ? style.fontVariant.join(' ')
-        : undefined
+      style.fontVariant =
+        typeof style.fontVariant === 'string'
+          ? style.fontVariant
+          : style.fontVariant?.join(' ')
     }
     return style
   }, [t, fonts])
diff --git a/src/view/com/composer/text-input/TextInput.web.tsx b/src/view/com/composer/text-input/TextInput.web.tsx
index 79f0c2db46..b709f262f5 100644
--- a/src/view/com/composer/text-input/TextInput.web.tsx
+++ b/src/view/com/composer/text-input/TextInput.web.tsx
@@ -344,7 +344,7 @@ export function TextInput({
   return (
     <>
       <View style={[styles.container, hasRightPadding && styles.rightPadding]}>
-        {/* @ts-ignore inputStyle is fine */}
+        {/* @ts-expect-error inputStyle is fine */}
         <EditorContent editor={editor} style={inputStyle} />
       </View>
 
@@ -479,7 +479,7 @@ const styles = StyleSheet.create({
     pointerEvents: 'none',
     alignItems: 'center',
     justifyContent: 'center',
-    // @ts-ignore web only -prf
+    // @ts-expect-error web only -prf
     position: 'fixed',
     padding: 16,
     top: 0,
@@ -488,7 +488,6 @@ const styles = StyleSheet.create({
     right: 0,
   },
   dropModal: {
-    // @ts-ignore web only
     boxShadow: 'rgba(0, 0, 0, 0.3) 0px 5px 20px',
     padding: 8,
     borderWidth: 1,
diff --git a/src/view/com/composer/text-input/web/Autocomplete.tsx b/src/view/com/composer/text-input/web/Autocomplete.tsx
index 21d8e37b59..144d4e29ba 100644
--- a/src/view/com/composer/text-input/web/Autocomplete.tsx
+++ b/src/view/com/composer/text-input/web/Autocomplete.tsx
@@ -58,7 +58,7 @@ export function createSuggestion({
             return
           }
 
-          // @ts-ignore getReferenceClientRect doesnt like that clientRect can return null -prf
+          // @ts-expect-error getReferenceClientRect doesnt like that clientRect can return null -prf
           popup = tippy('body', {
             getReferenceClientRect: props.clientRect,
             appendTo: () => document.body,
@@ -78,7 +78,7 @@ export function createSuggestion({
           }
 
           popup?.[0]?.setProps({
-            // @ts-ignore getReferenceClientRect doesnt like that clientRect can return null -prf
+            // @ts-expect-error getReferenceClientRect doesnt like that clientRect can return null -prf
             getReferenceClientRect: props.clientRect,
           })
         },
diff --git a/src/view/com/composer/videos/VideoTranscodeBackdrop.web.tsx b/src/view/com/composer/videos/VideoTranscodeBackdrop.web.tsx
index 0a5550f265..240e0620b1 100644
--- a/src/view/com/composer/videos/VideoTranscodeBackdrop.web.tsx
+++ b/src/view/com/composer/videos/VideoTranscodeBackdrop.web.tsx
@@ -1,6 +1,6 @@
 import {type QueryClient} from '@tanstack/react-query'
 
-import {atoms as a, flatten} from '#/alf'
+import {atoms as a, flattenToCSS} from '#/alf'
 
 export function clearThumbnailCache(_queryClient: QueryClient) {
   // no-op on web
@@ -10,7 +10,7 @@ export function VideoTranscodeBackdrop({uri}: {uri: string}) {
   return (
     <video
       src={uri}
-      style={flatten([
+      style={flattenToCSS([
         a.absolute,
         a.inset_0,
         a.h_full,
diff --git a/src/view/com/feeds/ComposerPrompt.tsx b/src/view/com/feeds/ComposerPrompt.tsx
index 6d78ce72c6..db42ead219 100644
--- a/src/view/com/feeds/ComposerPrompt.tsx
+++ b/src/view/com/feeds/ComposerPrompt.tsx
@@ -145,7 +145,6 @@ export function ComposerPrompt() {
   return (
     <Pressable
       onPress={onPress}
-      android_ripple={null}
       accessibilityRole="button"
       accessibilityLabel={_(msg`Compose new post`)}
       accessibilityHint={_(msg`Opens the post composer`)}
diff --git a/src/view/com/pager/DraggableScrollView.tsx b/src/view/com/pager/DraggableScrollView.tsx
index c98e340548..f606f91dbf 100644
--- a/src/view/com/pager/DraggableScrollView.tsx
+++ b/src/view/com/pager/DraggableScrollView.tsx
@@ -9,7 +9,7 @@ export function DraggableScrollView({
   style,
   ...props
 }: ComponentPropsWithRef<typeof ScrollView>) {
-  const {refs} = useDraggableScroll<ScrollView>({
+  const {refs} = useDraggableScroll<React.ComponentRef<typeof ScrollView>>({
     outerRef: ref,
     cursor: 'grab', // optional, default
   })
diff --git a/src/view/com/pager/PagerWithHeader.tsx b/src/view/com/pager/PagerWithHeader.tsx
index c2c52d72aa..9de159d652 100644
--- a/src/view/com/pager/PagerWithHeader.tsx
+++ b/src/view/com/pager/PagerWithHeader.tsx
@@ -31,7 +31,9 @@ import {TabBar} from './TabBar'
 export interface PagerWithHeaderChildParams {
   headerHeight: number
   isFocused: boolean
-  scrollElRef: React.MutableRefObject<ListMethods | ScrollView | null>
+  scrollElRef: React.MutableRefObject<
+    ListMethods | React.ComponentRef<typeof ScrollView> | null
+  >
 }
 
 export interface PagerWithHeaderProps {
@@ -269,7 +271,7 @@ let PagerTabBar = ({
       ],
     }
   })
-  const headerRef = useRef<View>(null)
+  const headerRef = useRef<React.ComponentRef<typeof View>>(null)
   const fallbackHeaderOnlyHeight = useRef(0)
   return (
     <Animated.View
@@ -378,7 +380,7 @@ function PagerItem({
         headerHeight,
         isFocused,
         scrollElRef: scrollElRef as React.MutableRefObject<
-          ListMethods | ScrollView | null
+          ListMethods | React.ComponentRef<typeof ScrollView> | null
         >,
       })}
     </ScrollProvider>
diff --git a/src/view/com/pager/PagerWithHeader.web.tsx b/src/view/com/pager/PagerWithHeader.web.tsx
index 350f1e13ca..757453f6db 100644
--- a/src/view/com/pager/PagerWithHeader.web.tsx
+++ b/src/view/com/pager/PagerWithHeader.web.tsx
@@ -16,7 +16,9 @@ import {TabBar} from './TabBar'
 export interface PagerWithHeaderChildParams {
   headerHeight: number
   isFocused: boolean
-  scrollElRef: React.MutableRefObject<ListMethods | ScrollView | null>
+  scrollElRef: React.MutableRefObject<
+    ListMethods | React.ComponentRef<typeof ScrollView> | null
+  >
 }
 
 export interface PagerWithHeaderProps {
@@ -180,7 +182,7 @@ function PagerItem({
     headerHeight: 0,
     isFocused,
     scrollElRef: scrollElRef as React.MutableRefObject<
-      ListMethods | ScrollView | null
+      ListMethods | React.ComponentRef<typeof ScrollView> | null
     >,
   })
 }
diff --git a/src/view/com/pager/TabBar.web.tsx b/src/view/com/pager/TabBar.web.tsx
index 395e0dce07..dbe76cb89f 100644
--- a/src/view/com/pager/TabBar.web.tsx
+++ b/src/view/com/pager/TabBar.web.tsx
@@ -38,7 +38,7 @@ export function TabBar({
   onPressSelected,
 }: TabBarProps) {
   const t = useTheme()
-  const scrollElRef = useRef<ScrollView>(null)
+  const scrollElRef = useRef<React.ComponentRef<typeof ScrollView>>(null)
   const itemRefs = useRef<Array<Element>>([])
   const {gtMobile} = useBreakpoints()
   const styles = gtMobile ? desktopStyles : mobileStyles
@@ -47,7 +47,8 @@ export function TabBar({
     // On the web, the primary interaction is tapping.
     // Scrolling under tap feels disorienting so only adjust the scroll offset
     // when tapping on an item out of view--and we adjust by almost an entire page.
-    const parent = scrollElRef?.current?.getScrollableNode?.()
+    const parent = scrollElRef.current?.getScrollableNode?.() as unknown as
+      HTMLElement | undefined
     if (!parent) {
       return
     }
diff --git a/src/view/com/post-thread/PostQuotes.tsx b/src/view/com/post-thread/PostQuotes.tsx
index 7bd63d1992..29aae55c80 100644
--- a/src/view/com/post-thread/PostQuotes.tsx
+++ b/src/view/com/post-thread/PostQuotes.tsx
@@ -135,7 +135,6 @@ export function PostQuotes({uri}: {uri: string}) {
           endMessageText={_(msg`That's all, folks!`)}
         />
       }
-      // @ts-ignore our .web version only -prf
       desktopFixedHeight
       initialNumToRender={initialNumToRender}
       windowSize={11}
diff --git a/src/view/com/post-thread/PostRepostedBy.tsx b/src/view/com/post-thread/PostRepostedBy.tsx
index 06bdda13df..4b29d42c81 100644
--- a/src/view/com/post-thread/PostRepostedBy.tsx
+++ b/src/view/com/post-thread/PostRepostedBy.tsx
@@ -115,7 +115,6 @@ export function PostRepostedBy({uri}: {uri: string}) {
           onRetry={fetchNextPage}
         />
       }
-      // @ts-ignore our .web version only -prf
       desktopFixedHeight
       initialNumToRender={initialNumToRender}
       windowSize={11}
diff --git a/src/view/com/post/Post.tsx b/src/view/com/post/Post.tsx
index 94398778e8..72f79f5899 100644
--- a/src/view/com/post/Post.tsx
+++ b/src/view/com/post/Post.tsx
@@ -276,7 +276,6 @@ const styles = StyleSheet.create({
     paddingRight: 15,
     paddingBottom: 5,
     paddingLeft: 10,
-    // @ts-ignore web only -prf
     cursor: 'pointer',
   },
   layout: {
diff --git a/src/view/com/profile/ProfileFollowers.tsx b/src/view/com/profile/ProfileFollowers.tsx
index ded4eed990..eb6353a2c2 100644
--- a/src/view/com/profile/ProfileFollowers.tsx
+++ b/src/view/com/profile/ProfileFollowers.tsx
@@ -246,7 +246,6 @@ export function ProfileFollowers({name}: {name: string}) {
               onRetry={fetchNextPage}
             />
           }
-          // @ts-ignore our .web version only -prf
           desktopFixedHeight
           initialNumToRender={initialNumToRender}
           windowSize={11}
diff --git a/src/view/com/profile/ProfileFollows.tsx b/src/view/com/profile/ProfileFollows.tsx
index 86755904db..18cee46839 100644
--- a/src/view/com/profile/ProfileFollows.tsx
+++ b/src/view/com/profile/ProfileFollows.tsx
@@ -229,7 +229,6 @@ export function ProfileFollows({name}: {name: string}) {
           onRetry={fetchNextPage}
         />
       }
-      // @ts-ignore our .web version only -prf
       desktopFixedHeight
       initialNumToRender={initialNumToRender}
       windowSize={11}
diff --git a/src/view/com/util/Alert.web.tsx b/src/view/com/util/Alert.web.tsx
index 754525a15c..27428208d2 100644
--- a/src/view/com/util/Alert.web.tsx
+++ b/src/view/com/util/Alert.web.tsx
@@ -1,6 +1,6 @@
-import {type AlertButton, type AlertStatic} from 'react-native'
+import {type Alert as RNAlert, type AlertButton} from 'react-native'
 
-class WebAlert implements Pick<AlertStatic, 'alert'> {
+class WebAlert implements Pick<typeof RNAlert, 'alert'> {
   public alert(title: string, message?: string, buttons?: AlertButton[]): void {
     if (buttons === undefined || buttons.length === 0) {
       window.alert([title, message].filter(Boolean).join('\n'))
diff --git a/src/view/com/util/EventStopper.tsx b/src/view/com/util/EventStopper.tsx
index fe81ac4c8f..e30b06ae33 100644
--- a/src/view/com/util/EventStopper.tsx
+++ b/src/view/com/util/EventStopper.tsx
@@ -22,7 +22,6 @@ export function EventStopper({
     <View
       onStartShouldSetResponder={_ => true}
       onTouchEnd={stop}
-      // @ts-ignore web only -prf
       onClick={stop}
       onKeyDown={onKeyDown ? stop : undefined}
       style={style}>
diff --git a/src/view/com/util/Link.tsx b/src/view/com/util/Link.tsx
index 52a5e14944..78bab551d4 100644
--- a/src/view/com/util/Link.tsx
+++ b/src/view/com/util/Link.tsx
@@ -131,13 +131,13 @@ export const Link = memo(function Link({
               onAccessibilityAction?.(e)
             }
           }}
-          // @ts-ignore web only -sfn
+          // @ts-expect-error web only -sfn
           dataSet={dataSet}
           {...props}
           android_ripple={{
             color: t.atoms.bg_contrast_25.backgroundColor,
           }}>
-          {/* @ts-ignore web only -prf */}
+          {/* @ts-expect-error web only -prf */}
           <View style={style} href={anchorHref}>
             {children ? children : <Text>{title || 'link'}</Text>}
           </View>
@@ -156,7 +156,7 @@ export const Link = memo(function Link({
       accessibilityRole="link"
       accessibilityLabel={props.accessibilityLabel ?? title}
       accessibilityHint={props.accessibilityHint}
-      // @ts-ignore web only -prf
+      // @ts-expect-error web only -prf
       href={anchorHref}
       dataSet={dataSet}
       {...props}>
@@ -281,7 +281,7 @@ export const TextLink = memo(function TextLink({
       lineHeight={lineHeight}
       dataSet={dataSet}
       title={title}
-      // @ts-ignore web only -prf
+      // @ts-expect-error web only -prf
       hrefAttrs={hrefAttrs} // hack to get open in new tab to work on safari. without this, safari will open in a new window
       onPress={onPress}
       accessibilityRole="link"
@@ -384,12 +384,12 @@ function onPressInner(
 ) {
   let shouldHandle = false
   const isLeftClick =
-    // @ts-ignore Web only -prf
+    // @ts-expect-error Web only -prf
     Platform.OS === 'web' && (e.button == null || e.button === 0)
-  // @ts-ignore Web only -prf
+  // @ts-expect-error Web only -prf
   const isMiddleClick = Platform.OS === 'web' && e.button === 1
   const isMetaKey =
-    // @ts-ignore Web only -prf
+    // @ts-expect-error Web only -prf
     Platform.OS === 'web' && (e.metaKey || e.altKey || e.ctrlKey || e.shiftKey)
   const newTab = isMetaKey || isMiddleClick
 
@@ -398,7 +398,7 @@ function onPressInner(
   } else if (
     !e.defaultPrevented && // onPress prevented default
     (isLeftClick || isMiddleClick) && // ignore everything but left and middle clicks
-    // @ts-ignore Web only -prf
+    // @ts-expect-error Web only -prf
     [undefined, null, '', 'self'].includes(e.currentTarget?.target) // let browser handle "target=_blank" etc.
   ) {
     e.preventDefault()
@@ -422,10 +422,8 @@ function onPressInner(
     } else {
       const [routeName, params] = router.matchPath(href)
       if (navigationAction === 'push') {
-        // @ts-ignore we're not able to type check on this one -prf
         navigation.dispatch(StackActions.push(routeName, params))
       } else if (navigationAction === 'replace') {
-        // @ts-ignore we're not able to type check on this one -prf
         navigation.dispatch(StackActions.replace(routeName, params))
       } else if (navigationAction === 'navigate') {
         const state = navigation.getState()
@@ -435,7 +433,7 @@ function onPressInner(
         } else {
           // note: 'navigate' actually acts the same as 'push' nowadays
           // therefore we need to add 'pop' -sfn
-          // @ts-ignore we're not able to type check on this one -prf
+          // @ts-expect-error we're not able to type check on this one -prf
           navigation.navigate(routeName, params, {pop: true})
         }
       } else {
diff --git a/src/view/com/util/List.tsx b/src/view/com/util/List.tsx
index 0489f83fb9..a524d3ecf0 100644
--- a/src/view/com/util/List.tsx
+++ b/src/view/com/util/List.tsx
@@ -1,5 +1,5 @@
 import {forwardRef, memo, useDeferredValue, useMemo} from 'react'
-import {RefreshControl, type ViewToken} from 'react-native'
+import {type ListViewToken as ViewToken, RefreshControl} from 'react-native'
 import {
   type FlatListPropsWithLayout,
   useAnimatedScrollHandler,
@@ -173,7 +173,6 @@ let List = forwardRef<ListMethods, ListProps>(
         scrollsToTop={scrollsToTop}
         scrollEventThrottle={1}
         style={style}
-        // @ts-expect-error FlatList_INTERNAL ref type is wrong -sfn
         ref={ref}
       />
     )
diff --git a/src/view/com/util/List.web.tsx b/src/view/com/util/List.web.tsx
index 86c405ae92..1ee8ff78ed 100644
--- a/src/view/com/util/List.web.tsx
+++ b/src/view/com/util/List.web.tsx
@@ -119,7 +119,7 @@ function ListImpl<ItemT>(
     if (isValidElement(ListHeaderComponent)) {
       headerComponent = ListHeaderComponent
     } else {
-      // @ts-ignore Nah it's fine.
+      // @ts-expect-error Nah it's fine.
       headerComponent = <ListHeaderComponent />
     }
   }
@@ -129,7 +129,7 @@ function ListImpl<ItemT>(
     if (isValidElement(ListFooterComponent)) {
       footerComponent = ListFooterComponent
     } else {
-      // @ts-ignore Nah it's fine.
+      // @ts-expect-error Nah it's fine.
       footerComponent = <ListFooterComponent />
     }
   }
@@ -139,7 +139,7 @@ function ListImpl<ItemT>(
     if (isValidElement(ListEmptyComponent)) {
       emptyComponent = ListEmptyComponent
     } else {
-      // @ts-ignore Nah it's fine.
+      // @ts-expect-error Nah it's fine.
       emptyComponent = <ListEmptyComponent />
     }
   }
@@ -407,7 +407,7 @@ function ListImpl<ItemT>(
           overflowY: isWithinSplitView ? 'auto' : 'scroll',
         },
       ]}
-      ref={nativeRef as unknown as React.RefObject<View>}>
+      ref={nativeRef as unknown as React.Ref<React.ComponentRef<typeof View>>}>
       <Visibility
         onVisibleChange={setIsInsideVisibleTree}
         style={
@@ -793,11 +793,10 @@ export const List = memo(forwardRef(ListImpl)) as <ItemT>(
 
 const styles = StyleSheet.create({
   minHeightViewport: {
-    // @ts-ignore web only
     minHeight: '100vh',
   },
   parentTreeVisibilityDetector: {
-    // @ts-ignore web only
+    // @ts-expect-error web only
     position: 'fixed',
     top: 0,
     left: 0,
diff --git a/src/view/com/util/PressableWithHover.tsx b/src/view/com/util/PressableWithHover.tsx
index a4a2d194fd..1c0933fa0b 100644
--- a/src/view/com/util/PressableWithHover.tsx
+++ b/src/view/com/util/PressableWithHover.tsx
@@ -1,26 +1,19 @@
-import {forwardRef, type PropsWithChildren} from 'react'
-import {
-  Pressable,
-  type PressableProps,
-  type StyleProp,
-  type View,
-  type ViewStyle,
-} from 'react-native'
+import {Pressable, type StyleProp, type ViewStyle} from 'react-native'
 
 import {addStyle} from '#/lib/styles'
 import {useInteractionState} from '#/components/hooks/useInteractionState'
 
-interface PressableWithHover extends PressableProps {
+interface PressableWithHoverProps extends React.ComponentPropsWithRef<Pressable> {
   hoverStyle: StyleProp<ViewStyle>
 }
 
-export const PressableWithHover = forwardRef<
-  View,
-  PropsWithChildren<PressableWithHover>
->(function PressableWithHoverImpl(
-  {children, style, hoverStyle, ...props},
+export function PressableWithHover({
   ref,
-) {
+  children,
+  style,
+  hoverStyle,
+  ...props
+}: PressableWithHoverProps) {
   const {
     state: hovered,
     onIn: onHoverIn,
@@ -41,4 +34,4 @@ export const PressableWithHover = forwardRef<
       {children}
     </Pressable>
   )
-})
+}
diff --git a/src/view/com/util/Views.tsx b/src/view/com/util/Views.tsx
index cd3ecf533d..d59b62af71 100644
--- a/src/view/com/util/Views.tsx
+++ b/src/view/com/util/Views.tsx
@@ -1,7 +1,6 @@
 import {forwardRef, memo} from 'react'
-import {type FlatListComponent, View, type ViewProps} from 'react-native'
+import {View, type ViewProps} from 'react-native'
 import Animated from 'react-native-reanimated'
-import {type FlatListPropsWithLayout} from 'react-native-reanimated'
 
 // If you explode these into functions, don't forget to forwardRef!
 
@@ -10,22 +9,19 @@ import {type FlatListPropsWithLayout} from 'react-native-reanimated'
  * The types are a bit wrong on `FlatList_INTERNAL`
  */
 export const FlatList_INTERNAL = memo(Animated.FlatList)
-export type FlatList_INTERNAL<ItemT = any> = Omit<
-  FlatListComponent<ItemT, FlatListPropsWithLayout<ItemT>>,
-  'CellRendererComponent'
->
+export type FlatList_INTERNAL = React.ComponentRef<typeof Animated.FlatList>
 
 /**
  * @deprecated use `Layout` components
  */
 export const ScrollView = Animated.ScrollView
-export type ScrollView = typeof Animated.ScrollView
+export type ScrollView = React.ComponentRef<typeof Animated.ScrollView>
 
 /**
  * @deprecated use `Layout` components
  */
 export const CenteredView = forwardRef<
-  View,
+  React.ComponentRef<typeof View>,
   React.PropsWithChildren<
     ViewProps & {sideBorders?: boolean; topBorder?: boolean}
   >
diff --git a/src/view/com/util/Views.web.tsx b/src/view/com/util/Views.web.tsx
index cc09fccf4e..4afa5529c6 100644
--- a/src/view/com/util/Views.web.tsx
+++ b/src/view/com/util/Views.web.tsx
@@ -14,7 +14,6 @@
 
 import {forwardRef} from 'react'
 import {
-  type FlatList,
   type FlatListProps,
   type ScrollViewProps,
   StyleSheet,
@@ -45,7 +44,7 @@ export const CenteredView = forwardRef(function CenteredView(
   }: React.PropsWithChildren<
     ViewProps & {sideBorders?: boolean; topBorder?: boolean}
   >,
-  ref: React.Ref<View>,
+  ref: React.Ref<React.ComponentRef<typeof View>>,
 ) {
   const pal = usePalette('default')
   const {isMobile} = useWebMediaQueries()
@@ -76,7 +75,7 @@ export const FlatList_INTERNAL = forwardRef(function FlatListImpl<ItemT>(
   }: React.PropsWithChildren<
     Omit<FlatListProps<ItemT>, 'CellRendererComponent'> & AddedProps
   >,
-  ref: React.Ref<FlatList<ItemT>>,
+  ref: React.Ref<React.ComponentRef<typeof Animated.FlatList>>,
 ) {
   const {isMobile} = useWebMediaQueries()
   const {centerColumnOffset} = useLayoutBreakpoints()
@@ -105,7 +104,6 @@ export const FlatList_INTERNAL = forwardRef(function FlatListImpl<ItemT>(
   }
   if (desktopFixedHeight) {
     if (typeof desktopFixedHeight === 'number') {
-      // @ts-expect-error Web only -prf
       style = addStyle(style, {
         height: `calc(100vh - ${desktopFixedHeight}px)`,
       })
@@ -143,7 +141,7 @@ export const FlatList_INTERNAL = forwardRef(function FlatListImpl<ItemT>(
  */
 export const ScrollView = forwardRef(function ScrollViewImpl(
   {contentContainerStyle, ...props}: React.PropsWithChildren<ScrollViewProps>,
-  ref: React.Ref<Animated.ScrollView>,
+  ref: React.Ref<React.ComponentRef<typeof Animated.ScrollView>>,
 ) {
   const {isMobile} = useWebMediaQueries()
   const {centerColumnOffset} = useLayoutBreakpoints()
@@ -170,7 +168,6 @@ export const ScrollView = forwardRef(function ScrollViewImpl(
 
 const styles = StyleSheet.create({
   contentContainer: {
-    // @ts-expect-error web only
     minHeight: '100vh',
   },
   container: {
@@ -189,7 +186,6 @@ const styles = StyleSheet.create({
     marginRight: 'auto',
   },
   fixedHeight: {
-    // @ts-expect-error web only
     height: '100vh',
   },
 })
diff --git a/src/view/com/util/WebAuxClickWrapper.tsx b/src/view/com/util/WebAuxClickWrapper.tsx
index 0f843b74d2..55559d05e8 100644
--- a/src/view/com/util/WebAuxClickWrapper.tsx
+++ b/src/view/com/util/WebAuxClickWrapper.tsx
@@ -21,7 +21,7 @@ export function WebAuxClickWrapper({children}: React.PropsWithChildren<{}>) {
   if (Platform.OS !== 'web') return children
 
   return (
-    // @ts-ignore web only
+    // @ts-expect-error web only
     <div onMouseDown={onMouseDown} onMouseUp={onMouseUp}>
       {children}
     </div>
diff --git a/src/view/com/util/fab/FABInner.tsx b/src/view/com/util/fab/FABInner.tsx
index f2e96fcbec..3077e8ac14 100644
--- a/src/view/com/util/fab/FABInner.tsx
+++ b/src/view/com/util/fab/FABInner.tsx
@@ -82,7 +82,7 @@ const styles = StyleSheet.create({
     borderRadius: 35,
   },
   outer: {
-    // @ts-ignore web-only
+    // @ts-expect-error web-only
     position: IS_WEB ? 'fixed' : 'absolute',
     zIndex: 1,
     cursor: 'pointer',
diff --git a/src/view/com/util/forms/Button.tsx b/src/view/com/util/forms/Button.tsx
index 2caa6c7514..b5102b8a1b 100644
--- a/src/view/com/util/forms/Button.tsx
+++ b/src/view/com/util/forms/Button.tsx
@@ -4,8 +4,6 @@ import {
   type GestureResponderEvent,
   type NativeSyntheticEvent,
   type NativeTouchEvent,
-  Pressable,
-  type PressableStateCallbackType,
   type StyleProp,
   StyleSheet,
   type TextStyle,
@@ -15,6 +13,10 @@ import {
 
 import {choose} from '#/lib/functions'
 import {useTheme} from '#/lib/ThemeContext'
+import {
+  Pressable,
+  type PressableStateCallbackType,
+} from '#/components/Pressable'
 import {Text} from '../text/Text'
 
 export type ButtonType =
@@ -28,15 +30,6 @@ export type ButtonType =
   | 'secondary-light'
   | 'default-light'
 
-// Augment type for react-native-web (see https://github.com/necolas/react-native-web/issues/1684#issuecomment-766451866)
-declare module 'react-native' {
-  interface PressableStateCallbackType {
-    // @ts-ignore web only
-    hovered?: boolean
-    focused?: boolean
-  }
-}
-
 /**
  * @deprecated use Button from `#/components/Button.tsx` instead
  */
diff --git a/src/view/com/util/layouts/LoggedOutLayout.tsx b/src/view/com/util/layouts/LoggedOutLayout.tsx
index 76a2e50205..633f21dd99 100644
--- a/src/view/com/util/layouts/LoggedOutLayout.tsx
+++ b/src/view/com/util/layouts/LoggedOutLayout.tsx
@@ -98,7 +98,6 @@ export const LoggedOutLayout = ({
 const styles = StyleSheet.create({
   container: {
     flexDirection: 'row',
-    // @ts-ignore web only
     height: '100vh',
   },
   side: {
diff --git a/src/view/com/util/listNativeTag.ts b/src/view/com/util/listNativeTag.ts
index c4580a9ae0..923e6c537c 100644
--- a/src/view/com/util/listNativeTag.ts
+++ b/src/view/com/util/listNativeTag.ts
@@ -8,5 +8,5 @@ import {type ListMethods} from './List'
  */
 export function findListNativeTag(list: ListMethods | null): number | null {
   if (!list) return null
-  return findNodeHandle(list)
+  return findNodeHandle(list) ?? null
 }
diff --git a/src/view/com/util/text/Text.tsx b/src/view/com/util/text/Text.tsx
index b703efa405..cfbee15651 100644
--- a/src/view/com/util/text/Text.tsx
+++ b/src/view/com/util/text/Text.tsx
@@ -5,7 +5,7 @@ import {UITextView} from '@bsky.app/react-native-uitextview'
 import {lh, s} from '#/lib/styles'
 import {type TypographyVariant, useTheme} from '#/lib/ThemeContext'
 import {logger} from '#/logger'
-import {applyFonts, useAlf} from '#/alf'
+import {applyFonts, type MutableTextStyle, useAlf} from '#/alf'
 import {
   childHasEmoji,
   renderChildrenWithEmoji,
@@ -61,21 +61,15 @@ function Text_DEPRECATED({
     const typography = theme.typography[type]
     const lineHeightStyle = lineHeight ? lh(theme, type, lineHeight) : undefined
 
-    const flattened = StyleSheet.flatten([
-      s.black,
-      typography,
-      lineHeightStyle,
-      style,
-    ])
+    const flattened: MutableTextStyle = {
+      ...(StyleSheet.flatten([s.black, typography, lineHeightStyle, style]) ??
+        {}),
+    }
 
     applyFonts(flattened, fonts.family)
 
-    // should always be defined on `typography`
-    // @ts-ignore
     if (flattened.fontSize) {
-      // @ts-ignore
       flattened.fontSize = Math.round(
-        // @ts-ignore
         flattened.fontSize * fonts.scaleMultiplier,
       )
     }
diff --git a/src/view/icons/Logo.tsx b/src/view/icons/Logo.tsx
index 4735295649..394045a619 100644
--- a/src/view/icons/Logo.tsx
+++ b/src/view/icons/Logo.tsx
@@ -29,7 +29,7 @@ export const Logo = forwardRef(function LogoImpl(props: Props, ref) {
   const _fill = gradient
     ? 'url(#sky)'
     : fill || styles?.color || t.palette.primary_500
-  // @ts-ignore it's fiiiiine
+  // @ts-expect-error it's fiiiiine
   const size = parseInt(rest.width || 32, 10)
 
   const logoVariant = useLogoVariant(allowVariants)
@@ -56,7 +56,7 @@ export const Logo = forwardRef(function LogoImpl(props: Props, ref) {
   return (
     <Svg
       fill="none"
-      // @ts-ignore it's fiiiiine
+      // @ts-expect-error it's fiiiiine
       ref={ref}
       viewBox="0 0 64 57"
       {...rest}
diff --git a/src/view/icons/Logomark.tsx b/src/view/icons/Logomark.tsx
index 8d078f4349..5c71a5c091 100644
--- a/src/view/icons/Logomark.tsx
+++ b/src/view/icons/Logomark.tsx
@@ -9,7 +9,7 @@ export function Logomark({
   ...rest
 }: {fill?: PathProps['fill']} & SvgProps) {
   const pal = usePalette('default')
-  // @ts-ignore it's fiiiiine
+  // @ts-expect-error it's fiiiiine
   const size = parseInt(rest.width || 32)
 
   return (
diff --git a/src/view/icons/Logotype.tsx b/src/view/icons/Logotype.tsx
index 270c913fc2..8df6b5b265 100644
--- a/src/view/icons/Logotype.tsx
+++ b/src/view/icons/Logotype.tsx
@@ -9,7 +9,7 @@ export function Logotype({
   ...rest
 }: {fill?: PathProps['fill']} & SvgProps) {
   const pal = usePalette('default')
-  // @ts-ignore it's fiiiiine
+  // @ts-expect-error it's fiiiiine
   const size = parseInt(rest.width || 32)
 
   return (
diff --git a/src/view/screens/DebugMod.tsx b/src/view/screens/DebugMod.tsx
index 68eaa95359..ce30a590b1 100644
--- a/src/view/screens/DebugMod.tsx
+++ b/src/view/screens/DebugMod.tsx
@@ -1160,10 +1160,10 @@ function MockAccountScreen({
         screenDescription={_(msg`profile`)}
         modui={moderation.ui('profileView')}>
         <ProfileHeaderStandard
-          // @ts-ignore ProfileViewBasic is close enough -prf
+          // @ts-expect-error ProfileViewBasic is close enough -prf
           profile={profile}
           moderationOpts={moderationOpts}
-          // @ts-ignore ProfileViewBasic is close enough -esb
+          // @ts-expect-error ProfileViewBasic is close enough -esb
           descriptionRT={new RichText({text: profile.description as string})}
         />
       </ScreenHider>
diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx
index 2303b69268..3bdfa82b62 100644
--- a/src/view/screens/Home.tsx
+++ b/src/view/screens/Home.tsx
@@ -223,7 +223,7 @@ function HomeScreenReady({
             {...props}
             testID="homeScreenFeedTabs"
             onPressSelected={onPressSelected}
-            // @ts-ignore
+            // @ts-expect-error
             feeds={[{displayName: 'Following'}, {displayName: 'Discover'}]}
           />
         )
diff --git a/src/view/screens/Notifications.tsx b/src/view/screens/Notifications.tsx
index 54b56e7d99..225e28a1df 100644
--- a/src/view/screens/Notifications.tsx
+++ b/src/view/screens/Notifications.tsx
@@ -262,7 +262,7 @@ function NotificationsTab({
         ListHeaderComponent={
           filter === 'mentions' ? (
             <DisabledNotificationsWarning active={isFocusedAndActive} />
-          ) : null
+          ) : undefined
         }
       />
       {(isScrolledDown || hasNew) && (
diff --git a/src/view/screens/Profile.tsx b/src/view/screens/Profile.tsx
index e02f0cb4a0..70b223a08e 100644
--- a/src/view/screens/Profile.tsx
+++ b/src/view/screens/Profile.tsx
@@ -649,7 +649,7 @@ const styles = StyleSheet.create({
   container: {
     flexDirection: 'column',
     height: '100%',
-    // @ts-ignore Web-only.
+    // @ts-expect-error Web-only.
     overflowAnchor: 'none', // Fixes jumps when switching tabs while scrolled down.
   },
   loading: {
diff --git a/src/view/screens/Storybook/Forms.tsx b/src/view/screens/Storybook/Forms.tsx
index 0112f95895..dec479cd85 100644
--- a/src/view/screens/Storybook/Forms.tsx
+++ b/src/view/screens/Storybook/Forms.tsx
@@ -34,7 +34,7 @@ export function Forms() {
   const [phoneNumber, setPhoneNumber] = useState('')
   const [lang, setLang] = useState('en')
 
-  const inputRef = useRef<TextInput>(null)
+  const inputRef = useRef<React.ComponentRef<typeof TextInput>>(null)
 
   return (
     <View style={[a.gap_4xl, a.align_start]}>
diff --git a/src/view/shell/Composer.web.tsx b/src/view/shell/Composer.web.tsx
index d7d0e4ed84..812bb8e0da 100644
--- a/src/view/shell/Composer.web.tsx
+++ b/src/view/shell/Composer.web.tsx
@@ -88,14 +88,12 @@ const styles = StyleSheet.create({
     borderRadius: 8,
     marginBottom: 0,
     borderWidth: 1,
-    // @ts-expect-error web only
     maxHeight: 'calc(100% - (40px * 2))',
     overflow: 'hidden',
   },
   containerMobile: {
     borderRadius: 0,
     marginBottom: BOTTOM_BAR_HEIGHT,
-    // @ts-expect-error web only
     maxHeight: `calc(100% - ${BOTTOM_BAR_HEIGHT}px)`,
   },
 })
diff --git a/src/view/shell/desktop/LeftNav.tsx b/src/view/shell/desktop/LeftNav.tsx
index a7ce796865..585a4afff5 100644
--- a/src/view/shell/desktop/LeftNav.tsx
+++ b/src/view/shell/desktop/LeftNav.tsx
@@ -773,8 +773,8 @@ const styles = StyleSheet.create({
   leftNav: {
     left: '50%',
     width: LEFT_NAV_STANDARD_WIDTH,
-    // @ts-expect-error web only
     maxHeight: '100vh',
+    // @ts-expect-error web only
     overflowY: 'auto',
     scrollbarWidth: 'thin',
   },
diff --git a/tsconfig.json b/tsconfig.json
index eab917283b..49035babc6 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -22,7 +22,8 @@
         "moveUpPatterns": ["#/", "@lingui/react/macro"],
         "moveDownPatterns": ["react-native-reanimated/lib"],
       }
-    ]
+    ],
+    "customConditions": ["react-native-strict-api"]
   },
   "exclude": ["bskyweb", "bskyembed", "web-build"]
 }