React Native New Arch (#10980)

src/screens/Messages/components/MessagesList.tsx

@@ -13,7 +13,6 @@ import {
   KeyboardGestureArea,
 } from 'react-native-keyboard-controller'
 import Animated, {
-  FadeIn,
   runOnJS,
   type ScrollEvent,
   type SharedValue,
@@ -187,6 +186,14 @@ export function MessagesList({
     }
   }, [hasScrolled, listOpacity])
 
+  // Recreate FadeIn for the footer with a shared value so we can start from a
+  // non-zero opacity instead of fully transparent. (Needed for GlassView to work properly)
+  const footerOpacity = useSharedValue(0.05)
+
+  useEffect(() => {
+    footerOpacity.set(withTiming(1, {duration: 200}))
+  }, [footerOpacity])
+
   const inputHeightUI = useSharedValue(0)
   const [inputHeightJS, setInputHeightJS] = useState(0)
 
@@ -753,6 +760,10 @@ export function MessagesList({
     opacity: listOpacity.get(),
   }))
 
+  const animatedFooterStyle = useAnimatedStyle(() => ({
+    opacity: footerOpacity.get(),
+  }))
+
   return (
     <InviteLinkDialogProvider convo={convoState.convo}>
       <MessageRepliesProvider scrollToMessage={scrollToMessage}>
@@ -841,7 +852,7 @@ export function MessagesList({
                 opened: 0,
               }}>
               {footer ?? (
-                <Animated.View entering={FadeIn.duration(200)}>
+                <Animated.View style={animatedFooterStyle}>
                   <ConversationFooter
                     convoState={convoState}
                     hasAcceptOverride={hasAcceptOverride}>

src/screens/Profile/Sections/Feed.tsx

@@ -11,7 +11,7 @@ import {
   RQKEY as FEED_RQKEY,
 } from '#/state/queries/post-feed'
 import {truncateAndInvalidate} from '#/state/queries/util'
-import {PostFeed} from '#/view/com/posts/PostFeed'
+import {PostFeed, type PostFeedRef} from '#/view/com/posts/PostFeed'
 import {
   EmptyState,
   type EmptyStateButtonProps,
@@ -36,6 +36,7 @@ interface FeedSectionProps {
   emptyStateMessage?: string
   emptyStateButton?: EmptyStateButtonProps
   emptyStateIcon?: React.ComponentType<any> | React.ReactElement
+  postFeedRef?: React.Ref<PostFeedRef>
 }
 
 export function ProfileFeedSection({
@@ -49,6 +50,7 @@ export function ProfileFeedSection({
   emptyStateMessage,
   emptyStateButton,
   emptyStateIcon,
+  postFeedRef,
 }: FeedSectionProps) {
   const {_} = useLingui()
   const queryClient = useQueryClient()
@@ -111,6 +113,7 @@ export function ProfileFeedSection({
           shouldUseAdjustedNumToRender ? adjustedInitialNumToRender : undefined
         }
         isVideoFeed={isVideoFeed}
+        ref={postFeedRef}
       />
       {(isScrolledDown || hasNew) && (
         <LoadLatestBtn

src/screens/Search/modules/ExploreSuggestedAccounts.tsx

@@ -8,7 +8,6 @@ import {type InfiniteData} from '@tanstack/react-query'
 import {popularInterests, useInterestsDisplayNames} from '#/lib/interests'
 import {logger} from '#/logger'
 import {usePreferencesQuery} from '#/state/queries/preferences'
-import {BlockDrawerGesture} from '#/view/shell/BlockDrawerGesture'
 import {atoms as a, useTheme} from '#/alf'
 import {boostInterests, InterestTabs} from '#/components/InterestTabs'
 import * as ProfileCard from '#/components/ProfileCard'
@@ -71,26 +70,24 @@ export function SuggestedAccountsTabBar({
     .sort(boostInterests(personalizedInterests))
 
   return (
-    <BlockDrawerGesture>
-      <InterestTabs
-        interests={hideDefaultTab ? interests : ['all', ...interests]}
-        selectedInterest={
-          selectedInterest || (hideDefaultTab ? interests[0] : 'all')
-        }
-        onSelectTab={tab => {
-          ax.metric('explore:suggestedAccounts:tabPressed', {tab: tab})
-          onSelectInterest(tab === 'all' ? null : tab)
-        }}
-        interestsDisplayNames={
-          hideDefaultTab
-            ? interestsDisplayNames
-            : {
-                all: defaultTabLabel || _(msg`For You`),
-                ...interestsDisplayNames,
-              }
-        }
-      />
-    </BlockDrawerGesture>
+    <InterestTabs
+      interests={hideDefaultTab ? interests : ['all', ...interests]}
+      selectedInterest={
+        selectedInterest || (hideDefaultTab ? interests[0] : 'all')
+      }
+      onSelectTab={tab => {
+        ax.metric('explore:suggestedAccounts:tabPressed', {tab: tab})
+        onSelectInterest(tab === 'all' ? null : tab)
+      }}
+      interestsDisplayNames={
+        hideDefaultTab
+          ? interestsDisplayNames
+          : {
+              all: defaultTabLabel || _(msg`For You`),
+              ...interestsDisplayNames,
+            }
+      }
+    />
   )
 }
 

src/screens/Settings/AppearanceSettings.tsx

@@ -14,7 +14,6 @@ import {
   type NativeStackScreenProps,
 } from '#/lib/routes/types'
 import {useSetThemePrefs, useThemePrefs} from '#/state/shell'
-import {SettingsListItem as AppIconSettingsListItem} from '#/screens/Settings/AppIconSettings/SettingsListItem'
 import {type Alf, atoms as a, native, useAlf, useTheme} from '#/alf'
 import * as SegmentedControl from '#/components/forms/SegmentedControl'
 import {type Props as SVGIconProps} from '#/components/icons/common'
@@ -24,7 +23,6 @@ import {TextSize_Stroke2_Corner0_Rounded as TextSize} from '#/components/icons/T
 import {TitleCase_Stroke2_Corner0_Rounded as Aa} from '#/components/icons/TitleCase'
 import * as Layout from '#/components/Layout'
 import {Text} from '#/components/Typography'
-import {IS_INTERNAL, IS_NATIVE} from '#/env'
 import * as SettingsList from './components/SettingsList'
 
 type Props = NativeStackScreenProps<CommonNavigatorParams, 'AppearanceSettings'>
@@ -165,12 +163,12 @@ export function AppearanceSettingsScreen({}: Props) {
                 onChange={onChangeFontScale}
               />
 
-              {IS_NATIVE && IS_INTERNAL && (
+              {/*{IS_NATIVE && IS_INTERNAL && (
                 <>
                   <SettingsList.Divider />
                   <AppIconSettingsListItem />
                 </>
-              )}
+              )}*/}
             </Animated.View>
           </SettingsList.Container>
         </Layout.Content>