revert hiding fab

src/components/dms/dialogs/NewChatDialog.tsx

@@ -6,7 +6,6 @@ import {logger} from '#/logger'
 import {useCreateGroupChat} from '#/state/queries/messages/create-group-chat'
 import {useGetConvoForMembers} from '#/state/queries/messages/get-convo-for-members'
 import {FAB} from '#/view/com/util/fab/FAB'
-import {useIsWithinSplitView} from '#/screens/Messages/components/splitView/context'
 import {useTheme} from '#/alf'
 import * as Dialog from '#/components/Dialog'
 import {SearchablePeopleList} from '#/components/dialogs/SearchablePeopleList'
@@ -26,7 +25,6 @@ export function NewChat({
   const {t: l} = useLingui()
   const ax = useAnalytics()
   const requireEmailVerification = useRequireEmailVerification()
-  const {isWithinSplitView} = useIsWithinSplitView()
 
   const isGroupChatEnabled = ax.features.enabled(ax.features.GroupChatsEnable)
 
@@ -101,17 +99,14 @@ export function NewChat({
 
   return (
     <>
-      {/* in split view, header button is always available, so no need for FAB */}
-      {!isWithinSplitView && (
-        <FAB
-          testID="newChatFAB"
-          onPress={wrappedOnPress}
-          icon={<NewChatIcon size="lg" fill={t.palette.white} />}
-          accessibilityRole="button"
-          accessibilityLabel={l`New chat`}
-          accessibilityHint=""
-        />
-      )}
+      <FAB
+        testID="newChatFAB"
+        onPress={wrappedOnPress}
+        icon={<NewChatIcon size="lg" fill={t.palette.white} />}
+        accessibilityRole="button"
+        accessibilityLabel={l`New chat`}
+        accessibilityHint=""
+      />
       <Dialog.Outer
         control={control}
         testID="newChatDialog"

src/screens/Messages/ChatList.tsx

@@ -20,7 +20,7 @@ import {useListConvosQuery} from '#/state/queries/messages/list-conversations'
 import {EmptyState} from '#/view/com/util/EmptyState'
 import {List, type ListRef} from '#/view/com/util/List'
 import {ChatListLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder'
-import {atoms as a, useBreakpoints, useTheme} from '#/alf'
+import {atoms as a, useBreakpoints, useTheme, web} from '#/alf'
 import {AgeRestrictedScreen} from '#/components/ageAssurance/AgeRestrictedScreen'
 import {useAgeAssuranceCopy} from '#/components/ageAssurance/useAgeAssuranceCopy'
 import {Button, ButtonIcon, ButtonText} from '#/components/Button'
@@ -326,6 +326,16 @@ export function ChatList({selectedChat}: {selectedChat?: string}) {
       windowSize={11}
       desktopFixedHeight
       sideBorders={false}
+      disableFullWindowScroll={isWithinSplitView}
+      style={
+        isWithinSplitView && [
+          a.w_full,
+          web({
+            scrollbarWidth: 'thin',
+            scrollbarColor: `${t.palette.contrast_100} transparent`,
+          }),
+        ]
+      }
     />
   )
 }

src/screens/Messages/Conversation.tsx

@@ -10,12 +10,10 @@ import {Trans, useLingui} from '@lingui/react/macro'
 import {
   type RouteProp,
   useFocusEffect,
-  useIsFocused,
   useNavigation,
   useRoute,
 } from '@react-navigation/native'
 import {type NativeStackScreenProps} from '@react-navigation/native-stack'
-import {RemoveScrollBar} from 'react-remove-scroll-bar'
 
 import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback'
 import {useViewportZoomLock} from '#/lib/hooks/useViewportZoomLock'
@@ -49,7 +47,7 @@ import {Loader} from '#/components/Loader'
 import * as Prompt from '#/components/Prompt'
 import {Text} from '#/components/Typography'
 import {useAnalytics} from '#/analytics'
-import {IS_INTERNAL, IS_LIQUID_GLASS, IS_WEB} from '#/env'
+import {IS_INTERNAL, IS_LIQUID_GLASS} from '#/env'
 import {ChatDisabled} from './components/ChatDisabled'
 import {ChatEnded} from './components/ChatEnded'
 import {ChatLocked} from './components/ChatLocked'
@@ -105,7 +103,6 @@ function Inner({convoId}: {convoId: string}) {
   const convoState = useConvo()
   const {t: l} = useLingui()
   const {currentAccount} = useSession()
-  const isFocused = useIsFocused()
   const {top: topInset} = useSafeAreaInsets()
   const {data: convoData} = useConvoQuery({convoId})
 
@@ -154,8 +151,6 @@ function Inner({convoId}: {convoId: string}) {
 
   return (
     <Layout.Center style={[a.flex_1]}>
-      {/* MessagesList does not use the body scroll */}
-      {isFocused && IS_WEB && <RemoveScrollBar />}
       {!readyToShow && (
         <View style={IS_LIQUID_GLASS && {paddingTop: topInset}}>
           <MessagesListHeader convo={convo} />

src/screens/Messages/components/splitView/MessagesSplitViewLayout.tsx

@@ -1,7 +1,6 @@
 import {View} from 'react-native'
 import {type ScreenLayoutArgs, useIsFocused} from '@react-navigation/native'
 import {type NativeStackNavigationProp} from '@react-navigation/native-stack'
-import {RemoveScrollBar} from 'react-remove-scroll-bar'
 
 import {type FlatNavigatorParams} from '#/lib/routes/types'
 import {type NativeStackNavigationOptionsWithAuth} from '#/view/shell/createNativeStackNavigatorWithAuth'
@@ -9,6 +8,7 @@ import {atoms as a, useLayoutBreakpoints, useTheme, web} from '#/alf'
 import {useDialogControl} from '#/components/Dialog'
 import {NewChat} from '#/components/dms/dialogs/NewChatDialog'
 import {SCROLLBAR_OFFSET} from '#/components/Layout'
+import {LockScroll} from '#/components/LockScroll'
 import {useAgeAssurance} from '#/ageAssurance'
 import {IS_WEB} from '#/env'
 import {ChatList, Header as ChatListHeader} from '../../ChatList'
@@ -85,7 +85,7 @@ function MessagesSplitViewLayout({children, navigation, route}: LayoutProps) {
           ],
         },
       ]}>
-      {isFocused && <RemoveScrollBar />}
+      {isFocused && <LockScroll />}
       <SplitViewProvider side="left">
         <View
           style={[