WIP: mobile thread legend list

CLAUDE.md

@@ -6,7 +6,7 @@
 - No DOM elements (`<div>`, `<span>`, etc.) in plain `.tsx` files — use `Kb.*`. Guard desktop-only DOM with `Styles.isMobile`.
 - Temp files go in `/tmp/`.
 - Remove unused code when editing: styles, imports, vars, params, dead helpers.
-- Comments: no refactoring notes; only add when context isn't obvious from code.
+- Comments: no refactoring notes, no "we changed X" history; only add when context isn't obvious from code.
 - Exact versions in `package.json` (no `^`/`~`).
 - Keep `react`, `react-dom`, `react-native`, `@react-native/*` in sync with Expo SDK.
 - When updating deps: edit `package.json` → `yarn` → `yarn pod-install`.

shared/.maestro/performance/perf-thread-scroll.yaml

@@ -13,8 +13,8 @@ appId: keybase.ios
       - swipe:
           id: 'messageList'
           direction: DOWN
-          duration: 400
-          waitToSettleTimeoutMs: 50
+          duration: 50
+          waitToSettleTimeoutMs: 1
 
 # Press Home to trigger app background → flushes profiler data
 - pressKey: Home

shared/chat/conversation/input-area/normal/index.tsx

@@ -277,7 +277,7 @@ const styles = Kb.Styles.styleSheetCreate(() => {
   const suggestDesktop = {marginLeft: 15, marginRight: 15, marginTop: 'auto'}
   return {
     container: Kb.Styles.platformStyles({
-      isMobile: {justifyContent: 'flex-end'},
+      isMobile: {backgroundColor: Kb.Styles.globalColors.white, justifyContent: 'flex-end'},
     }),
     suggestionOverlay: Kb.Styles.platformStyles({
       isElectron: suggestDesktop,

shared/chat/conversation/input-area/normal/input.native.tsx

@@ -14,6 +14,7 @@ import type {Props as InputLowLevelProps, PlatformInputProps as Props, TextInfo,
 import {AudioSendWrapper} from '@/chat/audio/audio-send.native'
 import {Keyboard, TextInput, type NativeSyntheticEvent, type TextInputSelectionChangeEventData, useColorScheme} from 'react-native'
 import {MaxInputAreaContext} from './max-input-area-context'
+import {useAnimatedKeyboard} from 'react-native-keyboard-controller'
 import {
   default as Animated,
   skipAnimations,
@@ -431,11 +432,15 @@ const AnimatedInput = (() => {
       const {expanded, inputRef, ...rest} = p
       const lastExpandedRef = React.useRef(expanded)
       const offset = useSharedValue(expanded ? 1 : 0)
-      const maxHeight = maxInputArea - inputAreaHeight - 15
-      const as = useAnimatedStyle(() => ({
-        maxHeight: withTiming(offset.value ? maxHeight : threeLineHeight),
-        minHeight: withTiming(offset.value ? maxHeight : singleLineHeight),
-      }))
+      const keyboard = useAnimatedKeyboard()
+      const maxHeightBase = maxInputArea - inputAreaHeight - 15
+      const as = useAnimatedStyle(() => {
+        const maxHeight = maxHeightBase - keyboard.height.value
+        return {
+          maxHeight: withTiming(offset.value ? maxHeight : threeLineHeight),
+          minHeight: withTiming(offset.value ? maxHeight : singleLineHeight),
+        }
+      })
       React.useEffect(() => {
         if (expanded !== lastExpandedRef.current) {
           lastExpandedRef.current = expanded