Unblock React Compiler for 23 components across ten small causes (#11542)

Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>

src/screens/Search/components/StarterPackCard.tsx

@@ -34,6 +34,7 @@ export function StarterPackCard({
   const {gtPhone} = useBreakpoints()
   const link = useStarterPackLink({view})
   const record = view.record
+  const isOwnStarterPack = view.creator?.did === currentAccount?.did
 
   if (!bsky.isType(app.bsky.graph.starterpack, record)) {
     return null
@@ -99,7 +100,7 @@ export function StarterPackCard({
                     t.atoms.text_contrast_medium,
                   ]}
                   numberOfLines={1}>
-                  {view.creator?.did === currentAccount?.did
+                  {isOwnStarterPack
                     ? _(msg`By you`)
                     : _(msg`By ${sanitizeHandle(view.creator.handle, '@')}`)}
                 </Text>

src/screens/Signup/StepInfo/index.tsx

@@ -46,6 +46,19 @@ function sanitizeDate(date: Date): Date {
   return date
 }
 
+/*
+ * Module scope because React Compiler cannot lower an `import()` expression
+ * inside a component or hook body.
+ */
+function loadTLDs(): Promise<typeof tldts> {
+  // @ts-expect-error - valid path
+  return import('tldts/dist/index.cjs.min.js')
+}
+
+function preloadViewShot() {
+  return import('react-native-view-shot')
+}
+
 export function StepInfo({
   onPressBack,
   isServerError,
@@ -90,12 +103,11 @@ export function StepInfo({
 
   const tldtsRef = useRef<typeof tldts>(undefined)
   useEffect(() => {
-    // @ts-expect-error - valid path
-    void import('tldts/dist/index.cjs.min.js').then(tldts => {
+    void loadTLDs().then(tldts => {
       tldtsRef.current = tldts
     })
     // This will get used in the avatar creator a few steps later, so lets preload it now
-    void import('react-native-view-shot')
+    void preloadViewShot()
   }, [])
 
   const onNextPress = () => {

src/screens/VideoFeed/index.tsx

@@ -382,11 +382,10 @@ function Feed() {
         }
       }
 
-      if (
-        updatedSources[0]?.source !== currentSources[0]?.source ||
-        updatedSources[1]?.source !== currentSources[1]?.source ||
-        updatedSources[2]?.source !== currentSources[2]?.source
-      ) {
+      const sourcesChanged = [0, 1, 2].some(
+        i => updatedSources[i]?.source !== currentSources[i]?.source,
+      )
+      if (sourcesChanged) {
         setCurrentSources(updatedSources)
       }
     },
@@ -659,10 +658,12 @@ function usePlaybackTelemetry({
 
   useEffect(() => {
     if (!active) return
-    telemetryRef.current ??= createPlaybackTelemetry({
-      surface: 'immersiveFeed',
-      presentation: 'video',
-    })
+    if (telemetryRef.current == null) {
+      telemetryRef.current = createPlaybackTelemetry({
+        surface: 'immersiveFeed',
+        presentation: 'video',
+      })
+    }
     const telemetry = telemetryRef.current
     const preloaded = player.status === 'readyToPlay'
     telemetry.activated({preloaded})